Optimise for mobile?

Is there any way to optimise layout for mobile viewing in RW7? Just got my new website up and running at www.foodforest.nz Looks good on laptop and tablet but text blocks (stacks) not so good on mobile.

What theme did you use to build your site? Responsiveness (or not) is handled by the theme.

With a quick look it seems your site is kind of responsive, but not in the best looking sort of way.

Kikki- sorry I dont understand either of those comments?

Apologies )_ I should have been more speciifc- I mean’t that the stacks are all elongated not that it didn’t load quickly enough.
Im asumming then that in order to have it look right in mobile, only single stacks are going to work, and then it wouldn’t took good on all the other platforms.

Your assumption is wrong. There are plenty of stacks that are responsive. So, in your case, designs that have 2 columns will show up in 1 column only when in mobile view.

But it’s hard to say much unless you let us know more about what theme you used and what stacks. Some themes are responsive, others not. Some stacks offer responsive options, others not. Luckily most stacks do offer responsive options.

For example consider the built-in 2 column stacks that comes with Stacks. There’s a responsive area to the settings. In that responsive area you can choose, e.g., to “stack” your columns instead of have them side-by-side in mobile or tablet views.

1 Like

See the attached screenshot for an example of what I was writing about.

Hi Yes-I am using Stacks in the the theme “Kikki".
So for example on the Home page, the there is a two-stack at the top followed by a three-stack then another three stack

Regards
Lee Brogan

Art & Graphic Design
88C Hansen Rd. RD1,
Kerikeri 0294, New Zealand.
Ph 64(0)21401963
www.leebrogan.com
Instagram: @leebroganart

Just had a look and it doesn’t seem to have the “Responsive” setting - so I guess that’s the Theme.

Can you tell me how I’d find out which ones do?

Regards
Lee Brogan

Art & Graphic Design
88C Hansen Rd. RD1,
Kerikeri 0294, New Zealand.
Ph 64(0)21401963
www.leebrogan.com
Instagram: @leebroganart

When you say 2 stack and 3 stack. What’s the exact name of the stacks? The stacks are responsive whether or not the theme is.

It looks like your theme is responsive: I’m basing this on how the menu behavior changes between desktop and mobile views. I have no idea who makes Kikki. Do you know? But, bottom line, is does not seem to be a problem in your case.

Kiki theme was developed by @yuzool (Yuzoolthemes) and is only available as part of RW package.

As I commented in another post, all themes supplied as part of a package with RW are only there to demonstrate some design possibilities. They are functional, but severely limited in options. It is recommended that for real-life projects you use “real” themes that you purchase separately (some of those may be free).

Is this the site:http://www.leebrogan.com/. That’s not Kiki theme, it’s Tesla. Looks like you’re not using any columns, and at least part of the text is images.
Both Tesla and Kiki are responsive themes, but how you are using stacks and fixed width images make it difficult for the theme to really make them responsive.

Would hope that’s not the case. Otherwise, Realmac should advertise that you need to make additional purchases to create a website.

HI Doug, I was referring to my new website www.foodforest.nz which uses Kiki. I am using stacks on both websites. Usually 2 or 3 column stacks.

Is there another way of using images? I’m not sure what you mean “fixed width images” - I just put the image in the stack column and reduce it to the size I want, is there another way to do it so it will be variable depending on the viewing device?

Regards
Lee Brogan

Art & Graphic Design
88C Hansen Rd. RD1,
Kerikeri 0294, New Zealand.
Ph 64(0)21401963
www.leebrogan.com
Instagram: @leebroganart

If you take that out of the context, it looks worse than when you put that in context of the following sentence, like this:

It may look like a small difference, but it actually changes the whole meaning of my statement… :slight_smile:

1 Like

A few things that can help:

  • On the page “plants” you are using a three column stack, but only have content on the left and middle columns. That wastes a third of the space available.
  • Your using Styled text stacks and are overriding the font sizes. On that page you have set it to 12px, that’s very small try to avoid setting the font sizes from within the styled text area. The Kiki Theme has a font size setting; Normal is 14px; Big is 120% (almost 17px). But if you set the font sizes in the text, it will override what the theme sets. I would set it to “big”.
  • You’re using the standard column stacks; They don’t goto mobile(stack) view until about 400px. iPhone plus sizes and larger Androids will stay in desktop(columns not stacked) view even in portrait. I would suggest you look at another Grid option. Stacks4Stacks AdaptiveGrid is a good free(please donate) option.
  • You’re using the sidebar optionon some pages, but are using stacks pages. I would use the third column and place the sidebar info in the last column, so in mobile view, it would come after the content.
3 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.