Author: Author

WordPress.com vs WordPress.org (Important!)

Understanding the difference between WordPress.com and WordPress.org is crucial before creating your WordPress website. Many beginners get confused between these two platforms, which can lead to wasted time, unnecessary expenses, and limited website functionality.

What is WordPress.org?

WordPress.org is the official website where you can download the free, open-source WordPress software. This software allows you to create a fully customizable WordPress website by installing it on your own web hosting server. The software itself is free, and you have complete control over your website’s features, design, and plugins.

On WordPress.org, you can :

• Download the WordPress software for free
• Install it on any web server or hosting provider you choose
• Access and use thousands of free and premium themes and plugins
• Have full control over your website and data

When people say they use WordPress to build their websites, they usually mean that they have downloaded this open-source software from WordPress.org and installed it on their own hosting.

What is WordPress.com?

WordPress.com is a for-profit company that offers hosted WordPress websites with different plans and pricing tiers. It provides website building and hosting services bundled together, but with many limitations unless you upgrade to higher-tier paid plans.

Key points about WordPress.com include :

• Offers a free plan with very limited features
• Paid plans start at $4 per month (billed annually) and can go up to $45 per month
• Access to plugins and themes is restricted unless you upgrade to the Business plan ($40/month or more)
• Limited ability to install custom themes and plugins on lower-tier plans
• Hosting is included, but it is often more expensive than buying hosting separately

Many beginners mistakenly sign up on WordPress.com expecting full WordPress functionality but find out they need to pay high fees to unlock essential features. The personal and premium plans do not offer the full WordPress experience, forcing users to upgrade to expensive plans for business use.

Why WordPress.org is Recommended Over WordPress.com

Because WordPress.org offers the full open-source WordPress software for free, and you only pay for hosting and domain registration, it is more affordable and flexible. You can install any theme or plugin you want, customize your site extensively, and avoid costly monthly fees imposed by WordPress.com for advanced features.

Summary of why WordPress.org is better for most users :

• Complete control over your website and data
• Access to thousands of free themes and plugins without restrictions
• More affordable hosting options available
• Ability to monetize and customize your website freely
• No forced upgrades to expensive plans

WordPress.com is ideal for absolute beginners who want a simple blog with no maintenance, but for anyone serious about building a professional website, WordPress.org with your own hosting is the best choice.

—

The Correct Process

Building a professional WordPress website requires following a structured, step-by-step process. This ensures that your website is set up correctly from the start, is secure, and performs well. Below is an overview of the correct process to create your WordPress website from scratch.

Step 1 : Set Up Hosting

Your website needs to be hosted on a server that is always connected to the internet. Hosting is essentially renting space on a server where your website files are stored and served to visitors 24/7. Choosing reliable and affordable hosting is the first step.

Step 2 : Register Your Domain

A domain is your website’s address on the internet (e.g., yourwebsite.com). You will register a domain name that represents your brand, business, or personal site. A good domain name is short, simple, and easy to remember.

Step 3 : Install WordPress Software

After setting up hosting and domain, you install the WordPress software on your hosting server. This is usually a one-click process with most hosting providers, making it quick and easy for beginners.

Step 4 : Install a Theme and Plugins

Once WordPress is installed, you add a theme to control the design and layout of your site. You also install plugins to add extra functionality like contact forms, SEO tools, or page builders. Free themes and plugins like Astra and Elementor are excellent starting points.

Step 5 : Customize Your Website

Using a visual page builder like Elementor, you can customize your website without writing any code. This drag-and-drop editor allows you to modify pages, add content, images, and adjust layouts easily.

Summary Table of the Correct Process

Following this correct process ensures your WordPress website is professional, scalable, and easy to manage.

—

Getting Best WordPress Hosting

Choosing the right hosting provider is critical for the success of your WordPress website. Good hosting ensures your site loads quickly, remains secure, and is reliable with minimal downtime. Here’s a detailed guide on getting the best WordPress hosting.

Recommended Hosting Providers

The official WordPress.org website lists recommended hosting providers such as Bluehost, Hostinger, DreamHost, and WordPress.com itself. However, for beginners and budget-conscious users, Hostinger stands out due to affordability, ease of use, and performance.

