Home>Support>Custom Header looks great on Home but in menu links

Custom Header looks great on Home but in menu links

I finally was able to get the header to look just right on the the home page and custom top menu in the header. But the header in the links on the main menu bar shows up distorted. The linked image in the custom header widget breaks and the main menu shifts DOWN in Safari and UP in Chrome.
What’s going on?
Also, I read you were going to add templates to the site… when can we expect that? This has a lot of content and I’m not proficient in PHP to add custom layouts…
Help!

URL: http://dryoho.artboxcreative.com

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 5 months ago Andrew Misplon
    Hi, I Work Here

    Hi Cyl

    Thanks for reaching out.

    I see you’ve added Custom CSS to set the header padding. Did you add this before or after posting this thread? It’s what I would have recommended. I’m not seeing a jump in the header in iOS Chrome or Safari. Are you still seeing it on your side?

    If you’re asking about Page Builder Pre-built Layout templates, sure, we’ll be adding those soon. I unfortunately don’t yet have a date for launch though.

  2. 9 years, 3 months ago Cyl Barbosa

    The image link is still broken. I’m viewing http://dryoho.artboxcreative.com/photo-gallery/facial-surgeries/cheek-and-chin-implants/.

    And to answer your question, I added the custom css before I created this thread.

    This is a cosmetic surgery website and I have hundreds of before and after photos that need are categorized by procedure(s). Some images have multiple categories. When generated an image slideshow, only the images for that selected category should appear. New images will continuously be added and should appear automatically, so long as they’ve been tagged/categorized correctly. How should I tag my images when uploading them to the site?

    Is Vantage the best theme for this type of site or do you recommend another?

  3. 9 years, 3 months ago Cyl Barbosa

    I decided to make the image a block of text using CSS. The problem now is when I view it on a mobile device, the text breaks into so many lines. If I make it all part of the logo, then the text becomes too small. How do I get it to view nicely on a phone? Ideally, I would prefer the right hand block of text extend to one line, centered across the device and for the logo to resize to fit the width of the device.

  4. 9 years, 3 months ago Andrew Misplon
    Hi, I Work Here

    Hi :)

    Please could you try this:

    1. At Appearance > Theme Settings > Logo – disable the No Widget Overlay setting.
    2. Add the following to Appearance > Custom CSS:

    /* Vantage Header Responsive Breakpoint */
    
    @media (max-width: 960px) {
      body.responsive header#masthead .hgroup {
        text-align: center;
      }
      body.responsive header#masthead .hgroup .logo {
        float: none;
      }
      body.responsive header#masthead .hgroup .logo img {
        margin: 0 auto;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
      }
      body.responsive header#masthead .hgroup .support-text,
      body.responsive header#masthead .hgroup #header-sidebar {
        position: static;
        display: block;
        margin-top: 30px;
        max-width: 100%;
      }
      body.responsive header#masthead .hgroup .support-text img,
      body.responsive header#masthead .hgroup #header-sidebar img {
        max-width: 100%;
        height: auto;
      }
      body.responsive header#masthead .hgroup #header-sidebar {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: auto;
      }
      body.responsive header#masthead .hgroup #header-sidebar .widget {
        display: block;
        margin: 0 auto;
        float: none;
      }
    }
    

    Let us know how that goes.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More