- This topic has 20 replies, 2 voices, and was last updated 3 years, 3 months ago by
Fernando.
-
AuthorPosts
-
January 5, 2023 at 8:43 pm #2485387
Jusung
I just wanna ask a question.
I wanna put a background on the header and put the menu on the bottom side.
In this case, am I supposed to use Elements block?Could you tell how I can approach this?
When you see my naver blog(the link), you can see I have backgrond image and put menu on the bottom side.
January 5, 2023 at 8:49 pm #2485392Fernando Customer Support
Hi Jusung,
Yes, a good approach would be to use a Block Element – Hook. Hook it to
before_header.If you’re planning to add the Featured image for this Header image, you can use a Block Element – Page Hero instead. Just use the same hook –
before_header.January 5, 2023 at 8:51 pm #2485394Jusung
But the menu has to be inside the featured image but on the bottom part inside the featured image.
Would it still work?January 5, 2023 at 10:11 pm #2485432Jusung
To make this, I guess i just have to use elements(hook – header) right?
I wannt put the menu inside the featured image.January 5, 2023 at 10:44 pm #2485450Fernando Customer Support
Yes, you can use a Block Element – Site Header.
You can also use a Block Element – Page Hero. Just hook it to before_header. It should still work but we need some custom CSS. Example: https://share.getcloudapp.com/mXubJX8B
January 5, 2023 at 10:58 pm #2485464Jusung
When you check my site now, you can see the menu under the image..
I need to include the menu inside the image..on the bottom part inside the image..
Is there any way to do this?January 5, 2023 at 11:01 pm #2485469Fernando Customer Support
Yes, there’s a way.
Can you first create a Header Element displayed on your Front Page?
Set the merge option to
merge.Reference: https://docs.generatepress.com/article/header-element-overview/#site-header
January 5, 2023 at 11:18 pm #2485479Jusung
I added the image on the “container background” and used “after header”
Then it works now.but I wanna make the menu appear on the bottom part on the image.
Also, since it is the background image, I had to give 70vh.Is there a way to show the full stable size of the image?
January 5, 2023 at 11:23 pm #2485481Fernando Customer Support
You can use an Image Block instead.
We just need the merge Header Element to ideally put them in one div. Then, with that structure, we can place the nav at the bottom of the image.
January 5, 2023 at 11:25 pm #2485484Jusung
I changed it to the image now and it is ok.
could you elaborate how i can put it on the bottom part?
January 5, 2023 at 11:27 pm #2485487Fernando Customer Support
Create a Header Element. Set it to display on your Front Page.
Set the merge option to merge.
Reference: https://docs.generatepress.com/article/header-element-overview/#site-header
Afterward, we’ll add custom CSS to fix the position of the sections.
January 5, 2023 at 11:29 pm #2485489Jusung
Yes I have done it and the menu is merged now.
I just need to put it on the bottom part.
January 5, 2023 at 11:33 pm #2485494Fernando Customer Support
Can you clear any caching mechanism you have? I’m not seeing it implemented on my end.
January 5, 2023 at 11:36 pm #2485498Jusung
Just cleared the caching.
the menu and image are merged but the menu is on upper side.
January 5, 2023 at 11:39 pm #2485502Fernando Customer Support
I see it now. Can you set the hook of the Block Element for the image to
before_header? -
AuthorPosts
- You must be logged in to reply to this topic.