Why Choose Hostinger?

• Affordable Pricing : Plans start as low as around $3 per month with discounts available.
• User-Friendly Dashboard : Hostinger’s dashboard is intuitive, making setup simple.
• Good Performance : Fast servers and optimized for WordPress speed.
• Customer Support : 24/7 support to help you with any issues.
• 30-Day Money-Back Guarantee : Risk-free trial period to test their services.

Choosing the Right Hosting Plan

Hostinger offers several plans, but the two most suitable for WordPress websites are :

If budget allows, the Business Plan is recommended for its enhanced speed and scalability. Otherwise, the Premium Plan is sufficient for most new websites.

Payment Options and Discounts

You can choose how many months or years to pay upfront. Paying for a longer period (e.g., 48 months) reduces the monthly cost significantly. For example :

• 48 months : Approximately $3.99/month for the first four years, then renews at around $8.99/month
• 12 months : Around $3.99/month, renews at higher rates after the first year

Additionally, using discount codes (like madxmedia) can give you an extra 10% off your hosting plan.

How to Sign Up for Hostinger Hosting

1. Go to the Hostinger website via a trusted affiliate link (e.g., in the tutorial’s video description).
2. Choose your preferred hosting plan (Premium or Business).
3. Select your payment period for best pricing.
4. Enter your email and create an account or sign up with Google.
5. Apply any coupon codes for additional discounts.
6. Complete the payment and proceed to the Hostinger dashboard.
7. Verify your email address through the confirmation email.

Once set up, you’re ready to move on to registering your domain and installing WordPress.

—

Registering Your Domain

Your domain name is your website’s online address, such as yourwebsite.com. It is essential to choose a domain that is memorable, professional, and fits your brand or personal identity. Here’s a detailed guide to registering your domain.

Choosing the Right Domain Name

When selecting a domain name, consider these points :

• Keep it short and simple : Easy to remember and type
• Use a .com extension : It is the most common and trusted domain extension
• Avoid numbers and hyphens : These can confuse visitors and look less professional
• Reflect your brand or purpose : Use your business name, your personal name, or relevant keywords

For example, for a personal portfolio site, johnsmith.com or for a company, medxmedia.com would be appropriate.

How to Register Your Domain with Hostinger

1. Log into your Hostinger dashboard.
2. Navigate to the “Home” section and click on “Claim Domain”.
3. Change the domain extension to “.com” for best recognition.
4. Enter your desired domain name in the search field.
5. Click on “Check Availability” to see if the domain is available.
6. If available, click “Claim Domain” to proceed with registration.
7. Fill in your contact details for domain registration — choose “Personal” if it’s a personal site or “Company” if it’s for business.
8. Complete the registration process by clicking “Finish”.
9. Verify your email address by clicking the link sent in the domain verification email.

Important Notes About Domain Registration

• Domain registration usually comes with an annual fee; some hosting plans may include a free domain for the first year.
• Keep your contact details accurate to avoid losing control of your domain.
• Verify your email promptly to activate your domain fully.
• Once registered and verified, your domain will be active and ready to connect to your hosting.

—

Installing WordPress

Installing WordPress is the next crucial step after securing your hosting and domain. Most modern hosting providers, like Hostinger, offer one-click WordPress installation to simplify the process for beginners.

Step-by-Step WordPress Installation on Hostinger

1. Log into your Hostinger dashboard.
2. Go to the “Hosting” section and select your hosting plan.
3. Click on “Setup” or “Setup Hosting Plan”.
4. You may be prompted to answer some setup questions; you can skip these to save time.
5. Choose to create a new website and select WordPress as your platform (not the website builder).
6. Enter your WordPress admin email (preferably the same as your hosting email) and create a secure password.
7. Select your domain name from the list of domains you own.
8. Choose the server location closest to your target audience for better performance (e.g., United States, Europe).
9. Click “Next” and wait while WordPress is installed automatically.
10. Once installed, you should be redirected to your WordPress dashboard.

Accessing Your WordPress Dashboard

If you are not automatically redirected, you can manually access the WordPress admin panel by typing the following URL in your browser :

