The Footer Menu

This guide is about the Footer menu component available in Neve.

For more details about how the footer builder works, please refer to this article.

Add Footer Menu

Just click on the ➕ symbol and a  list of components will appear. 

From there you can add the  Footer Menu component.

To open the customizing options, just click on ⚙️ of the newly added Footer Menu, located in the body of the component. This will open the Footer Menu panel on the left side, from where you can customize the component


⚙️ General

  • Appearance > Customize > Footer > Footer Menu > General

Create your Footer Menu

In the General tab, click on Footer Menu. You will be directed to the Menus location in Customizer, where you can create / edit a new menu and assign it as Footer Menu.


 📐Layout

  • Appearance Customize Footer Footer Menu > Layout

These settings refer to the spacing and position of the whole menu.

A

 Custom spacing, height, and alignment

In the Layout tab, there are controls for:

  • Items Spacing: Space (in pixels) between menu items.
    • along with a reset button ( Desktop | Tablet | Mobile )
  • Items Height: Top / Bottom space (in pixels) for menu items.
    • along with a reset button ( Desktop | Tablet | Mobile )
  • Alignment - left / center / right  ( Desktop | Tablet | Mobile )
  • Vertical Alignment - top / middle / bottom

B

 Custom padding and margin

In the Layout tab, you also have access to advanced positioning options like:

  • Padding - the amount of space around the menu items inside the Footer Menu component
    • available in PX, EM, and %, with a link button that helps with establishing the same dimension for all the directions  ( Desktop | Tablet | Mobile ).
  • Margin - the amount of space around the menu items outside the Footer Menu component, it takes more space from the footer row
    • available in PX, EM, and %, with a link button that helps with establishing the same dimension for all the directions  ( Desktop | Tablet | Mobile ).


🖌 Style

  • Appearance Customize Footer Footer Menu > Style

In the Style tab, you will find three color controls and one hover skin mode:

A

 Custom colors for the Footer Menu items

  • Hover Skin Mode - there are four skin modes available for the footer menu. These are styles that apply while hovering the menu items. 
  • Items Color - is the color of the items contained by the footer Menu. 
    •  You can choose one of the global colors ( theme's default colors ), by clicking on the 🌐 button.
  • Active Item Color - color for the active footer Menu items. ( An item is active when it links to the currently viewed page or to a section on that page ). 
    •  You can choose one of the global colors ( theme's default colors ), by clicking on the 🌐 button.
  • Items Hover Color - footer Menu items color on hover. 
    • This will only be visible on the Desktop after you publish the changes.
    •  You can choose one of the global colors ( theme's default colors ), by clicking on the 🌐 button.

B

 Custom typography for the Footer Menu items

The typography subpanel found in the Style tab offers the following options:

  • Font Family - with a vast list of fonts to choose from.
  • Transform - None / Capitalise / Lowercase / Uppercase
  • Weight - None / 100 to 900
  • Font Size, Line Height (in PX / EM)Letter Spacing ( in PX) -  along with a reset button ( Desktop | Tablet | Mobile ).

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.