Category: WordPress & Theme Customisation
Audience: Clients of Thomas McKee Website Design & SEO Solutions using Elementor-based websites.
Goal: Teach clients how to make simple content edits, add or rearrange sections, and maintain design consistency safely within Elementor.
Elementor is one of the most intuitive tools available for customizing WordPress websites — and it’s a core part of many sites we build at Thomas McKee Website Design & SEO Solutions.
This guide will help you confidently use Elementor to edit pages, update content, and make light layout adjustments. You’ll learn how Elementor is structured, what you can safely change, and when to contact our team for assistance.
When used correctly, Elementor lets you update your website quickly while maintaining the professional design and performance standards we created for your brand.
Elementor is a visual drag-and-drop page builder that replaces the default WordPress editor.
It lets you design pages in real time, directly on the front end — you see exactly what visitors will see as you make changes.
Elementor’s structure is made up of three main building blocks:
| Level | Description | Example |
|---|---|---|
| Sections | Horizontal rows that hold content | Full-width areas like Hero banners or page intros |
| Columns | Divide sections vertically | Two-column layouts with text on one side and an image on the other |
| Widgets | Actual content elements | Text, Image, Button, Video, Icon, or Form |
Understanding this structure makes it easy to navigate your layout safely.
Log in to your WordPress dashboard (https://yourdomain.com/wp-admin).
Navigate to Pages → All Pages.
Hover over the page you wish to edit and click Edit with Elementor.
Your screen will now display:
The main preview area (your page content)
The Elementor sidebar (tools and widgets) on the left
The bottom control bar (for preview, save, and responsive settings)
Click directly on the text you want to modify.
Type your new content into the text box or sidebar editor.
Use the sidebar to adjust alignment, style, or links.
Avoid changing font family, size, or color — those are part of your global style settings.
Click on an image widget.
In the left panel, click Choose Image.
Upload a new image or select one from the Media Library.
Always add ALT text and compress large images (<150 KB).
Click Update when done.
Click on the button.
In the left panel, edit the text and link.
Keep button colors and shapes consistent with the existing style guide.
Test all links after updating.
Click the + icon in the main preview.
Choose your column structure (e.g., 1, 2, or 3 columns).
Drag widgets (Text, Image, etc.) from the sidebar into the new section.
Adjust margins and padding as needed.
Hover over the section’s handle (blue outline).
Right-click and choose Duplicate.
Drag the new copy where you want it.
This is safer than building from scratch and maintains consistency.
Hover over the section handle → Right-click → Delete.
Tip: Deleting is permanent. Save a backup or duplicate before removing anything critical.
Some content — such as headers, footers, or promotional banners — is part of Global Templates.
These are shared across multiple pages.
Editing a global item updates every page using it.
You’ll see a message like “This is a global widget.”
Only edit these if you’re confident or have confirmed with our team.
To avoid site-wide changes, click Unlink from Global before editing (when appropriate).
Click the Responsive Mode icon (monitor) in the bottom bar to toggle between:
Desktop
Tablet
Mobile
This ensures your layout looks great on all devices.
You can modify:
Font sizes
Spacing and margins
Column stacking order
These settings apply only to the device view you’re editing — Elementor automatically manages the rest.
Reduce large headings
Center-align images and buttons
Ensure no text runs off the screen
Always preview changes on a real device before publishing.
| Option | Function |
|---|---|
| Update | Makes your changes live immediately |
| Save Draft | Saves work privately for later |
| Preview Changes | Opens a new browser tab showing the page |
| Undo / Redo | Keyboard shortcuts: Ctrl+Z or Cmd+Z |
Tip: Save frequently — Elementor autosaves, but manual saves prevent data loss.
Elementor allows saving and reusing designs:
Click the arrow beside the Update button → Save as Template.
Name it descriptively (e.g., “Service Page Layout”).
To reuse: click the Folder icon and insert your saved template.
Reusable banners or CTA strips are global sections. Edit cautiously — changes will affect all pages that use them.
Avoid importing templates from third-party sources unless approved. They can introduce heavy scripts and break your design.
These are controlled by Elementor Theme Builder or your active theme.
Go to Templates → Theme Builder.
From here, you can view:
Header template
Footer template
Popup templates
Only adjust text or contact details. Avoid changing structural layout, as it affects every page.
Preview first. Always check before hitting Update.
Duplicate before experimenting. Right-click → Duplicate keeps a safe copy.
Avoid global changes. Edits to shared templates affect the whole site.
Maintain brand consistency. Stick to your existing colors and fonts.
Optimize your images. Upload properly sized and compressed files.
Test responsiveness. Ensure all edits look good on mobile.
Avoid adding too many animations. They slow down load speed.
Contact support if unsure. We can advise before you publish.
| Problem | Likely Cause | Fix |
|---|---|---|
| Page doesn’t load in Elementor | Browser cache or plugin conflict | Clear cache, disable conflicting plugin |
| Changes not appearing | Browser caching | Hard refresh (Ctrl+F5) |
| Text overlaps on mobile | Missing responsive adjustment | Use Responsive Mode to fix spacing |
| “The preview could not be loaded” | PHP or memory limit | Contact support — we’ll increase resources |
| Slow editing experience | Too many browser tabs or outdated plugins | Close tabs, update plugins, or clear Elementor cache |
Keep Elementor and Elementor Pro updated (we handle this if you’re on a maintenance plan).
Avoid installing unknown addons — some can cause instability.
Don’t use large background videos.
Log out after each session.
Use Google Chrome for the most stable editing experience.
✅ DO:
Edit only content, not structure, unless experienced.
Use existing section styles for consistency.
Check all links after edits.
Use the built-in image optimizer or compression tool.
❌ DON’T:
Delete sections tied to dynamic content (contact forms, blog archives).
Install third-party Elementor widgets without approval.
Modify theme templates unless trained.
Edit on mobile view alone.
Reach out to Thomas McKee Website Design & SEO Solutions if:
You want to add a new layout or functionality (e.g., a new service section).
You encounter “critical error” messages.
Your site layout breaks after a save.
You accidentally delete a section or template.
You want training for advanced Elementor features.
We can often fix layout issues in minutes or provide a recorded walkthrough showing exactly how to edit safely.
Q: Can I use Elementor on every page?
Yes — most pages are built with Elementor, but a few (like blog posts) may use WordPress’s standard editor.
Q: Will my edits affect SEO?
As long as you don’t remove headings, change URLs, or overuse large images, your SEO won’t be harmed.
Q: Can I edit the homepage layout?
Yes, but proceed carefully. The homepage typically contains multiple global sections. Contact us if you’re unsure which areas are safe to modify.
Q: I made a mistake. Can it be undone?
Yes — use Elementor’s History feature or contact us to restore from backup.
Q: Can I add new pages using Elementor?
Absolutely. Create a new page → Click “Edit with Elementor” → Choose a template → Save and publish.
Elementor gives you the power to update and expand your website quickly, while our design foundation ensures everything stays polished and on brand.
Use this guide to make safe, effective edits — and remember, if you’re ever unsure, we’re here to help.
At Thomas McKee Website Design & SEO Solutions, we want you to have confidence managing your own content while knowing you always have professional support behind you.