yourdomain.com/wp-admin

Replace yourdomain.com with your actual domain. You will see the login screen where you enter your WordPress admin email and password created during installation.

Post-Installation Steps

After installation, your WordPress dashboard is your website’s control panel where you can :

• Install and activate themes
• Add plugins for extra functionality
• Create and edit pages and posts
• Manage users, settings, and more

From here, you can start building and customizing your website with themes like Astra and page builders like Elementor for a code-free design experience.

Choosing Your Theme

Choosing the right theme is a crucial step when building your WordPress website. A theme determines the overall design, layout, and appearance of your site. It provides the basic structure and style, allowing you to customize and build your site without writing any code. In this tutorial, we recommend using the Astra theme, which is one of the most popular free themes available for WordPress.

Why Choose Astra Theme?

Astra is favored for its lightweight design, flexibility, and compatibility with popular page builders like Elementor. It offers a clean, professional look and provides numerous customization options without overwhelming beginners.

To install Astra :

1. Navigate to your WordPress dashboard.
2. Go to Appearance > Themes on the left sidebar.
3. Click on Add New at the top.
4. Search for Astra using the search bar.
5. Click Install and then Activate.

Once activated, Astra becomes the active theme for your website, giving you a solid foundation to begin customizing your site using drag-and-drop page builders.

Benefits of Using a Theme

• Basic Structure : Themes provide the essential layout and design elements, such as headers, footers, and page templates.
• Customization Options : Most themes, including Astra, offer settings to modify colors, fonts, and layouts without coding.
• Compatibility : Astra works seamlessly with Elementor, enabling drag-and-drop editing and easy site building.
• Responsive Design : Astra is mobile-friendly, ensuring your site looks great on all devices.

Choosing a theme like Astra simplifies the website creation process, especially for beginners, by providing a user-friendly environment and robust functionality.

Installing Plugins

Plugins are essential tools that extend the functionality of your WordPress website. They can add new features, improve performance, and help with customization. After installing your theme, the next step is to install the necessary plugins to support your site building process.

Installing the Starter Templates Plugin

One crucial plugin recommended in this tutorial is the Starter Templates plugin. This plugin gives you access to hundreds of professionally designed website templates, making it easier to build your site quickly and efficiently.

1. From your WordPress dashboard, navigate to Plugins > Add New.
2. Search for Starter Templates in the search bar.
3. Click Install Now on the plugin and then click Activate.

Once activated, the Starter Templates plugin integrates with your page builder and offers a wide variety of templates tailored for different types of websites, such as portfolios, restaurants, blogs, and more.

Managing Pre-installed Plugins

If you have used hosting providers like Hostinger, you might find some pre-installed plugins that you won’t need. For example, Hostinger often includes plugins such as Hosting AI or Hosting Tools. In this tutorial, these plugins are unnecessary and can be safely deactivated and deleted to keep your website lean and avoid conflicts.

To deactivate and delete unwanted plugins :

1. Go to Plugins > Installed Plugins.
2. Select the plugins you want to remove by ticking their checkboxes.
3. From the Bulk Actions dropdown, select Deactivate and click Apply.
4. After deactivation, select the same plugins again, choose Delete from the bulk actions dropdown, and click Apply.

Caching Plugin

Another important plugin you might find is the LiteSpeed Cache plugin, which helps improve your website’s loading speed by caching content. However, during the website building phase, it is recommended to temporarily deactivate this plugin to avoid any caching issues while making changes. You can reactivate it once your website is complete.

Summary of Plugin Installation

• Install the Starter Templates plugin for easy access to professionally designed website templates.
• Deactivate and delete any unnecessary pre-installed plugins to keep your site clean.
• Temporarily disable caching plugins during development for smooth editing.
• Later, activate caching plugins to enhance website performance.

Choosing Best Page Builder

A page builder allows you to create and customize your website visually using drag-and-drop tools without writing code. In this tutorial, Elementor is chosen as the page builder due to its popularity, ease of use, and powerful features.

Why Elementor?

