When you edit pages in Site editor (Appearance – Site editor), click on header and in right side, disable sticky option
Thank you for drawing my attention to the advanced settings. This is a seriously good theme. I am VERY IMPRESSED. I even discovered that I could separately set my nav row to be sticky, which is what I have wanted all along.
However, for me, none of it seems to work, and now, out of the blue, my nav drop-down is hiding behind images on the home page and archive templates (not single post). I have found the z-index controls, but they seem to have no effect.
Nothing is sticky on the home page, whatever I do with the advanced controls.
Most of my problems seem to be associated with the nav bar. Is it possible that I have damaged the theme when I customised the header? Perhaps I should re-make it from scratch?
I am grateful to you for your attention and thank you very much for this excellent theme.
I have now made a new header and the navigation works as expected – including on mobile. However, using the advanced controls, I am unable to make the nav bar row sticky. The option is offered and taken but it has no effect.
The issue of the submenu hiding under content images remains – at least most of the time. The problem mysteriously went away for about half a minute without any prompting, but then returned.
Update.
So now the nav has again stopped working on mobiles. The only thing I could think that I had done was to install the Adsense code. Sure enough, after removal of the code, the mobile nav is OK again. Doh!
The nav bar still scrolls off the page.
For anyone else finding this who has had an issue with the Adsense code, I enclosed it in a group container in order to style it with a faint background colour and the problem went away.
No, me neither!
The other issues remain.
From your messages, it’s not clear, you want to add sticky or you want to remove? Sticky option is working for whole container, for example, for header. But you cant make sticky only for navigation without container.
About your issue with slider. It’s because wordpress navigation has low z-index. But you must add z-index to container where you have navigation and not to navigation itself. Unfortunately, wordpress core blocks are very limited in options. I recommend to use Container block of Greenshift plugin. Then, you can set z-index in Advanced – Position tab, this will not reduce speed of page. Here is more in depth overview of design options
-
This reply was modified 3 years, 11 months ago by
MotionBlocks.
Also, please, don’t add css code to css classes, this will not work and it can break your page. In Greenshift plugin, you can find Custom css option if you want to add custom styles on page
Thanks for the response.
What I wanted is for the nav bar only to be sticky. I have removed it from the header and it behaves as expected inside a sticky container. I made it a template part but it lost its properties so I made it a reusable block, which works fine.
Thanks for the Greenshift suggestion – I will have a read of your ‘design options’ link later – but I was hoping to just use a bit of ‘additional css’. My previous attempts came to nought for the reasons you gave above but would it not work now if I can identify a suitable selector?
Thanks again for a great theme.
On your recommendation, I gave Greenshift a try. The container block does have a setting for z-index, so I thought I would try it on my shy navigation issue.
The block has no setting to align it to the main framework of my site so I had to put the container – containing my reusable block nav nested elements – into a group wrapper, like a Russian Doll, in order to locate it. I set the z-index to a selection of Very Large Numbers but it failed to bring forward my shy navigation. I have now, at last, managed to extricate the nav.
Using the Google developers tool I edited the css to bring the nav forward successfully in the live situation, but my ‘additional css’ attempt failed. It’s not going well.
You don’t need to put container to core group and you don’t need to use reusable blocks. Wrap navigation block with container block of greenshift and you can add z-index, custom css and any css design option. In current point I don’t see that you added container block from Greenshift plugin
The reason my nav bar is a reusable block is that, as a part of the header, it cannot be independently sticky. That was the problem that I had with the theme in the first place.
I certainly did wrap my nav bar in the Greenshift ‘Container’ but, as I explained, it would not align with the main body of the site, and there was no setting to achieve that. So I had to wrap it in a group.
However, as explained earlier in the thread, as a sticky independent reusable block it works perfectly and a tiny bit of css now keeps it in front of the other content.
It may interest you to know that I have removed the Greenshift plugin for a number of reasons; not least, that it changed the WP UI in a way that prevented me from accessing the templates list. Too intrusive by far!
Thank you for your responses to my questions.
1. You should not use such big logo on separate line. You takes most important space
2. You can stick only menu. For this, you need to put logo on separate group and place it outside header. Navigation structure
3. Of course, There is settings in Container for width and for align, but most easies way is to put container inside core group block and enable Inherit layout option. And there is in depth explanation of Gutenberg width and align
4. Usage reusable is wrong because this makes more database requests and I don’t see any reason to use it in this scenario
5. Greenshift plugin doesn’t intrude, inject or change any core functionality. As you see, all templates are working as expected and inside post. If you have problems, you can write to support of plugin
Thank you for your comments.
