Home Forums Basel – Premium Template hamburger icon on right side

This topic contains 8 replies, has 2 voices, and was last updated by Elise Noromit Elise Noromit 2 weeks, 5 days ago.

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #269784

    lands
    Customer

    is it possible to move the hamburger menu icon to right side as this is RTL site…
    thanks

    #269789

    Hello,

    Basel theme is RTL ready. As soon as you set an RTL language everything would be aligned accordingly. Please provide your site admin access if it does not work by default.

    Best Regards

    #269794

    lands
    Customer

    ok here ia admin access:

    Private Content Hidden
    #270076

    Hello,

    We can provide custom CSS that would revise all the elements in the header and they would be aligned as LTR. However, it is not possible to replace the hamburger icon only.

    Best Regards

    #270201

    lands
    Customer

    yes i would love that. also if you can flip in product page the picture+ gallery & description.

    so that description is on the right, pic in the middle and additional images on left…

    #270258

    lands
    Customer

    so i want the hamburger icon to be on the right side. (in mobile)

    in addition if you could move in the product page the description to the right and the picture to the left. (in desktop)

    #270290

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body.rtl .main-header {
    	direction: ltr;
    }
    body.rtl .main-header .right-column {
    	text-align: right;
    	padding-left: 15px;
      padding-right: 0;
    }
    body.rtl .right-column > div {
    	margin-left: 10px;
      margin-right: 0;
    }
    body.rtl .main-header .site-logo {
    	padding-left: 0;
    	padding-right: 15px;
    }
    body.rtl .main-header .main-nav {
    	direction: rtl;
    }
    body .product-design-compact .product-image-summary>.row {
    	flex-direction: row-reverse;
    	-webkit-flex-direction: row-reverse;
    }

    This code covers your needs for header and product page.

    Best Regards

    #276949

    lands
    Customer

    Thank you.

    the only problem is in mobile now when you slide down, the sticky header is moving to the left again. any chance to make the sticky header on the right side too?

    #277113

    Hello,

    Please replace the custom provided before for this one:

    body.rtl .sticky-header,
    body.rtl .main-header {
    	direction: ltr;
    }
    body.rtl .sticky-header .right-column,
    body.rtl .main-header .right-column {
    	text-align: right;
    	padding-left: 15px;
      padding-right: 0;
    }
    body.rtl .right-column > div {
    	margin-left: 10px;
      margin-right: 0;
    }
    body.rtl .sticky-header .site-logo,
    body.rtl .main-header .site-logo {
    	padding-left: 0;
    	padding-right: 15px;
    }
    body.rtl .main-header .main-nav {
    	direction: rtl;
    }
    body .product-design-compact .product-image-summary > .row {
    	flex-direction: row-reverse;
    	-webkit-flex-direction: row-reverse;
    }

    Best Regards

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.