Archived topic
Disable Breadcrumbs on Mobile and Display custom menu on mobile
7 replies · Started by Prajwal on July 1, 2021
Hi,
1. I am using RankMath plugin and I want to hide the breadcrumbs on mobile (posts). How can I do that ?. I read some forum threads and tried using the below code but it doesn't work.
@media (max-width: 768px) {
#breadcrumbs {
display: none;
}
}I also tried the below code and it seems i am doing something wrong.
@media (max-width: 768px) {
#rank-math-breadcrumbs {
display: none;
}
}
2. I have created a custom menu for mobile using the steps mentioned in the article - https://docs.generatepress.com/article/using-a-different-menu-on-mobile/
Now for mobile, I want to display the menu items on the menu bar instead of hamburger icon and Menu label. I have got only 4 items in menu and I am sure they will fit well in the menu bar. Is that possible. Something like this - https://snipboard.io/Ik7rSG.jpg
Hi there,
Any chance you can link us to the site in question?
You can use the private information field.
Please also a second topic for the question #2 so we can keep one question per topic.
Thanks
Yes
This CSS should work:
@media (max-width: 768px) {
.rank-math-breadcrumb {
display: none;
}
}Hi Leo, I tried your code, it doesn't work. I have cleared the local cache but no luck.
That one worked. Thanks Leo.
No problem :)
