In this session we discuss why a site doesn’t look good on mobile devices and the way to make that possible is by selecting a responsive skin. We also show where to find a couple of responsive themes for Thesis 1.8.5.
Member: Well, I’m creating a website that’s in full width and it looks fine when I have it on a larger screen but I tried it on my laptop and there’s this scroll bar at the bottom that appears that goes left to right or right to left and I’m not really sure why that is, I’m just wondering how to fix that.
Rick: So, what theme are you using?
Rick: And which version of Thesis?
Rick: Okay, so it’s very difficult to fix on 1.8. BYOB Website is still on 1.8 as well and so if you, as I’ve just done, reduce my page size, you can see it does the same thing you’re referring to. What you need is a responsive theme and what that means is either Thesis 2.1 or I think there may be a couple of responsive themes out there for Thesis 1.8. Actually there is one for Thesis 1.8, themedy.com has a Thesis 1.8 version of a responsive theme and I believe it’s called Reactiv.
I think Reactiv is a responsive theme for Thesis 1.8 but otherwise, Thesis 1.8.5 is not designed to be responsive and so it doesn’t adjust what it displays based on the size of the window. Now, Thesis 2.1 does and this child theme for Thesis 1.8 does but the standard Thesis 1.8.5 is not going to be responsive.
Rick: And so that’s what you’re looking for. You’re looking for something that is responsive. Responsive means that it responds to browser windows. So, I have my Carta for Thesis 2.1 on this site here and if you reduce the size of the window, you can see everything changes, this three-columns becomes two-columns and stuff drops down in size and the slider changes size and all the rest that kind of stuff. This all happens because the skin itself is responsive but that’s not possible out of the box in Thesis 1.8.5.
Member: Alright, well that’s good to know. I wasn’t sure what responsive meant so thanks for explaining that.
Rick: Yeah, so what it means is… I think actually you can get a good picture of that in this website called theresponsinator.com, if we put this URL in you can see what that site looks like in an iPhone, what it looks like in iPhone in landscape mode, what it looks like in a kindle or actually I guess that’s the iPad. What it looks like in the iPad landscape version and then what it looks like in a kindle. If you were to take BYOB Website and look at that instead, what happens as a practical matter, is that the device has reduced it in size.
Rick: But you can see what this shows it does, it just cuts everything off, makes you scroll sideways in order to see it. That’s because BYOB Website is not responsive yet.