How to Update Your WordPress Website Content Using Elementor PRO: A Step-by-Step Guide

Elementor PRO is a powerful page builder that allows you to easily customize and update your WordPress website’s content without needing to write any code. In this guide, we’ll walk you through the process of updating text, images, and other content on your website using Elementor PRO.

Step 1: Log in to Your WordPress Dashboard

1. Open your web browser and go to your WordPress website login page (e.g., www.yourwebsite.com/wp-login).
2. Enter your username and through the Frogg Designs security you will receive a confirmation email. Click the Log In Button.

Step 2: Access the Page You Want to Edit

1. Once you’re in the dashboard, navigate to the page you want to edit:
   • Click on Pages from the left-hand menu.
   • Find the page you want to update (e.g., “Home” or “About Us”).
   • Hover over the page title, and click Edit with Elementor.

This will open the Elementor page builder interface where you can directly edit your page.

Step 3: Understanding the Elementor Interface

Before you start editing, familiarize yourself with the Elementor interface:

• Left Sidebar: This contains the widgets and settings you’ll use to update your page. Widgets include text, images, buttons, and more.
• Main Canvas: This is the live preview area where you can see and edit the actual content of your page.
• Blue Editing Sections: Hovering over any section on your page will show a blue border with icons at the top. These icons allow you to edit the section, column, or widget.

Step 4: How to Edit Text

1. Click on the Text You Want to Edit:

   • Locate the text block you wish to update on the main canvas.
   • Click on the text, and the editing panel will open on the left sidebar.

2. Edit the Text in the Left Sidebar:

   • In the sidebar, you’ll see a text editor where you can type or paste new content.
   • You can also format the text (bold, italic, lists, etc.) and add links if needed.

3. Styling Your Text (optional):

   • To change font size, color, or alignment, click on the Style tab in the left sidebar.
   • Adjust the typography, text color, and other styling options as desired.

4. Save Your Changes:

   • Once you’re happy with the updates, click the Update button at the bottom of the Elementor panel.

Step 5: How to Update Images

1. Select the Image You Want to Replace:

   • Click on the image you want to change on the main canvas.
   • The left sidebar will show the image settings.

2. Replace the Image:

   • In the left sidebar, click on the image thumbnail under the Image section.
   • The WordPress media library will open. You can either:
     • Upload a new image by clicking Upload Files and selecting a file from your computer.
     • Choose an existing image from your media library.

3. Image Styling Options:

   • You can adjust image size, alignment, and link settings from the left sidebar.
   • For more advanced options, go to the Style tab to add image effects like borders, shadows, or opacity changes.

4. Save Your Changes:

   • Click the Update button in the bottom left to save your changes.

Step 6: How to Edit Buttons and Links

1. Click on the Button You Want to Edit:

   • Click on any button you want to update. This will open the button settings in the left sidebar.

2. Edit Button Text and Link:

   • Under the Content tab, you can:
     • Change the button text by typing a new label.
     • Add or update the button link by entering a URL in the Link field.

3. Style Your Button:

   • To change the button color, size, or typography, go to the Style tab.
   • Here, you can customize the button’s normal and hover states (e.g., the color when someone hovers over the button).

4. Save Your Changes:

   • Once you’re satisfied with the updates, click the Update button.

Step 7: How to Add New Sections or Widgets

1. Add a New Section:

   • Scroll to the location where you want to add a new section on the page.
   • Click the + icon in the main canvas to create a new section.
   • Choose a section layout (single column, two columns, etc.).

2. Drag and Drop Widgets:

   • To add new content, go to the Elements panel on the left and drag the desired widget (e.g., text, image, video) into the new section.
   • Once the widget is placed, you can customize it in the left sidebar.

3. Save Your Changes:

   • Always click Update after making changes to ensure the new section or widget is saved.

Step 8: How to Duplicate or Delete Sections

1. Duplicating a Section:

   • If you want to replicate a section, hover over the section and click the right-click button on your mouse.
   • Select Duplicate to create a copy of the section below the original.

2. Deleting a Section:

   • To remove a section, hover over the blue section handle, right-click, and select Delete.

3. Save Your Changes:

   • Click Update to apply any duplications or deletions.

Step 9: Preview Your Changes Before Publishing

1. Before publishing any changes, you can preview them to see how they’ll look live:

   • Click the eye icon next to the Update button to preview the page.
   • This will open a new tab showing the changes as they would appear on your live website.

2. If everything looks good, you can publish the changes by clicking Update.

Step 10: Finalize and Publish Your Updates

• Once you’ve made all the necessary changes, click the Update button in the bottom left of the Elementor sidebar to publish the updates to your website.

Helpful Tips

• Undo Changes: If you make a mistake, use the Undo button (CTRL + Z or Command + Z) or click the History icon in the bottom left corner of the Elementor sidebar to revert back to previous versions.

• Mobile and Tablet Editing: To ensure your content looks good on all devices, click the Responsive Mode icon in the bottom left and toggle between desktop, tablet, and mobile views to make device-specific changes.

By following these steps, you can easily update and manage your WordPress website’s content using Elementor PRO. Whether you’re editing text, replacing images, or adding new sections, Elementor makes the process intuitive and user-friendly.