In this post, we will guide you through the process of designing your website using the Elementor plugin. I am using the Pro version.
Elementor Pro offers advanced features for creating headers, footers, and blog pages, making it an ideal choice for your website design needs. So, let’s dive in and learn how to harness the full potential of Elementor Pro!
Step 1: Purchase and Install Elementor Pro
To begin, you’ll need to purchase and install Elementor Pro. While there is a free version available, the Pro version offers enhanced functionality and theme-building capabilities. Visit the Elementor pricing page to choose the plan that suits your needs. Once you’ve made the purchase, you’ll receive an email containing your login details and API key, which are necessary for the installation process.
To install Elementor Pro, log in to your Elementor Pro account and locate the download link on the account page. Download the plugin and navigate to your WordPress Dashboard. From the side menu, select “Plugins” and click on “Add New.” Before installing the Pro version, make sure to install and activate the free version of Elementor. Then, upload the Elementor Pro file you downloaded earlier and activate the plugin.
Step 2: Basic Elementor Settings
After installing Elementor Pro, it’s important to configure some basic settings. To access the Elementor settings, go to your WordPress Dashboard and click on “Elementor” in the left-hand menu. The settings page consists of four main tabs: General, Style, Integrations, and Advanced.
In the General tab, ensure that the “Posts” and “Pages” options are checked to allow Elementor to edit those types of content. If you plan to add custom fonts, deselect the option for Elementor’s fonts and colors. This section also allows you to manage custom fonts by uploading web-compatible font files (e.g., .WOFF format) through the Elementor backend.
Additionally, explore the “Getting Started” and “Get Help” tabs under the “Elementor” section in the WordPress backend. These resources provide tutorials and support options to help you navigate Elementor effectively.
Step 3: Front-End Elementor Settings
To make changes to Elementor’s front-end settings, you need to access a page or post where you want to use Elementor. Open the desired page in the WordPress backend by going to Pages > All Pages and selecting “Edit” for the chosen page. Once on the front end, click on the “Edit with Elementor” button to access the Elementor editor.
To set up default colors, click on the hamburger icon at the top left corner of the editor and navigate to the “Style” section. Choose “Default Colors” and define your color palette to align with your branding. Remember, these default colors can be customized on a per-page or per-section basis.
Step 4: Using Elementor
To help you learn how to use Elementor efficiently, we recommend watching our video tutorial included in our Profitable Website Academy. This video will guide you through the various features and functionalities of Elementor, turning you into an Elementor wizard in no time.
Step 5: Theme Builder
Elementor’s Theme Builder allows you to create a complete website by designing headers, footers, and other template parts. For a detailed walkthrough, refer to Elementor’s blog post titled Create a Complete Website Using Elementor Kits and Theme Builder.
If you’re looking for help with your website, please check out my services or feel free reach out!
Cheers,
Katie
