[Resolved] Mobile Header

[metcomllc@aol.com]

Is it possible for the mobile header image to take up the full width? Is it possible to move the menu below the header pic? to What is the largest ideal image for my mobile header?

[Leo]

Hi there,

The mobile header is not what you’d want to use with that logo image.

Try turning the option off and your site would look a lot better on mobile.

Let me know if this helps 🙂

[metcomllc@aol.com]

While the picture in the header as well as the font “in the DESKTOP view” looks good, the picture and font “in the MOBILE view” looks too small. That is primarily why I bought the premium version. I was hoping to substitute a Text only header for mobile.

[Leo]

Sorry so you simply want some text for the mobile header?

If so what if you try Site Title for the branding type?
https://www.screencast.com/t/aqpyXxKq
Let me know if this helps 🙂

[metcomllc@aol.com]

No, I want to use the header that I created with larger font.

[Leo]

It’s not possible to change the font size inside of a picture you created.

We could try switching out a logo image specific for mobile if that works for you?

Let me know 🙂

[metcomllc@aol.com]

What is the largest image (dimensions) that can be used as a mobile header? Ideally I want the image to take up the entire width of the mobile site.

[Leo]

Hmm try uploading the logo you want with this CSS:

#mobile-header .inside-navigation {
    display: flex;
    flex-direction: column;
}

Might take some CSS tweaks after but I can have a look once the above is added.

Let me know 🙂

[metcomllc@aol.com]

The header is too small and to the left.

[metcomllc@aol.com]

I figured it out.

I added

#mobile-header img { width: 100%; height: auto; }

and that did the trick.

[David]

Hi there,

did you find a fix as the logo image is filling the header when i view it. Let me know

[metcomllc@aol.com]

How compatible is generate press with WooCommerce? I know I have access to an extension for WooCommerce but does the mobile version of WooCommerce look good?

[metcomllc@aol.com]

Yes I added

#mobile-header img { width: 100%; height: auto; } which forced the header to take up the entire width of the header.

Another question:

How compatible is generate press with WooCommerce? I know I have access to an extension for WooCommerce but does the mobile version of WooCommerce look good?

[David]

Glad to hear you got it fixed.

Regarding Woocommerce, Yes – GP uses the base templates that Woocommerce provides so compatibility is 100%. We have several sites in our Site Library using woo:

https://generatepress.com/site-library/

Check out:
Merch, Niche, Prime, Seller, Imprint for some examples.

[metcomllc@aol.com]

Thank you

[Author]

Posts