[Support request] customising layout for mobile theme

[manaadiar]

Hi there, I am using the child theme of GP.. But when i try to customize the layout, navigation etc for mobile theme it seems to affect the desktop as well.. Like if i want to hide the sidebar on mobile, it is also hiding it in the desktop version.. Pl see this image.. I click the mobile version in WP controls to make this change..

https://shippingandfreightresource.com/wp-content/uploads/2019/12/controls.png

Not sure if I am doing anything wrong..

[Tom]

Hi there,

That icon simply shows you the site on that device – it doesn’t make it so all of the options apply to mobile only.

Some options have mobile/tablet options – those ones will have the mobile/tablet icon next to the option name.

Otherwise, you’ll need to use CSS and media queries (we’re happy to help if you need) to adjust other things.

[manaadiar]

Ok noted, can you advise me what i need to do to customize my mobile theme so that

1) the sidebars don’t appear as a sidebar, but at the bottom of the screen after the content
2) the nav menu and header should be centralised
3) images in the post should be center aligned and not right or left aligned as it is visible on the desktop..

[Tom]

1. This is the default behavior. It’s not working in this case because you’ve added this custom CSS:

.grid-30 {
    width: 30%;
}

.grid-70 {
    width: 70%;
	}

2. This should be the default if you disable the Mobile Header option.

3. This should be default as well – can you point me to a page where I can see the issue?

[manaadiar]

Hi Tom, you can try https://shippingandfreightresource.com/scale-less-weighing-of-containers-for-solas-vgm/

this i put to adjust the sidebar width..

.grid-30 {
width: 30%;
}

.grid-70 {
width: 70%;
}

[manaadiar]

While on this link, you can see image with SOLAS VGM and Amit Aflalo where you can see the images are left aligned.. While it is coming from the image itself, on a mobile theme can this by default go to center aligned..??

[Tom]

This is what I’m seeing on mobile: https://www.screencast.com/t/lgb8bygQk

That CSS for the sidebar isn’t necessary – we already set that CSS for you and handle the widths on mobile as well.

[Author]

Posts