How to edit footer in elementor

New Page

How to Edit Headers and Footers with Elementor in WordPress

Pair / Elementor jeremy holcombe

Sharing via:

  • Facebook
  • Twitter
  • LinkedIn

If you’ve been using Elementor for a while, you know it’s a very solid WordPress page builder with a lot of features. However, there is always room to add more functionality, and if you want to modify headers and footers, you will need an additional plugin.

Changing a header or footer in Elementor can be a difficult process if you don’t know where to look for the solution. In this article, I will show you how to use a great plugin that will allow you to create a layout with Elementor and then assign that layout as a header or footer on your website.

Let’s take a look at the plugin in question, then learn how to use it together.

Elementor: Header, Footer and Blocks

Elementor Header, Footer and Blocks Plugin Elementor Header, Footer, Blocks Plugin

The Elementor – Header, Footer & Blocks plugin allows you to create website headers and footers with Elementor. You create a custom layout using the page builder and then set it as an Elementor header or footer element on your website.

También tendrá la capacidad de usar un bloque personalizado con el complemento. Básicamente, la herramienta es fácil de instalar, activar y configurar. Es liviano y brinda aún más flexibilidad y opciones de construcción a Elementor. Como sabe, este creador de páginas ya está repleto de funciones.

Echemos un vistazo a cómo instalar, activar y configurar el complemento Elementor: encabezado, pie de página y bloques.

Nota: este tutorial asume que ya tiene el complemento Elementor ejecutándose en su sitio web alojado en WordPress .

Instalar y activar el complemento

Para editar encabezados y pies de página en Elementor, primero debe instalar y activar el complemento. Puede hacer esto buscándolo en la página de complementos de su panel de administración de WordPress.

Install and activate the plugin to edit headers and footers Install and activate the plugin to edit headers and footers

Una vez que el complemento se haya instalado y activado, haga clic en Apariencia> Generador de pie de página de encabezado. Verá esto ubicado en el menú izquierdo de su panel de administración de WordPress.

Click on Appearance, then Header and Footer Builder Click on Appearance then on Header and Footer Builder

Ahora, hay un par de temas de los que debemos hablar rápidamente antes de continuar. Este complemento en realidad solo es compatible con ciertos temas de WordPress . Hay dos formas de solucionar este problema:

  1. Install a theme that is compatible with the plugin (list below)
  2. Click on the “Theme Support” tab in the settings section for the plugin and follow those directions.

Install Compatible Theme

The Elementor – Header, Footer, and Blocks plugin is only compatible out of the box with the following themes:

  • Astra
  • Neve
  • Hestia
  • GeneratePress
  • OceanWP
  • Genesis
  • Phlox Theme
  • Attesa Theme

These are the best themes to use with Elementor.

Note: Some of these themes also offer a variety of child themes. All of those will work as well. So your first option is to use one of the themes from the above list.

Use the Theme Support Tab

Once you are in the settings section for this plugin you will see two tabs.

  • All Templates
  • Theme Support

Click on the “Theme Support tab.

You will see a couple of different solutions here for adding theme support to the plugin. Go ahead and choose the one you prefer.

Theme support tab for editing headers and footers Theme support tab to edit headers and footers

The recommended method should work for most themes. If it doesn’t, try the second method. Now, if neither of those two methods work, then you have two choices. You can contact your theme developer and ask them to add support for this plugin, or you can install a compatible theme from above.

Now that is done let’s go ahead and look at how to use this plugin to edit headers and footers.

Note: You will know you can use the plugin properly because the “Theme Support” tab will disappear and you can now add a new template.

Add Header or Footer For Elementor

Now that you are in the template section, go ahead and click on the “Add New” button to add and edit headers or footers for Elementor.

Click the Add New button Click the Add New button

You will be taken to an editing page for the plugin. Here, you will need to complete a two-step process. You need to select all the options you want for the Elementor header or footer and save them. Once saved, you will be presented with a shortcode as well that you can use to put the block in where you want.

Once you make those selections, you can now actually build the header, footer, or custom block using Elementor. Let’s look at what both steps take to accomplish.

Elementor Header and Footer Options

The first thing to do is to set the header and footer options for the new template you are about to build. You are going to name the template. From there, you have several options. They include:

Type of Template: Header, before footer, footer, or custom block.

Display On: Here you will select where to display the header footer on your site. You will also be able to add display rules and exclusion rules.

User Roles: Select your user roles of who can make edits.

Enable Layout for Elementor Canvas: This will allow you to edit using the “canvas” layout that Elementor offers.

Change header and footer options Change header and footer options

Once you have these configurations how you want, click the “Publish” button and the template styles will be published.

Edit Headers and Footers Using Elementor

Now you can go ahead and actually build and edit your header footer layout using Elementor. To do this, click on the “Edit with Elementor” button.

Edit with Elementor Button Edit with item button

This will open the Elementor editor where you can then build, design, and edit headers and footers using the Elementor page builder.

Elementor page builder to edit headers and footers Elementor page builder to edit headers and footers

When you are finished, click on the green “Publish” button at the bottom of the editor and you are all set.

That’s it! You can now display this header or footer in the places you chose while configuring the template. The header footer will display based on the rules you have in place. You can also use the shortcode to display it in blocks or other parts of your website.