• User-Friendly Interface : Elementor offers an intuitive drag-and-drop editor, making it easy for beginners to design pages.
• Flexibility : It provides a wide range of widgets and design options to customize layouts, colors, fonts, and more.
• Template Library : Elementor integrates with the Starter Templates plugin, giving access to hundreds of ready-made templates and blocks.
• Responsive Design : Ensures your website looks great on desktops, tablets, and mobile devices.
• Free and Pro Versions : The free version is sufficient for most beginner needs, with an option to upgrade for advanced features.

How to Select Elementor as Your Page Builder

1. After installing the Starter Templates plugin, launch it by clicking Get Started.
2. At the top of the plugin interface, you will see an option to choose your page builder.
3. Select Elementor from the dropdown menu.
4. This selection will filter the available templates to those designed specifically for Elementor.

By choosing Elementor, you unlock the power to build highly customized pages with ease, enabling you to visually structure your content and instantly see the results.

Alternative Options

While Elementor is the recommended choice, there are other page builders available such as Beaver Builder, Divi, or the default Gutenberg editor. However, for beginners and those seeking a balance of simplicity and functionality, Elementor is typically the best choice.

Choosing Template

Starting with a pre-designed template significantly accelerates the website building process and ensures a professional look. The Starter Templates plugin provides access to hundreds of templates optimized for Elementor, covering a wide range of industries and purposes.

How to Choose a Template

1. Open the Starter Templates plugin from your WordPress dashboard.
2. Ensure Elementor is selected as your page builder.
3. Browse templates by categories such as portfolio, restaurant, business, blog, and more.
4. You can also use the search bar to find templates for specific website types (e.g., “portfolio”).
5. Templates are marked as free or premium; focus on free templates if you want to avoid additional costs.
6. Click on a template you like to preview it and customize some basic settings like logo, fonts, and colors.
7. Choose your preferred color scheme and continue to import the template.

Why Use Templates?

• Saves Time : No need to design every element from scratch.
• Professional Design : Templates are crafted by expert designers, ensuring a polished look.
• Customization Ready : Templates are fully customizable, allowing you to tailor them to your brand.
• Mobile Friendly : Templates are responsive and optimized for all devices.

For instance, if you’re building a portfolio website, you can search for “portfolio” templates, preview several options, and import the one that best suits your style. After import, you can customize content, images, and layout to make it your own.

Importing Templates

Once you choose a template, the plugin will automatically install all necessary plugins and build the website structure based on the template. This includes importing pages, menus, and demo content, giving you a fully functional website ready for customization.

Customizing Website

After installing your theme, plugins, and choosing a template, the final major step is customizing your website to make it uniquely yours. This involves editing page content, changing images, adjusting colors, and modifying headers and footers to match your brand identity.

Using Elementor to Customize Pages

Elementor is a visual page builder that allows you to customize your website by editing elements directly on the page.

• Accessing Elementor Editor : When logged into your WordPress dashboard, visit your website and click the Edit with Elementor link at the top bar to launch the editor.
• Page Structure : Elementor organizes pages into containers, columns, and widgets. On the right side, you can see an overview of this structure.
• Editing Text : Click on any text element to edit it. You can type directly or double-click to highlight and replace the content.
• Changing Buttons : Select a button to change its label, style, and link destination.
• Replacing Images : Click on an image element and use the media library to upload or select a new image.
• Adding Elements : Use the plus icon at the top left to drag and drop new widgets like headings, text editors, images, and more.
• Deleting Elements : Right-click on any element or container and select Delete to remove it.
• Saving Changes : Click Publish or Update at the bottom to make your changes live.

Customizing Headers and Footers

Headers and footers are key parts of your website’s design and branding. Using the WordPress customizer, you can easily modify these areas.

1. Click Customize at the top of your WordPress dashboard or through Appearance > Customize.
2. Hover over the header or footer area to reveal pen icons for editing.
3. Click the pen icon to open the editing options where you can change logos, contact information, social icons, and text.
4. Make your adjustments and save changes.

Adding and Editing Pages

You can add new pages to your website and customize them with Elementor :

1. In your WordPress dashboard, click Pages > Add New.
2. Give your page a name (e.g., “Our Team”) and click Publish.
3. Click Edit with Elementor to open the page builder for your new page.
4. Add content by dragging widgets or importing pre-made blocks from Elementor’s library.
5. Customize text, images, and layout as needed.
6. Save and publish your changes.

