Hello. Is it possible to show a specific sidebar on a page for mobile view? I understand the media queries, but I’m not sure how to reference a certain sidebar on a particular page for displaying in responsive view. Thanks.
Hi,
It is possible to control in which page the sidebar show on mobile view but you can’t select which sidebar will show. You can but you have to add a bit of heavy modification to the theme.
Regards,
Ismael
@ Ismael “It is possible to control in which page the sidebar show on mobile view but you can’t select which sidebar will show.”
Can you please tell me how I can control the visibility of the sidebar on mobile view?
Thx
@ Ismael
OK found a post with this code:
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
.responsive #top #main .sidebar {display:block !important; clear: both; }
}
It works when I enter it into Quick CSS, but it doesn’t work when used with the style.css in the enfold-child theme :-(
Hi chilli-mind,
Make sure you are using version 1.7.1 of the theme. There was an update to make sure the child theme style.css was getting loaded last in one of the recent updates.
Regards,
Devin
I’m still a bit confused on this issue. I need to show the sidebar, only for a specific page. I don’t want to show all sidebars, like the media query example above. Is there a page ID or sidebar ID that I can add to the css for only showing the sidebar for a certain page on mobile? Thanks.
If you target a page by its ID then yes you can. It would be something like:
#top.page-id-33 #main .sidebar {display:block !important; clear: both; }
Where 33 is the page ID of that specific page.