How to Configure For Mobilw

When viewing my site in my cell phone, some of the text is cut off on the home page, on the About page, the picture and text is out of order and on the Services page, two slides are merged instead of being separate.

I’m assuming you are talking about the text in the captions on the inMotion slide show? It’s difficult to debug due to the animation. As soon as the slide with the cut-off caption appears it changes to the next slide before I can tell what’s causing the issue. This inMotion slide show is all driven by JavaScript and I don’t own that one.

I would suggest maybe you copy the slideshow stack onto a page by itself. Remove all the images other than the one that is cutting off and preview that. Make sure the images all are the same size.

Not sure what order you are expecting? The three-column stack you are using will “stack” the columns from left to right at 400px screen width. That seems to be working as designed.

You do have a lot of margin space going on mobile. You have 80px on the 3 column stacks and then 120px on the Paragraphpro stacks. Before it goes mobile when they are three wide I’m guessing you wanted that to space the two side(left and Right columns Down? The included 3 column stack has no way to change the order the columns stack.

So do I not use the 3 column stack so that it displays better on mobile?

Sincerely,

Robin Traiger, LCSW

Conscious Counseling
A New Way to Expand

consciouscounseling.net

THIS EMAIL AND ANY FILES TRANSMITTED WITH IT ARE CONFIDENTIAL AND ARE INTENDED SOLELY FOR THE USE OF THE INDIVIDUAL OR ENTITY TO WHOM THEY ARE ADDRESSED. This document may contain information covered under the Privacy Act, 5 USC 552(a), and/or the Health Insurance Portability and Accountability Act (PL 104-191) and its various implementing regulations and must be protected in accordance with those provisions.

If you are not the intended recipient or the person responsible for delivering the email to the intended recipient, be advised that you have received this email in error and that any use, dissemination, forwarding, printing, or copying of this email is strictly prohibited.

If you have received this email in error, please return immediately to the sender and delete this copy from your system. Thank you for your cooperation.

Column stacks are great for mobile. On Mobile, because you have very limited screen width the columns stack from left to right. If you don’t use columns then your pages usually won’t look good on either mobile or desktop.

Without knowing what look you’re trying to get on mobile, tablet and desktop it’s hard to say.

Most folks find it easier to do a Mobile First Design. Meaning layout what you want the page to look like at the mobile size. Then once you’re satisfied with the mobile look and feel, bump up to the tablet size and see what you might want to add or rearrange. Then repeat for desktop.

It’s usually much easier to fill additional space than try to crame a larger size into smaller space.

Thank you. Sound advice. I used 3 columns across for my about page because I had a lot of white space when I did it with 3 columns vertically. But it seems vertical will work better mobile.

Is there a way to configure RW so that I am creating “in mobile”?

Sincerely,

Robin Traiger, LCSW

Conscious Counseling
A New Way to Expand

consciouscounseling.net

THIS EMAIL AND ANY FILES TRANSMITTED WITH IT ARE CONFIDENTIAL AND ARE INTENDED SOLELY FOR THE USE OF THE INDIVIDUAL OR ENTITY TO WHOM THEY ARE ADDRESSED. This document may contain information covered under the Privacy Act, 5 USC 552(a), and/or the Health Insurance Portability and Accountability Act (PL 104-191) and its various implementing regulations and must be protected in accordance with those provisions.

If you are not the intended recipient or the person responsible for delivering the email to the intended recipient, be advised that you have received this email in error and that any use, dissemination, forwarding, printing, or copying of this email is strictly prohibited.

If you have received this email in error, please return immediately to the sender and delete this copy from your system. Thank you for your cooperation.

In preview you can check the box at the bottom Manual adjustment then drag the side of the image to any size you want. You can aslo change the User Agent to iPhone or iPad.

2019-07-22_10-07-49

In the Simulator Mode ypu can change the window to anyone of the Apple presets or Custom
2019-07-22_10-10-14

Also in the Simulator windw you can open more than one simulator window at a time and then save the “layout” and and then with a “single” selection open the same “layout” (Multiple windows open at the same time.

2019-07-22_10-14-28

2019-07-22_10-15-03

IOn Edit mode if you want to kinda get a feel for smaller screens just resize the RapidWeaver window or stretch out the stacks library to fill more of the screen.

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