• Resolved Lucida

    (@lucida)


    Hello,

    On my website, the space between the menu bar and the page title is varying between the Home Page, Woocommerce Pages (Shop + Products), and About/Contact pages.

    Can you tell me how I can ensure there is the same space between the menu bar and the page title as on the following page please across all my site pages please?

    https://savanscarves.com/shop/

    • This topic was modified 6 years, 11 months ago by Lucida.
    • This topic was modified 6 years, 11 months ago by Lucida.

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi @lucida,

    This is happening as each H1 also has a different class and slightly different mark up with different CSS styling applied to each.

    For example on your shop page, it has an additional 40px on the top of the H1. The below CSS would remove that.

    .woocommerce-products-header {
        margin-top: unset;
      }

    It should then match the normal page template used on the About or Contact page. Now regarding the homepage there is a breadcrumb div that’s missing when it is on other pages.

    Storefront Breadcrumb Div
    Link to image: https://cld.wthms.co/bbj9kC

    I didn’t see other pages or parts of your site using breadcrumbs, so it could be something you consider removing with a little code snippet as outlined here. If removed the other page spacing should then match your homepage. Alternatively you can also add that padding to the homepage, like the following CSS.

    .home .entry-content {
        padding-top: 1.2em;
    }

    Hopefully that is helpful. 🙂

    Thread Starter Lucida

    (@lucida)

    A very delayed thank you Ryan. All of that advice is incredibly helpful. Thank you for taking the time to look through the code and make those suggestions, it is much appreciated.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Variation in space between menu bar and page title’ is closed to new replies.