Change blog page sidebar from right side to left side

Hello, is there any css or other way to move the blog page sidebar from right to left side? Im using rentalhive and adding it through widgets, but by default its on the right side and on the mobile it makes problem because then the sidebar is at the bottom and not at the top because its by default on the right side.

I’ve tried playing with this code for listings but with no luck.

.hp-template--listing-view-page .hp-page > .hp-row {
		flex-direction: column-reverse;
}

Thank you.

Hi,

This can be achieved with some CSS tweaks. Please note that this falls under dev guidance, which is available with premium support. If the support period for your purchase has expired, please consider renewing it for further assistance: Renew Support | HivePress.

Thank you for your understanding.

For anyone interested on how to move the blog sidebar to the left on mobile, here are my two options which work great

@media only screen and (max-width: 47.99em) {
  body.blog .site-content .container > .row,
  body.single-post .site-content .container > .row {
    flex-direction: column-reverse !important;
  }

  body.blog .site-content aside.site-sidebar,
  body.single-post .site-content aside.site-sidebar {
    margin: -1rem auto 1rem;
    max-width: 90%;
    width: 100%;
  }
}


or this one

@media only screen and (max-width: 47.99em) {
  .site-content .container > .row {
    flex-direction: column-reverse !important;
  }

  .site-content aside.site-sidebar {
    margin: 1rem auto;
	margin-top: -1rem;
    max-width: 90%;
    width: 100%;
  }
}

Both work.

1 Like

Thanks for sharing the solution!
It would be helpful for our community.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.