Mobile Responsiveness

[rjvilardi]

Using the encounter theme. The site looks fine on my iPad but losses everything except text on a smart phone. Have checked it out on both iPhone and Galaxey. Ant suggestions?

[Sushil Adhikari]

What is your site link? I will check it out on my iphone and if you can, describe what specifically you are losing in the phone view?
Thanks.

[rjvilardi]

http://www.biblesenders.org/new/ I lose the entire heading and graphics. However, embedded graphics in the page seem to work fine. I am using Layer Slider for the pics up top. Also I put in the code for scroll buttons in Layer Slider but need to go back and recheck that as it is not working right. Thanks

[Sushil Adhikari]

Thanks for the link… ok, I went to your site with my iphone and sure enough, it’s like a completely different design and style as though something such as a plugin is creating an alternate mobile view. So I am guessing you are using a plugin that does a different mobile view that is overriding the theme’s own responsiveness. From what I found out, it’s your JetPack plugin, because what I see is exactly like this:

http://jetpack.me/support/mobile-theme/

[Sushil Adhikari]

Awesome that did the trick thanks. I have another small issue I can’t seem to resolve. I want to remove the ability to leave comments on the home page.

Awesome… anyway, I moved this as a new topic to a new thread with a follow up. Cheers!

[Lindsey Carmichael]

I have a question about this as well. When I load my site on my iphone, the image in my blog post (front page) is displaying at a much bigger size than it appears on my desktop, which makes the whole site look very weird.

As per your previous response, I checked my Jetpack plug in, and the Mobile feature is turned off, so something else is up. Any suggestions are appreciated!

http://www.lecarmichael.com

[Sushil Adhikari]

What is happening is that your image (example the cute baby foxes) is in a

container which has an inline style attached to it like this: style=”width: 610px”

The inline style part is causing a conflict with the theme’s responsiveness, so the solution is to simply open the post up in your editor, switch to the text tab, and delete this part:

style=”width: 610px”

[Lindsey Carmichael]

I read the entire post on the text view and couldn’t find a style=”width: 610px” The code for the image is:

[caption id="attachment_365" align="aligncenter" width="600"] Warning: this much cuteness may cause your heart to burst!
Image courtesy of Dr. Svetlana Gogoleva[/caption]

I tried deleting the width=”600″ portions, but that messed up the formating on my laptop without fixing the iPhone…

[Sushil Adhikari]

This is the code I see for that one photo:

[code type=html4strict]

Warning: this much cuteness may cause your heart to burst!
Image courtesy of Dr. Svetlana Gogoleva

It’s the div container that i see that inline style as you can see above. I got this when I looked at your page’s source code.

[Author]

Posts