Contango Pro – Layout on Mobile Device

[Anonymous]

Hello,

The Contango Pro Theme looks great and is fully responsive. However, on mobile devices, the menu headings at the top are staggered and the sidebar gets pushed to the bottom of the page (I would guess this is to keep the font at readable size).

Without resorting to custom code, is it possible to have the layout on a mobile device (both portrait and landscape) look the same as it would in the desktop/laptop version and allow the user to pinch to zoom (since the font will be too small to read by default)?

I apologize in advance if this has already been addressed previously…I did check the forum prior to asking and saw a plug-in was suggested for the menu, but I didn’t see anything to help keep the sidebar from getting pushed to the bottom on mobile devices.

Mainly, I am just experimenting and testing before I go live, so I am trying to figure out what my options are.

Thanks again for all your help and support

Jim

[admin]

Hello Jim,

Quote:

However, on mobile devices, the menu headings at the top are staggered and the sidebar gets pushed to the bottom of the page.

Please use Responsive Select Menu plugin to make the menu Responsive.

https://wordpress.org/plugins/responsive-select-menu/

Quote:

Without resorting to custom code, is it possible to have the layout on a mobile device (both portrait and landscape) look the same as it would in the desktop/laptop version and allow the user to pinch to zoom (since the font will be too small to read by default)?

I have tested it on iPhone 5, it is working nice. I think, you will be good after activating the Responsive Select Menu plugin.

Quote:

Mainly, I am just experimenting and testing before I go live, so I am trying to figure out what my options are.

No Problem, We are also updating the Contango soon with several new changes.

Thanks

[Anonymous]

I searched this forum before asking the question and saw this plug-in was recommended. I tried it, but it didn’t seem to address the issues fully.

But maybe I didn’t experiment with it enough and missed out on some of its capabilities. I will try again and let you know how it works.

Thanks again

[Anonymous]

Hello,,

I have experimented some more with the plug-in. But I still don’t see how this addresses the issue of the sidebar getting pushed to the bottom of the page?

Thanks

Jim

[admin]

Hello Jim,
Please share your website URL, so i will be able to see the exact issue.

Pro Tip:

– Please remove the sidebar widgets to see the theme layout in default widgets.

Thanks

[Anonymous]

Hello,

My site is not really live (I have a plug in saying the site is coming soon while I am working on it).

But I can give you some simple steps where you can observe the exact same behavior:
1. Go to demo for Contango Pro
2. Go to Blog > Post Formats > Standard
3. Observe placement of sidebar:

a. View desktop version – sidebar appears to the right of the post
b. View tablet (portrait/landscape) – sidebar appears to the right of the post
c. View mobile (portrait/landscape) – sidebar appears underneath post (similar to placement of a footer)

This can be replicated anywhere a sidebar is present (not just blog standard post).

This is the same behavior I see with my site viewing on my smart phone (Samsung Galaxy s4 Mini)

Thanks

Jim

[admin]

Hello Jim,

Quote:

This can be replicated anywhere a sidebar is present (not just blog standard post).

At the smaller displays like Mobiles, it is not good to have sidebar and blog content side by side. It is the better idea to stack the design blocks to improve the readability. In the current modern designs (like Antenna WordPress Theme), there are plenty of approaches to stack the design blocks even on iPad portrait view. There are several concepts behind this approach like, clean design, improve readability, efficient use of negative space etc.

We are also thankful for your valuable feedback.

Regards

[Anonymous]

Thank you very much!

Jim

[Anonymous]

I’m with Jim. I just purchased this base on the behavior of the free version (which is excellent). Your free version is not device aware and simply renders the same page on all devices. I need a way to disable the mobile device options for page width, headers, etc. It might not be “good” to have it that way in a pure world, but its also messing up the quality of my photos since those appear to get resized. I use the traditioal blog format. Can you help tell me a way to get it to raster a normal website and ignore the device I am on?

[Anonymous]

This is probably reckless WP development, so be forewarned with my change suggestion. When you update you’ll probably loose this change. With the change below I can now pinch zoom and shrink with my iPhone 5 (ios 7) and iPad (ios , which for people that need reading glasses this is a huge help. Also the entire page comes up retaining its original format/look – menus in the right spots, sidebars in the right spots, etc. (they are just small, but pinch zoom and life is good). I haven’t tested this in other page layouts.

It doesn’t quite have the same display behavior as the free contango theme, but I want to support the development of this theme and there are a lot more options with pro. So I’m moving forward until I’m ready for a responsive design.

The fix edit:
wp-content/themes/contango/header.php

Change this line:

to

It would be really good if there wes an option to disable the responsive portion of the theme. There are a significant number of people when you research this problem that would like this for other responsive themes as well. Or an option on the site to click-through to mobile version.

[admin]

Contango Pro version is responsive and it is the modern design trend that a theme should adjust itself according to device.

We value your feedback and thanks for your ideas and suggestions.

[Author]

Posts