The contact page of the Oceanic demo site was created with Elementor Page Builder.
Plugins used in this Template
Importing the Template
- Install Elementor Page Builder.
- Navigate to Appearance > Page Layouts, locate the Oceanic contact page template in the list and click the Import button.
- Once the template has finished importing it will be added to your Elementor Templates which can be viewed under Templates
Inserting the Template into a Page
- Edit the page you wish to insert the template into and click the Edit with Elementor button.
- Once the Elementor editor has loaded you will see a block on the page with text that reads “Drag widget here” with a folder icon above the text. Click the folder icon and you will see a popup with the option to import your own page template.
- Click the My Templates tab at the top of the popup and you will see a list of the templates currently in your Elementor template library.
- Locate the Oceanic contact page template in the list and click the green Insert button.
- Once you’ve inserted the template please ensure that the correct page layout is selected by clicking the small cog icon at the bottom left of the page. Once you’ve clicked it you will see a General Settings panel with a Page Layout dropdown located at the bottom. The correct page layout for the Oceanic contact page is “Full Width, No Bottom Margin”.
WPForms Widget
The contact form was created with the WPForms plugin. To create your contact form navigate to WPForms > Add New. If you are using the Premium version of the plugin you will be able to select from a list of pre-built form templates. Once you have created your contact form edit the WPForms widget in the page template and select your newly created contact form from the Form dropdown.
Google Maps Widget
You will need to edit the Google Maps widget and add your API key. For additional information please refer to the following page. For more information on authentication and Google Maps JavaScript API services please see Google’s documentation.