Displaying any widget in header
This guide is about how to display any custom widget or default Jimdo module in header ( the area between the header and content )
01. Deactivate the hero section
If your page has an hero section with background image, you can deactivate it by adding a body class 'no-hero'
02. Adding a custom widget
One of the most common used widget is the image slider that can be displayed on the top of the page instead of the hero section.
So, please check the following steps:
- Select a widget
From the Matrix admin menu ( shortcodes) copy the code of the slider and paste it inside of the content section using the module Widget/HTML
- Add a custom class
By default the widget will be displayed in content section, in the same area where you added Widget/HTML. To make it appear on the top of the page, simply add a class 'is-header' in the first code line like this:
<div class="is-matrix-slider is-new-slider owl-carousel owl-theme is-fullwidth is-header">
- Refresh the page
You need to refresh the page to see your slider displayed on the top of the page but keep in mind that it's code can be found and edited in the same position you added to the content section
03. Adding a Jimdo module 'Photo'
Display a module "Photo" in content section and add the class 'is-header is-fullwidth' as Img Alt text. Refresh the page to see the effect.
Note:
This option is available only in the latest Matrix Themes installed from 2021
04. Display any other Jimdo module with Matrix variables
- Display a module Columns
Add a module 'Columns' to the content section with only one column
- Add your widget
Inside of the column, add any Jimdo module that will appear on the top of the header ( e.g. Google Maps, Slider, Gallery etc)
- Add variables
Inside the same column, add Widget/HTML with the following variables and refresh the page
<var> is-header is-fullwidth </var>
Note:
The option with variables is available in Matrix Themes installed from April 2021
GET INSPIRED
STAND OUT WITH A PROFESSIONAL JIMDO WEBSITE