Eleven40 change mobile responsive sidebar order

[ashWhitney]

Hello. I'd be grateful if anyone could offer some advice please.

I'm using the Eleven40 theme with a full width layout of secondary sidebar - content - primary sidebar.

In the mobile responsive version the layout is:
content
primary sidebar
secondary sidebar

Is there any way to change the mobile responsive layout to swap the order of the two sidebars please, i.e.
content
secondary sidebar
primary sidebar

Thanks for your time. Regards, Ash

http://ashwhitney.uk/publications-library/

[Victor Font]

Your content and primary sidebar have the same parent element as a wrapper. The secondary sidebar is outside of that group. If you look at your source code as it is generated, you'll see the following structure:

<div class="content-sidebar-wrap">
    <main class="content">
    </main>
    <aside class="sidebar sidebar-primary">
    </aside>
</div>
<aside class="sidebar sidebar-secondary">
</aside>

For you to rearrange the sidebars as you'd like, you would have to move the secondary sidebar into the same parent wrapper as the content and primary sidebar. You can't do this with CSS. You could theoretically do it with jQuery, but it wouldn't be easy. Pragmatically then, no you can't move the secondary sidebar.

Something that could work though is to duplicate the widgets in both sidebars so they have the exact widget layout. Then with CSS, you could hide or show the widgets in either sidebar at different screen dimensions. This would create the illusion of two different sidebars and you can display them exactly as you want.

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[meerasehgal]

This tutorial is for customization of eleven40-pro, a child theme of genesis by studiopress.com. eleven40-pro is one of the most popular premium genesis child theme. The codes written for different genesis child themes are very similar because they are all of same parent theme i.e. genesis framework. If someone learn to customize a particular child theme of genesis, he/she can also customize other child themes similarly.

You may like to know: Customizing Genesis Sample Child Theme
Customizing any theme requires editing of functions.php and style.css file inside theme directory. If you have edit permission from wordpress dashboard, you may change it from Appearance->Editor->functions.php or style.css. Always refresh your browser cache to see style changes.

1. Change fixed header to Unfixed.
The header of eleven40-pro theme is normally fixed, that means whenever you scroll a page, the header remains always visible. So, the header part always occupy a certain height of your screen. This may be unwanted for many website developers. So we change fixed header to unfixed header. Find .site-header { in style.css.
hadoop training

---

http://www.topspanishtranslator.com

[ashWhitney]

Hello Victor

Thank you for your time and advice regarding my sidebars question.

I suspected it wouldn't be something straightforward to do as I'd drawn a blank when searching for answers. The CSS workaround would be feasible as the site only has three sidebar widgets, so it wouldn't be a huge overhead to duplicate, show and hide these.

Kind Regards

Ash

[Author]

Posts