• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.3 Any easy way to put sidebar on left?

Russ

Well-known member
#3
Like a page node, member page, resource item page?

Code:
@media (min-width:@maxResponsiveWideWidth)
{
#XenForo .mainContainer
{
float: right;
margin-left: -{xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
width: 100%;
}

#XenForo .mainContent
{
margin-left: {xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
}

#XenForo .sidebar
{
float: left;
}
}
This would make your sidebar on the left for every page, you can add a class after the #XenForo to target specific pages, but knowing what you want it on would help :)
 

HeadHodge

Active member
#4
Like a page node, member page, resource item page?

Code:
@media (min-width:@maxResponsiveWideWidth)
{
#XenForo .mainContainer
{
float: right;
margin-left: -{xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
width: 100%;
}

#XenForo .mainContent
{
margin-left: {xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
}

#XenForo .sidebar
{
float: left;
}
}
This would make your sidebar on the left for every page, you can add a class after the #XenForo to target specific pages, but knowing what you want it on would help :)
Thanks for the reply. (y)

I have several pages in the following format and I would like to move the sidebar to the left side of the products. (without a ton of coding or messing up all my other pages).

Sidebar.png
 

HeadHodge

Active member
#5
Like a page node, member page, resource item page?

Code:
@media (min-width:@maxResponsiveWideWidth)
{
#XenForo .mainContainer
{
float: right;
margin-left: -{xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
width: 100%;
}

#XenForo .mainContent
{
margin-left: {xen:calc '@sidebar.width + 10'}px;
margin-right: 0px;
}

#XenForo .sidebar
{
float: left;
}
}
This would make your sidebar on the left for every page, you can add a class after the #XenForo to target specific pages, but knowing what you want it on would help :)
That worked great (and was really easy). Thanks!!! (y)

All I needed to do, was edit my template and add:
<script>
$('#XenForo .sidebar').css('float', 'left');
</script>

Update: I actually had to do this:
<script>
$('#XenForo .mainContainer').css('float', 'right');
$('#XenForo .sidebar').css('float', 'left');
</script>

Still very easy peasy. :)
 
Last edited: