How to create and customize headers and footers with Elementor Free Edition

In this article, it will be explained in detail how to use the Elementor Free Edition respond in singing ElementsKit Plugin(a free Elementor header and footer builder) to create and customize the Elementor Header and FooterThis is done entirely through a visual interface.

图片[1]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

Step 1: Install Elementor

First, make sure that your WordPress The site has the Elementor plugin installed and enabled. Install it by following the steps below:

  1. In the WordPress backend, go to plug-in (software component)Add New PluginThe
  2. Search for "Elementor".
  3. strike (on the keyboard) Installation, and then enable the plug-in.
图片[2]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

Attention: The free version of Elementor offers great functionality, but for more advanced customization, you may need the Elementor ProThe

Step 2: Install ElementsKit Plugin

To create and customize headers and footers, install the ElementsKit Plugin is a good choice. This plugin is designed for Elementor User-designed with rich header and footer templates and customization options.

  1. In the WordPress backend, go to plug-in (software component)Add New PluginThe
  2. Search for "ElementsKit".
  3. strike (on the keyboard) Installation, and then enable the plug-in.
图片[3]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

Step 3: Create a Custom Elementor Header or Footer

After installing Elementor and the ElementsKit plugin, you can start creating a custom Elementor header or footer.

Creating and Customizing Elementor Headers

  1. In the WordPress backend, click ElementsKitHeader FooterThe
图片[4]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚
  1. strike (on the keyboard) Add new template, name the new template.
图片[5]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚
  1. In the template settings select typology because of Headerand select the header to display prerequisite(e.g., displayed throughout the site, on individual pages, or on specific archive pages).
图片[6]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚
  1. strike (on the keyboard) activate After that, click on the Editorial contentYou can customize it by going into the Elementor editor.
图片[7]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

In the Elementor editor, you can quickly add headers using the widgets and templates provided by ElementsKit.ElementsKit provides several beautifully designed header templates that can be selected and further customized according to your needs.

图片[8]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

Creating and Customizing Elementor Footers

The steps for creating a footer are similar to those for a header, except that you need to select the Footer as the template type.

  1. exist ElementsKit In the plug-in, select Header Footer Module.
  2. strike (on the keyboard) Add new contentSettings typology because of FooterThe
  3. After setting the conditions (selecting the location of the footer display), click the activateThe
图片[9]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

As with headers, footers can be customized in the Elementor editor using the templates and widgets provided by ElementsKit, by adding a footer such as theContact Information,social link,Copyright Informationetc.

图片[10]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

Step 4: Customize and Edit Header and Footer

After creating a header or footer template, it can be further customized using Elementor's visual editor:

  1. Click next to the template compiler button to enter the Elementor editing interface.
  2. utilization ElementsKit The widgets, such as thenavigation menu,search box,buttons,icon (computing)etc., to create a header or footer that matches yours.
图片[11]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚
  1. For the header, you can add Mega Menu,Shopping cart icon(for e-commerce sites) and other enhancements; for footers, you can add Social Media Links,copyright statement,Site Map and other information.

ElementsKit provides several design templates, so you can choose a suitable one and customize it.

Step 5: Activate and Display Custom Header and Footer

When you are done editing, you can preview and save the header or footer template directly:

  1. Once you have completed the design, click on the bottom right corner of the save (a file etc) (computing) Button.
  2. return to Header Footer Admin page to make sure your template is activated.
  3. Your customized Elementor header or footer will be automatically applied to the location of your choice (for example:Entire website, specific pages or articles).
图片[12]-如何使用 Elementor 免费版和 ElementsKit 创建自定义页眉页脚

summarize

By using the Elementor The free version and ElementsKit PluginWith ElementsKit, you can easily create and customize your website's header and footer. The entire process is done through Elementor's intuitive drag-and-drop interface, and customization is easy and flexible with the wide range of templates and widgets provided by ElementsKit.


Contact Us
Can't read the article? Contact us for free answers! Free help for personal, small business sites!
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) E-mail: info@361sale.com
Working hours: Monday to Friday, 9:30-18:30, holidays off
© Reprint statement
Author: xiesong
THE END
If you like it, support it.
kudos15 share (joys, benefits, privileges etc) with others
commentaries sofa-buying

Please log in to post a comment

    No comments