[Support request] Creating a full width landing page in Sider theme

Home Forums Support [Support request] Creating a full width landing page in Sider theme

Home Forums Support Creating a full width landing page in Sider theme

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #2200058
    Jaumark

    How can I create a full width landing page in the ‘Sider’ theme?

    #2200080
    Fernando
    Customer Support

    Hi Jaumark,

    For Slider theme, the Header is set to display at the side like a sidebar through a code located in Appearance > Customize > Additional CSS.

    You can add something like body:not(.home) to the code if you want to exclude the Blog page which is the home page for instance.

    Example:

    Replace this:

    .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;
    	}

    With this:

    	body:not(.home) .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;
    	}

    Note that I just added body:not(.home) as mentioned. You may also replace .home with for instance .page-id-73 wherein 73 is the id of the page.

    How to get the id: https://share.getcloudapp.com/X6uEj0zg

    So you can for instance exclude a specific page from the CSS code like:

    body:not(.page-id-73 ) .inside-header {
      flex: 1;
      flex-direction: column;
    }

    Try excluding the specific page you wish to have a full with on codes that include classes related to the header like .site-header, .main-navigation etc.

    Hope this clarifies. Feel free to reach out if further assistance is needed. 🙂

Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.