Final Thoughts

The Elementor page builder for WordPress is arguably the very best page builder out there right now. That being said, there are a lot of great ad-on plugins available that make this page builder even more powerful.

With this plugin, you can now edit headers and footers and display custom ones in different parts of your website based on the various rules you set. The kicker, you get to build and design these headers and footers using Elementor, which makes creating custom blocks and designing custom headers and footers even easier.

When you combine a page builder like Elementor with a platform like WordPress, the possibilities are endless when it comes to concept and design. This plugin only gives you even more options.

I hope this tutorial showed you how to effectively create headers and footers to display using Elementor. Remember, this specific plugin may take a little extra work to get going. You might have to contact a theme author or use a compatible theme for the plugin to work. However, the process is totally worth it as your site will be as customized as you want.

What other plugins are you using to create customized headers and footers in WordPress? Have you found any that are compatible with Elementor and as easy to build and display as this one?

Compartir via:

  • Facebook
  • Gorjeo
  • LinkedIn

Create Footers Using Elementor’s Theme Builder

  • Última actualización el 21 de septiembre de 2021

The  Footer Template lets you easily design and edit custom footers.

  1. Under Templates > Theme Builder > Footer > Add New, select Footer from the dropdown and click Create Template.
  2. Choose a Footer Block and Insert. Alternatively, you can design your own.
  3. After you’ve finished designing, click Publish.
  4. Choose a Condition. Click to learn about conditions.

Tip: Did you know? You can create more than one Footer, and assign it to different areas on your site!   Click to learn more

Note: You will not be able to see your Footer if you’re using the Canvas Template

Footer Site Part

  • Last updated on April 19, 2021

La  sección Parte del sitio del pie de página  del Generador de temas enumera todos los pies de página que ha creado, si los hay, lo que brinda acceso rápido para agregar, editar o eliminar cualquier pie de página.

If the footers have not yet been created, you will need to create one. Click Add New  in the upper right corner of the Footer Site Part screen.

sitepart-footer-blank-1024x318

Once you have created at least one footer, you will be able to manage them here.

sitepart-footer-1024x314

Change the layout of an existing footer

  1. To edit an existing footer, click the footer tag in the sidebar. This will open the footer details panel.
  2. Click the Edit  link in the upper right corner of the specific footer you want to edit. This will open the Elementor editor for that footer.

sitepart-footer-1-1024x314

Modify the conditions of an existing footer

  1. Click the Edit Terms link  in the lower left corner of the footer you want to edit. This will directly open the display condition editor for this footer.

Note : The display of dots in the upper left corner of the footer indicates which parts of the site are active (have display conditions assigned) and which are only drafts (no display conditions have been assigned ). A green dot indicates an active footer, while a gray dot indicates a draft footer. 

Note : The Instances label in the lower left corner of the footer indicates the specific instances that this template is used on the site. 

Export a footer

  1. Click on the  three horizontal dots  at the top right of the footer you want to export. 
  2. Choose  Export  to open a Save dialog box that will save a .json file to your computer.

renamedelete-1

Delete a footer

  1. Click on the  three horizontal dots  in the upper right corner of the footer you want to remove. 
  2. Choose  Delete  , which will open a Part Delete confirmation dialog.
  3. Click Cancel  if you change your mind and decide you don’t want to delete the footer, or click Delete  to confirm that you want to delete this footer.

sitepart-delete-2

Rename a footer

  1. Click on the  three horizontal dots  in the upper right corner of the footer you want to rename. 
  2. Choose  Rename  , which will open a Rename Room dialog box.
  3. Enter the new name and click Edit  to complete the renaming process, or click  Cancel  if you change your mind and decide you don’t want to change the name of this footer.

sitepart-rename-1

Google Google Translate


Video How to edit footer in elementor

Related Posts

How to add seo keywords in wordpress

Contents1 Cómo agregar palabras clave de SEO en WordPress (aumentar el CTR y las clasificaciones)1.1 Post Title1.2 Headline1.3 Header Tags1.4 Introduction and Conclusion1.5 Body Copy1.6 URL1.7 Meta…

How to embed google calendar into wordpress

Contents1 How to Add a Google Calendar in WordPress (Step by Step)2 Add a Google calendar to your website3 calendario de Google3.1 Versatile plans and pricing4 Video…

How to change the logo in wordpress

Contents1 How to Add a Custom Logo to Your Site Header2 Site Logo2.1 Planes y precios versátiles3 Add, remove or edit a custom logo4 Video How to…

How to add a popup on wordpress

Contents1 Easily create a WordPress emergent form (2 forms)1.1 ¿Por qué usar un formulario emergente de WordPress?1.2 Método #1: Crear un formulario emergente con OptinMonster + WPForms1.3…

How to roll back wordpress version

Contents1 How to Revert WordPress: Undo WordPress Updates (Easy Way)2 How to Downgrade WordPress & Roll Back to a Previous Version2.1 1. A WordPress update included significant changes…

How to rollback wordpress version

Contents1 How to Downgrade WordPress and Revert to an Older Version1.1 1. A WordPress update included significant changes that are not compatible with your theme or plugins1.2…