Move widget up inside header

  • Resolved ollyjackson1993

    (@ollyjackson1993)


    3 years, 10 months ago

    Hello

    I’m wanting to move up the widget I have inside the header so it doesn’t block my logo. It looks fine on PC and mobile, but unfortunately on a tablet the site name is blocked by the widget.

    Any ideas on how to rectify this?

    Many thanks

    Olly

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

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

  • Hi Olly,

    I’ve had a look at your website, and I can’t seem to replicate this. Can you please view this website and let me know your device resolution?

    Kind regards,
    Alex

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Hey Alex

    The device resolution for my PC is 120.00px, but for the tablet I’m viewing the website on it’s 1536 x 2048 pixels (~264 ppi density).

    Many thanks

    Olly

    Hi Olly,

    The CSS resolution is based on a pixel ration of your standard device resolution. Can you please view the linked website and let me know the specific viewport width it mentions? This will allow me to test your website using the same resolution.

    Kind regards,
    Alex

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    OK, the viewpoint width is 1536px/96em.

    Many thanks

    Olly

    Hi Olly,

    Thanks. I’ve run some tests using that width and I’m able to replicate this. Can you please show me a screenshot of what you’re seeing?

    Kind regards,
    Alex

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Sure

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Sorry Alex; not having much look uploading the screenshot. What’s the easiest way to upload it? Can’t seem to paste it.

    Hi Olly,

    Wordress.org doesn’t support image uploads. You’ll need to upload the image to a third-party image hosting site, such as Imgur, and then reply with a link to that image.

    Kind regards,
    Alex

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Thanks; this should work

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    imscreenshot

    Hi Olly,

    Thanks. I recommend rebuilding your masthead using a Layout Builder. Adding a widget to the masthead widget area will hide the logo and header widget area in favour of just the masthead. The Layout Builder is SiteOrigin Page Builder in widget form.

    Please navigate to Appearance > Widgets and add a Layout Builder to your Masthead widget area. Open the Layout Builder and add a two-column row. Add a SitEOrigin Image widget to the left column (this will be your logo) and add a Custom HTML with your stock sticker embed code.

    If you’re not using SiteOrigin Page Builder, please add an Image widget to the Masthead widget area and then move the Custom HTML widget that’s present in your header widget area to the Masthead widget area.

    Kind regards,
    Alex

    Thread Starter ollyjackson1993

    (@ollyjackson1993)

    Thanks Alex. Sorry for the constant questions but where would I find my stock sticker embed code?

    Hi Olly,

    Please navigate to Appearance > Widgets and go over to the Header widget area. The Custom HTML widget present in your header widget area contains the Stock Ticker Embed code.

    Kind regards,
    Alex

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘Move widget up inside header’ is closed to new replies.