Managing Navigation Menus

After creating new pages, you may want to add them to your site’s navigation menu :

1. Go to Appearance > Customize > Menus.
2. Select your main menu (usually the one displayed in your header).
3. Click Add Items and select the pages you want to include.
4. Arrange menu items by dragging them in the desired order.
5. Click Publish to save changes.

Tips for Effective Customization

• Consistency : Use consistent fonts, colors, and styles throughout your website.
• Keep it Simple : Avoid clutter by only adding necessary elements and content.
• Mobile Optimization : Preview your site on different devices to ensure responsiveness.
• Use Templates and Blocks : Leverage pre-made Elementor blocks and templates to speed up the design process.
• Regularly Save : Always save or publish your changes frequently to avoid losing progress.

With Elementor and your chosen theme and template, you have all the tools needed to create a professional, fully customized WordPress website without any coding knowledge.

Understanding Website Structure

Before diving into editing your WordPress website, it’s essential to understand how your website is structured, especially when using the Elementor page builder. Website structure refers to the way your pages, sections, containers, columns, and elements are organized and nested within each other. This hierarchical setup determines how the content appears visually and how easy it is to manage and customize.

How Elementor Organizes Website Content

In Elementor, the structure of your website is broken down into containers and elements. Each page is made up of multiple containers that hold different types of content, such as text, images, buttons, and lists. Understanding this structure helps you navigate and edit your pages efficiently.

Containers and Columns

The highest level of structure on a page is the container. For example, the homepage may have a top container representing the header section. Inside this container, there can be multiple columns, which are smaller containers aligned horizontally. Each column can then contain various elements.

For example, in the video tutorial, the homepage’s first container was divided into three columns :

• First column : contained an icon list element
• Second column : included a heading, text, and a button
• Third column : contained an image element

This same structure applies to other containers on the page and other parts of your website, allowing for precise control over layout and content placement.

Elements Within Containers

Elements are the smallest building blocks inside containers and columns. These include :

• Text blocks (headings, paragraphs)
• Buttons
• Images
• Lists (icons, bullet points)
• Dividers and other decorative items

Each element can be selected and customized individually. This modular approach means you can edit or remove specific content parts without affecting the entire container or page.

Accessing the Structure View

Elementor provides an overview of your page’s structure on the right side panel. This feature shows a tree-like view of all containers and elements. This visual hierarchy helps you understand how your page is layered and makes it easy to select and edit specific parts.

Benefits of Understanding Website Structure

• Efficient Editing : Knowing how containers and elements nest helps you quickly find the part you want to edit.
• Better Customization : You can add, move, or delete containers and elements without disrupting your entire layout.
• Professional Layouts : Understanding structure ensures your website looks clean, organized, and professional.

In summary, grasping the website structure with Elementor is foundational to creating a flexible and visually appealing WordPress website. It empowers you to customize every aspect of your site with confidence.

Editing Website Elements

Editing website elements in WordPress with Elementor is straightforward and intuitive. Once you understand the website structure, as described above, you can start customizing your site by modifying text, images, buttons, and other components directly on the page.

How to Edit Text Elements

Text editing is one of the most common tasks. To edit a text block (like a heading or paragraph) :

1. Hover over the text you want to change and click on it.
2. The editing options will appear on the left sidebar in Elementor.
3. You can directly change the text in the content box or double-click the text on the page to highlight and rewrite it.
4. Customize font size, color, alignment, and other typography settings as needed.

This live editing feature allows you to see changes instantly, making it easy to experiment and perfect your content.

Editing Buttons and Adding Links

Buttons are interactive elements that often guide visitors to other pages or external websites. To edit a button :

1. Click on the button element you want to edit.
2. In the left sidebar, change the button text to whatever you want visitors to see.
3. Add or modify the URL link. You can link the button to another page on your website, an external URL, or even an email address.
4. Adjust button styles such as color, size, border, and hover effects under the style tab.

For example, you might link a button to your portfolio page by typing the page name and selecting it from the suggestions.

