On my site running the Vantage theme, I have “allow anyone to register” enabled. However, the Log In and Register buttons are not showing up in the mobile version of the site. Any idea why? (on both versions they should be in the upper left corner)
In addition, some pictures are not displaying in the mobile version. Using this page as an example – the pictures appear on desktop but not on mobile.
Thanks!
Hi, thanks for reaching out.
Perhaps check to see if the toolbar issue persists with a default theme activated. If you temporarily switch to the Twenty Twenty theme, does the toolbar mobile issue persist?
The images on the example page are loading on my phone. WordPress is lazy loading the images. When scrolling down the page, if scrolling quickly, you’ll see a white space, if you stop scrolling, you should see the image load.
Thanks!
I just tried it with the Twenty Twenty theme and the Log In/Register buttons still weren’t showing up in mobile on the site.
Thanks for your feedback. If the issue persists with Vantage deactivated then it’s unlikely Vantage is part of the problem. I’m, unfortunately, not quite sure of the cause at the moment.
I went in to Inspect element and looked at the mobile version of the site. I think I found at least some of the code that is causing the problem. When I unchecked that “display: none” or deleted the “none” part, the buttons reappeared. I added some CSS to the site at first but it didn’t fix it. Do you know what code line or solution might work so the buttons display properly?
I also asked the web host about it and they said it’s not a server issue.
Thanks!
It looks like the CSS is outputted by default by the WordPress core. You can copy the entire rule into your Custom CSS and instead of display: none; use
display: block !important;. Note that the inspector shows the rule without the media query brackets so you need to add an additional set of brackets. Ref https://www.w3schools.com/css/css3_mediaqueries_ex.asp.Sorry but what rule? I tried the following since it seemed like the closest on the page you linked, but it didn’t help.
/* Navbar links */
.topnav a {
display: block !important;
}
Hi, thanks for the update. The rule in your screenshot. We aren’t really able to assist with Custom CSS modifications here on the forum. If you’re using SiteOrigin Premium, we have a budget to work with and can assist with small changes like this one. You’ll need to use the rule in this screenshot https://postimg.cc/06SfYbxf in your Custom CSS. Targetting
topnav adoesn’t help if the list element that the link is contained is being hidden. Hopefully, that helps to steer you in the right direction.