Mobile siteview fixes (tagline, logo, other css)

Hi there,

Let’s tackle one issue at a time.

To display the tagline, you will need to disable the Mobile Header option. For resizing the logo on mobile, custom CSS will be required.

The menu, I’d ideally like to see the option for NOT the hamburger menu so I can decide between the two, but I can’t seem to get it to go from the hamburger menu option to the buttons on mobile to see what it looks like.

I’m not quite sure I understand this. Could you please provide more details?

I want to see what it looks like with the menu buttons on mobile (basically as is on desktop) hope that makes sense!

Go to customize > layout > primary navigation, switch to mobile view, and adjust the mobile break point.

For the logo issue, remove the retina logo at customizer > site identity.

To center the tagline, try adding this css:

p.site-description {
    text-align: center;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

For the image, you are using a GB image block, switch to mobile view, and set the image to align center.
https://app.screencast.com/EON0RVLWo5yAg

Try this CSS:

@media(max-width: 768px) { 
.galleryHeader {
    flex-direction: column;
    align-items: center;
}

.wp-block-ifb-instagram .ifbInstagramFeed .galleryHeader .headerRight {
    margin-right: auto;
}
}

Glad to hear that 🙂