[Support request] Menu on the left

Home Forums Support [Support request] Menu on the left

Home Forums Support Menu on the left

  • This topic has 3 replies, 3 voices, and was last updated 1 year ago by Leo.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1488465
    Mikael

    Hi

    I want to make a change on my site http://www.silentdecor.com we would like to have the menu on the left instead. Like this site has it http://www.bytdator.se

    Can this be done? We use elementor also.

    Regards
    Mikael

    #1488773
    David
    Staff
    Customer Support

    Hi there,

    we have a similar layout in our site library:

    https://gpsites.co/sider/

    However to do that for a pre-built site would require custom development.

    #1489100
    Mikael

    Ok so its hard then? There is no way to have the menu on the left?

    #1489163
    Leo
    Staff
    Customer Support

    Are you using GP 3.0+ with the Flex option?

    If so you can try this CSS that is used in Sider:

    @media (min-width: 1000px) {
    	body {
    		padding: 0 50px 50px;
    		margin-left: 300px;
    	}
    
    	.site-header {
    		position: fixed;
    		left: 0;
    		top: 0;
    		width: 300px;
    		z-index: 300;
    		height: 100%;
    		overflow: auto;
    		overflow-x: hidden;
    		-webkit-backface-visibility: hidden;
    		-webkit-overflow-scrolling: touch;
    		transition: .1s ease;
    	}
    	
    	.admin-bar .site-header {
    		top: 32px;
    	}
    	
    	.site-header .main-navigation li {
    		float: none;
    	}
    }
    
    .inside-header {
      flex: 1;
      flex-direction: column;
    }
    
    .header-widget {
    	order: 3;
    	text-align: center;
    }
    
    .nav-float-right .inside-header .main-navigation {
    	order: 2;
    	margin-top: 50px;
    	margin-bottom: 50px;
    }
    
    .dropdown-click .site-header .main-navigation ul ul {
        position: relative;
    }
    
    .main-navigation .main-nav>ul {
        flex-direction: column;
    }
    
    .nav-float-right .header-widget {
        margin-left: 0;
    }
    
    .nav-float-right .header-widget .widget {
        margin-bottom: 50px;
    }
    
    .nav-float-right #site-navigation {
        margin-right: auto;
    }
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.