Custom Sidebar for different screen sizes

[gsmaster]

Hello Dev Guys/Gals,

I tried to search for a solution to my problem using the search function on here but did not get what I needed (maybe wrong keys? ) ...

Anyways, here is my issue... I am using the smart passive income pro theme and I would like to do the following:

I would like to be able to customize a totally different sidebar for each screen size...

For example if someone navigates the site using a mobile phone I should display a different sidebar than for desktop.

It is the same idea as of having different sidebars for different posts/pages but instead for different screen sizes...

Can anyone give me some ideas, tips, snippets, on how to achieve this?

I started by installing simple genesis sidebars, because I think what I need is some snippet of code somewhere (CSS? PHP?) that tells the theme which sidebar to load on which screen size.... but I am stuck at this point...

Thanks for your help
Gustav

[Brad Dalton]

Why can't you use CSS for Media Queries to modify the default sidebar on smaller screens?

Otherwise, you're going to have to use jQuery.

---

Tutorials for StudioPress Themes.

[gsmaster]

I dont know how to switch to another sidebar using CSS in the media queries section...

for example I have created a new sidebar with id "mob-sidebar" ... how do i make it use that sidebar using CSS?

Thanks
G

[Brad Dalton]

Why do you want different sidebars?

---

Tutorials for StudioPress Themes.

[gsmaster]

because of marketing reasons

[Brad Dalton]

If its banners, there are other solutions however to change sidebars, you would need to use jQuery with wp_localize_script

---

Tutorials for StudioPress Themes.

[gsmaster]

well ... what i need to change is the content of the sidebar... maybe hide something and show others .. depending on screen size

[Brad Dalton]

You can do that using CSS for Media Queries or jQuery.

---

Tutorials for StudioPress Themes.

[gsmaster]

thanks for pointing it out...
G

[Author]

Posts