Site logo

Archived topic

Widget next to header

5 replies · Started by Sander on March 26, 2021

Viewing posts 1–6 of 6

Hey guys,

I am very happy with your Generatepress Premium theme. However, I need some help now.
I hope you can help me with my website.

Next to the header, the big logo in the middle (desktop version), I have to place a widget (Reservation tool with a shortcode) that folds under the header in the mobile version. How can I do that? With a hook? And then 3 columns? However, the middle column should remain 800 pixels.

Kind regards, Sander

Hi there,

do you have a mockup of what the widget looks like and where its going to be positioned on desktop?

Mobile:
Path to mockup

Desktop:
Path to mockup

In the Mockups you don't see the topbar. But the topbar remains.

Ok so my thoughts would be to use a Block Element for your desktop header:

https://docs.generatepress.com/article/block-element-overview/

You can use the GenerateBlocks plugin:

https://generateblocks.com

To add a Container Block for the Background. Within the Container add a Grid Block to create your columns.

The block element can be hooked in before_header to position it above the navigation. Set the priority to 5 or less to make sure it is before the nav.

You can also use the hide-on-* classes on the Container Block to remove it for mobile.

https://docs.generatepress.com/article/responsive-display/#using-our-hide-on-classes

For Mobile you can add that shortcode to your page content. And again use the hide-on classes to remove it for desktop.

Thank you for your answer! The problem has since been solved.
It has been a misunderstanding.

The reservation tool does not need to be positioned at all.
As soon as you activate the plugin, it takes its own position.
You can only indicate whether you want it on the right or left.
So I don't have to place anything in a possible third column.

Thank you for your suggestion.
I am almost done with the website now.
One more thing, but for that I submit a new support request.

Glad to hear you found a solution

This archived topic is closed to new replies.