Changing Images

To replace or edit an image :

1. Click on the image you want to change.
2. On the left sidebar, click the “Choose Image” or “Change Image” button.
3. Upload a new image or select one from your media library.
4. Adjust image size, alignment, and other settings as needed.

This process allows you to keep your website fresh with new visual content easily.

Adding New Elements

Elementor provides a wide range of elements you can add to your pages, such as headings, images, videos, spacers, and more. To add a new element :

1. Click the plus (+) icon at the top left of the Elementor panel.
2. Drag and drop your desired element onto the page where you want it.
3. Customize the element’s content and style from the left sidebar.

This drag-and-drop functionality enables quick and flexible page building without any coding knowledge.

Deleting Elements and Containers

If you want to remove an unwanted part of your page :

1. Right-click on the element or container you want to delete.
2. Select “Delete” from the context menu.

You can delete single elements or entire containers that might hold multiple elements. This helps keep your design clean and focused.

Publishing Your Changes

After editing, it’s important to save and publish your changes to make them visible to your website visitors. To do this :

• Click the Publish button at the bottom or top of the Elementor editor.
• You can preview your changes before publishing by clicking the Preview icon (eye icon).

Publishing immediately updates your live website with the new content and design adjustments.

Adding New Page

Adding new pages to your WordPress website is essential for expanding your content and enhancing navigation. Elementor and WordPress make this process simple and beginner-friendly.

Steps to Add a New Page

1. Open a new browser tab and enter your website URL.
2. Ensure you are logged into your WordPress dashboard. When logged in, a WordPress admin bar appears at the top of the page.
3. Click on the New button in the top admin bar, then select Page from the dropdown menu.
4. Enter a name for your new page (for example, “Our Team”).
5. Click Publish to make the page live.

Editing the New Page with Elementor

Once the page is published, you can immediately start customizing it with Elementor :

1. Click the Edit with Elementor button at the top of the page or within the WordPress dashboard under Pages.
2. The Elementor editor will open, where you can drag and drop elements to build your page.

Using Pre-made Templates for New Pages

To speed up page creation and achieve a professional look, you can use pre-made templates :

1. In Elementor, click on the Folder icon to open the template library.
2. Navigate to the Blocks tab to see sections designed for specific page parts.
3. For example, for an “Our Team” page, type “team” in the search bar to filter relevant templates.
4. Choose a block or full page template you like and click Insert to add it to your page.
5. Customize the template by editing text, images, and other elements to fit your content.

Importing Entire Pages from Templates

If you want to import a whole page from the template library :

1. Click the Folder icon in Elementor.
2. Go to the Pages section to browse full page templates.
3. Select a page template and click Import Template.
4. The entire page will be imported, and you can then modify it as needed.

Publishing and Previewing Your New Page

After editing, click the Publish button in Elementor to make the new page live. Use the preview icon to view your page as visitors will see it.

Adding the New Page to Your Navigation Menu

To make your new page accessible from the website’s navigation menu :

1. Click on Customize from the WordPress admin bar or dashboard.
2. Go to Menus and select your main menu (usually labeled “Main Menu”).
3. Click Add Items and select the new page you created (e.g., “Our Team”).
4. Add the page to the menu and click Publish to save the changes.

Now, your visitors can easily navigate to your new page from the website menu.

Importing Templates

Importing templates is a powerful way to jumpstart your WordPress website design. Instead of building pages from scratch, you can use professionally designed templates to save time while maintaining a polished look. The Starter Templates plugin combined with Elementor provides access to hundreds of such templates.

Choosing Your Page Builder

When you open the Starter Templates plugin for the first time, you need to select your preferred page builder. Since Elementor is one of the most popular and flexible builders, it is recommended :

• Select Elementor as your page builder.
• This filters the template library to display only Elementor-compatible templates.

Browsing Template Categories

The template library is organized into categories based on website types or industries, making it easier to find relevant designs :

• Examples include restaurant, portfolio, business, blog, and more.
• You can also use the search bar to look for specific templates, such as “portfolio.”

Free vs Premium Templates

