(with and without Elementor) #
Overview #
Pages are used for evergreen, structured content that rarely changes and usually forms part of your site’s main navigation. Examples include:
- About Us
- Membership Benefits
- Join or Renew
- Resources Library
- Professional Development
- Advocacy and Policy
- Contact Us
This guide will show how to create a page using:
- The default WordPress Block Editor (Gutenberg)
- Elementor (for advanced layouts)
Part 1: Creating a Page Using the WordPress Block Editor #
Step 1: Navigate to Pages #
- Log in to the WordPress admin dashboard.
- Go to Pages > Add New.
Step 2: Add a Page Title #
Enter a clear, descriptive page title in the “Add title” field.
Examples for Associations:
- “Membership Options”
- “Continuing Professional Development (CPD)”
- “Our Constitution & By-Laws”
Step 3: Add Page Content Using Blocks #
Use the Block Editor to build your page:
- Click the + (Add Block) button
- Common blocks to use:
- Heading (H2 or H3 for structure)
- Paragraph (for general content)
- Image or Gallery
- File (e.g., downloadable PDFs for policy or forms)
- Buttons (e.g., “Download Form”, “Join Now”)
- Columns (to format text/images side by side)
Example: Join or Renew Page
Heading: Join or Renew Your Membership
Paragraph: Become part of our national network of professionals...
Button: [Join Now]
File Block: [Download our Membership Guide PDF]
Step 4: Set a Featured Image #
- In the Featured Image panel, upload an image that represents the page (used by some themes in headers or previews).
Example: For a “Professional Learning” page, use an image of a workshop or training session.
Step 5: Adjust Page Attributes (If Required) #
- Under Page > Page Attributes, you can:
- Set a Parent Page to nest pages in a hierarchy (e.g. “Membership” > “Membership Benefits”)
- Select a Page Template if your theme includes multiple layouts
Step 6: Preview and Publish #
- Click Preview to check the layout and formatting
- Click Publish once ready to go live
Part 2: Creating a Page Using Elementor #
Why Use Elementor for Pages? #
Elementor gives greater control over layout, styling, and visual design. Ideal for pages that need:
- Rich visuals
- Call-to-action areas
- Multi-column layouts
- Icons, sliders, videos, or interactive content
Step 1: Navigate to Pages > Add New #
- Click “Add New” under Pages
- Add a title, then click “Edit with Elementor”
Step 2: Build the Page Using Widgets #
Drag-and-drop widgets from the left into the canvas:
- Heading and Text Editor for content
- Image, Icon, or Video
- Columns and Sections for layout
- Tabs or an Accordion for policy/guidance content
- Button, Call to Action, or Form widgets
Example: Professional Learning Page
Hero Section:
- Heading: “Advance Your Career Through CPD”
- Text: Short intro text
- Button: [Explore Upcoming Courses]
Section 2:
- Two Columns:
- Left: Image of training in progress
- Right: List of CPD offerings using Icon List
Section 3:
- Accordion Widget:
- FAQs about CPD credits and eligibility
Step 3: Responsive Editing #
- Click the Responsive Mode icon in the Elementor footer
- Switch between Desktop / Tablet / Mobile
- Adjust spacing, font size, and column widths to ensure mobile compatibility
Step 4: Save and Publish #
- Click Update to save changes
- Use the WordPress icon to return to the dashboard if you need to adjust settings like:
- Parent Page
- Navigation Menu
- SEO Meta Descriptions (if SEO plugin installed)
Best Practice Examples for Membership Associations #
| Page Title | Purpose |
|---|---|
| Membership Options | Explains tiers (e.g. Individual, Student, Corporate), pricing & benefits |
| Our Advocacy Work | Lists lobbying activities, media statements, or policy priorities |
| Code of Conduct | Link to downloadable PDF + overview of professional standards |
| Find a Member Directory | Searchable member listings, powered by directory plugin or custom build |
| Professional Learning | Promote upcoming events, workshops, and CPD offerings |
| Join or Renew | Clear steps, benefits, eligibility, and call-to-action |
| Member Resources | Organised document links or downloads (e.g. templates, toolkits) |
Troubleshooting Tips #
| Issue | Solution |
|---|---|
| Elementor not loading | Clear browser cache, disable conflicting plugins, or use Safe Mode |
| Layout looks broken on mobile | Use Responsive Mode and adjust paddings/margins per device |
| New page not in menu | Go to Appearance > Menus and add the page manually |
| Changes not saving | Check for plugin conflicts or try updating from the WP editor side |
Recap: When to Use Elementor vs Classic Editor #
| Use Case | Recommended Editor |
|---|---|
| Simple pages with mostly text/images | Classic Editor |
| Pages with branding-heavy layouts | Elementor |
| CPD, Membership, Join Now (with visuals) | Elementor |
| Policy/terms pages with minimal formatting | Classic Editor |
