Keep sidebar ad visible on mobile phones

Hi johnnorton. Guess you must have implemented your “last resort” since it seems your site is no longer responsive. In a responsive mode, on a smartphone viewport, the sidebar should be pushed below the content but it should be fully visible.

Looks like the responsive.css is being loaded again. Is the default layout for a smartphone OK, or are you still looking for an alternative?

Hey – thanks so much for helping me with this. Yesterday afternoon, while prepping a new blog post, I noticed that the responsive layout was not functioning on my laptop. So I went back to Theme Options (Hueman) and turned on the responsive function again. That solved the problem.

I thought the setting was affecting only mobile – guess not. I’ve loaded a screenshot to show you how my settings are, and the info provided by theme.

The default layout for smartphone does not appear to show the left sidebar at all, not at the top or the bottom, vertical or horiz. This is with responsive .css cut on. I’m using a Motorola Android phone to look at it. We don’t currently have an iPhone. Don’t know if that’s a factor. This problem of the mobile phone setting was first raised to me by a tech at the ad server I use (Broadstreet). He said:

“…it’s more of a matter of the mobile template supporting widget areas. That’s the only way we (or anybody) could hook in. That said, your desktop site template is naturally responsive (ie, mobile friendly), so is it possible to disable the mobile template you have? You might be surprised to find how well it works (and displays ads) on mobile naturally.”

Thoughts? Be gentle, I’m a writer/editor not a coder/IT. If I need to engage professional help, I’m willing. But I really want the ad to be served when a page is viewed.

I pulled up your site on an iPhone 4 (yep, it still works…;-) I’m not sure how your initial mobile “home” blog page is being served but it doesn’t appear to be using the Hueman theme. When I scroll to the bottom of that mobile page, and click the “<< Older” link, then it takes me to your site home page using the default Hueman responsive layout. Here, if you scroll down the page, you’ll see both sidebars displayed below the content area. That’s how the theme is designed. However, at the very bottom of the page below the footer, is a “View Mobile Site” link. I’m not sure where that comes from but it’s not generated by the Hueman theme. I also noticed that if you open the menu on either the default theme view or the other “mobile” view, some of the menu options use the default theme view while some use the other “mobile” view. After reviewing your site assets I see you have Jetpack installed. Do you maybe have the “Mobile Theme” option in Jetpack enabled?

bdbrown, you’re awesome! I will investigate. A teacher friend who runs his on impressive WP site helped us establish our original site (with a faulty theme, it turned out – hacked) and this replacement. He recommended the Jetpack. I haven’t explored it but I’ll check. I also see the “View Mobile Site” link in the footer. On my Android phone, when I click that, I get pretty much the same look served up.

More soon…

bdbrown… I found the Jetpack setting and it was activated. I deactivated it. Went to the Hueman theme options – the setting I sent screenshot of earlier. Then checked on my Android phone. It is serving differently but it still will not show the sidebars unless you click green double arrow, left or right.

Another quirk: Although the theme setting gives the choice of:
? Show sidebars
? Hide primary sidebar
? Hide secondary sidebar
? Hide both sidebars

When I choose “hide secondary sidebar” (the right one) and update, it doesn’t change anything. The option to still chose either side remains and you still have to click the double-green arrow to open either sidebar.

My expectation would be that if you hide the secondary sidebar, the primary sidebar will appear in some devices, at least in horizontal position. But that doesn’t seem to be the case.

Thoughts? What do you see on your iPhone?

I think there’s still something conflicting with the theme. On my iPhone I see your site as it is displayed on the desktop, with the posts stacked in one column, followed by the left sidebar. However, the right sidebar, which should be below that, is not displayed. There is a red bar running down the right side of the content that wouldn’t normally be there. I did notice that the PageNavi controls bleed over the right edge of the content area so not sure if that’s affecting the right sidebar or not.

The basic theme responsive media queries are set as follows:
At 1200px the right sidebar collapses
At 960px the left sidebar collapses
At 720px the main menu and topbar collapse
At 480px the sidebars are expanded and displayed below the content
These points can all be adjusted with custom css.

When I ran a clean theme install and tested all four Mobile Sidebar options, they all responded as expected on my iPhone.

I didn’t know you had the ability to do a clean reinstall of the site theme. But it worked! It’s now displaying the left sidebar below the main bar content, on frontpage and any post page. That’s what I need it to do. I really appreciate the help!

I think the missing right sidebar is missing on purpose. My current setting in the theme options looks like this – which tells that sidebar to disappear in mobile mode, Does that make sense?

john

Yep, that sounds right. Glad it’s working.

I do notice, now that I’ve looked again this morning, that the left sidebar displays below the post when I hold the phone vertically. But when I tilt it to horizontal, the green double arrows reappear, the main bar widens, and the left sidebar is no longer present below the post. I imagine this is the way the template creator intended. My wife, who spends more time with the 20-40 mobile age group thinks that most read content like this in vertical/portrait mode, so I should gain some ground in terms of ad impressions. I’m jotting down some baseline numbers to see.

Thank you so much for your help. I had no idea how supportive the WP community could be. Very encouraging in these times when corporate tech seems to be increasingly driving users into… cattle pens?

Glad I could help. Good luck with your site. If you don’t need any further assistance here please mark the topic as resolved. Thanks.

Needed to test the change and see if data indicated mobile traffic was showing up in the impressions count. It is! Resolved.

One further comment – I love Hueman and appreciate axlmedia’s wonderful gift. I do hope that the time will come when he’ll consider creating some options for arranging the ordering of the main column in the mobile mode.