While many templates in the library are free, some are marked as premium. For beginners or those on a budget, there are plenty of free options that provide a professional appearance and full functionality without any cost.

Importing a Template

1. Once you find a template you like, click on it.
2. You can customize some basic settings such as logo upload, font styles, and color schemes before importing.
3. Click Continue and then choose whether to add additional features or stick with the basic setup.
4. Click Submit to import the template and install any required plugins.
5. The template will be added to your WordPress site, ready for customization.

Importing Individual Blocks or Pages

If you don’t want to import a full template, Elementor allows you to import individual blocks or pages from templates :

• Open the Elementor editor and click the Folder icon.
• Browse blocks or pages in the template library.
• Click on a block or page and select Import.
• Customize the imported content as needed.

Advantages of Importing Templates

• Save Time : Quickly build professional pages without starting from scratch.
• Consistent Design : Templates ensure a unified look and feel across your website.
• Easy Customization : Modify any element in the imported template to suit your brand.

Importing templates is an essential step for anyone looking to build an attractive website efficiently using WordPress and Elementor.

Editing Navigation Menu

The navigation menu is a crucial part of your website’s usability, allowing visitors to find pages quickly. WordPress makes it easy to edit and customize your site’s menu to include new pages, rearrange items, and create submenus.

Accessing the Menu Customizer

To edit your navigation menu :

1. Click on Customize in the WordPress admin bar or go to Appearance > Customize in the WordPress dashboard.
2. Select the Menus section.
3. Choose the menu you want to edit, usually labeled as Main Menu or Primary Menu.

Adding Pages to the Menu

To add a new page (such as the “Our Team” page) to the navigation menu :

1. Click on Add Items.
2. Select the page from the list or search for it by name.
3. Click on the page to add it to the menu.
4. Drag and drop menu items to rearrange their order.

Creating Submenus (Dropdowns)

You can create dropdown menus by nesting items :

• Drag a menu item slightly to the right underneath another menu item.
• This indents the item, making it a submenu of the parent.
• Submenus appear as dropdowns on the live website navigation.

Removing or Editing Menu Items

If you want to remove a menu item :

1. Click on the menu item to expand its settings.
2. Click Remove to delete it from the menu.

You can also rename menu items or change their links here.

Saving and Publishing Menu Changes

Once you finish editing the menu, click Publish in the customizer to apply the changes to your live site.

Best Practices for Navigation Menus

• Keep menu items concise and descriptive.
• Limit the number of top-level items to avoid clutter.
• Use submenus to organize related pages neatly.
• Ensure important pages are easily accessible from the menu.

Editing your navigation menu properly enhances the user experience by making your website easy to navigate and helping visitors find the information they need quickly.

Editing Header & Footer

The header and footer are consistent elements displayed across all pages of your website. They typically contain branding, navigation links, contact information, and other critical details. Editing these areas ensures your website has a cohesive and professional appearance.

Editing the Header

To customize the header :

1. From your website front-end, ensure you are logged into WordPress to see the admin bar at the top.
2. Click on Customize in the admin bar.
3. Hover your mouse over the header area on your website.
4. Pen icons will appear on editable elements like the logo or menu.
5. Click on the pen icon next to the logo to change it. You can upload a new logo image here.
6. Other header elements like menus can be edited by clicking their respective pen icons.

Editing the Footer

To modify the footer :

1. In the same WordPress customizer, scroll down to the footer area.
2. Click on the pen icons that appear over footer elements.
3. This opens the footer builder interface where you can :
• Change the footer logo.
• Edit contact information such as email addresses.
• Modify social media icons or other text displayed in the footer.

Using Elementor for Header and Footer Customization

Some themes and plugins allow you to edit header and footer templates directly in Elementor for more advanced customization :

• Edit layout, add custom widgets, and style these areas visually.
• Create multiple header/footer versions and assign them to different pages if needed.

Best Practices for Header and Footer Design

• Header : Keep it clean and simple with clear branding and easy navigation.
• Footer : Include useful links, contact info, and social media icons.
• Ensure both are mobile-friendly and consistent across all pages.

Properly editing the header and footer provides a polished, trustworthy appearance and improves site navigation and user engagement across your entire WordPress website.