Support » Theme: Shop Isle » Reduce Shopisle Nav Menu Height on Mobile

  • Hi there,

    Sorry I have a few different questions :

    1. Is there a way to reduce the height of the top navigation menu on mobile? The logo and bar is quite thick.

    2. Can the hero slider a bit shorter on mobile so users know there’s more content to scroll down to?

    3. Is it possible to change the timing for the carousel (hero image and product slider)?

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Hello @cecybot,

    Thanks for reaching out.

    1. The reason why your main navigation is thick is because of the logo having full-width. To make it look smaller you just need to reduce the width of the logo. You can use the code below:

    img.custom-logo {
        max-width: 50%;
        height: auto;
        float: left;

    This code will also place your logo to the left. You can try the code with and without the float: left; part according to your preferences.

    2. To reduce the height of the slider section you can adjust the height value from the code below:

    section#home.home-section {
        height: 500px;

    3. I believe this guide should be helpful ->

    Note: All the code CSS code from above (1 and 2) should be added to Appearance -> Customize -> Additional CSS

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.