x

Looks great on laptop, but scattered on mobile devices

We just updated our website (ccchstudents.com) and it looks great using the new sections feature! However, it's not looking good at all on mobile phones. Lots of empty space. Words landing in wrong areas. I'm wondering what can be done about this since I believe most of our traffic is mobile. 

Thanks! 

2,300 Views
Message 1 of 17
Report
16 REPLIES 16
Square

I can see what you mean, @ccchStudents. Can you submit a ticket to our support team so they can investigate further? Thanks!

http://hc.weebly.com/hc/en-us/requests/new

2,296 Views
Message 2 of 17
Report

Just following up. I submitted a ticket using my work email. Got a response, but it requested that I use the other work email which happens to be associated with this Weebly account. Did that last night. Got an email today suggesting this matter has been resolved. Hence, I'm following up to make sure this is still getting attention. Could you please let me know where the issue now stands?

Thanks. 

2,281 Views
Message 3 of 17
Report
Square

There were some issues resolved which might have been affecting you - can you re-publish your site and see if that helps?

2,279 Views
Message 4 of 17
Report

Hi Adam,

I am experiencing the same as

ccchStudents.

www.karencurtin.weebly

works great on laptop, but scattered on mobile.

I tried to submit a ticket to support team, but I keep gettng the message to view a bunch of articles...and I do not have confirmation my ticket has been received by weebly support.

I tried using an updated theme, yet is still scattered on mobile.

Please advise!!

Thank, K.

1,766 Views
Message 7 of 17
Report

Hey there K!

It looks like you've been using spaces on each line to give the text a center alignment, rather than using the alignment options in the text editor bar. That would likely be why you're seeing gaps there. Can you try changing that over?

1,764 Views
Message 7 of 17
Report

I am having the same issue, I added some 'Sections' to my website, I used the section as a photo and they looked great on my compter. When I went to check it on the mobile phone the photos were cut in half which was not great scaling by any means. I could understand if some of the top or bottom got chopped off when it scaled down to the mobile view but not in half.... there are other things that don't look great on the mobile view either, basically the stacking of objects just looks horrible... WE NEED THE ABILITY TO EDIT THE MOBILE VIEW!

Mobile phones is where I would think most websites traffic is coming from and they just look so unprofessional.

Please explain why we can not edit the mobile view?

2,262 Views
Message 7 of 17
Report
Square

The mobile view isn't a separate site so there isn't anything to actually edit. With a responsive site, you code in special style rules to make parts of a site display or behave different if the screen is smaller.  

What page of your site did you add this to, @Kiwi? One thing you can do to get more of the sides of an image to show is reduce the height of your section.  The amount of horizontal space of an image shown is dependent on the height of the image and the general width of screen you're viewing it on.

2,252 Views
Message 8 of 17
Report

I'm a little disappointed to find this post and the latest update to it from @Adam (Community Manager) from 1 week ago.  I received an email from Weebly about 1 week ago introducing Weebly 4 and Sections.  I finally took the plunge yesterday and changed the Theme of our website to Bradley and put Sections everywhere, particularly heavily on the homepage.  As the OP mentioned, everything looked awesome on the PC so I hit Publish.  It then occurred to me that I should have viewed the site in the Device Switcher | Mobile mode before publishing, but I didn't, and shock-horror it looked horrendous.

So I used Weebly Support's Chat feature this afternoon and waited a long time while the specialist looked into my issue and raised it to their Tech Support team.  Seems odd since this Community post is 3 weeks old that she wasn't aware of this issue.  Anyway, I received an email update from her one hour later advising that the Techies are aware of this and are working on a solution.  But, again, this has been known about for 3 weeks - how long can it possibly take to address this?  And why are you still plugging this feature when it doesn't work on mobile devices?  The vast majority of our site's traffic is via mobile device!

Due to another deficiency with Weebly, there's no obvious provision for making changes and being able to automatically revert if they don't work out, so the only solution for me now is to manually undo everything I did and manually restore my old website based on, err, nothing until such time you can figure this one out.

So could you please give some indication as to how long your fix is going to take please?  Also, I strongly suggest you cease peddling this new feature or at least have a massive warning advising people that they should steer clear if wanting people to visit their site on a mobile device.

Jason.

2,238 Views
Message 18 of 17
Report


@Adam wrote:

The mobile view isn't a separate site so there isn't anything to actually edit. With a responsive site, you code in special style rules to make parts of a site display or behave different if the screen is smaller.


@Adam,

Should we have to code in "special style rules" or should Weebly just take care of this for us?  I would think the latter.


@Adam wrote:

One thing you can do to get more of the sides of an image to show is reduce the height of your section.  The amount of horizontal space of an image shown is dependent on the height of the image and the general width of screen you're viewing it on.


@Adam

I can sort of understand what you're saying here, but how do we actually accomplish this?  I have a full height heading which reduces in height when the site visitor scrolls down.  So far as I can tell, there's no way of reducing the height of this without changing the header style.  But I would like to retain this header style.

With regards the Sections I've created that have full page width & height (1000px height), if I decrease the height of the Section it doesn't make my image smaller, it just crops the height.  But I can't give up height because the images are photographs of people.  I can lose width, but not height.  So what is the workable fix?

And what about text?  My text appears massive on a mobile device: longer words are split over rows and the user has to scroll to read the shortest sentences. Are you really suggesting that you can't automatically scale this and we have to somehow add code to accomplish this ourselves?

Thank you for any info.

Jason.

2,234 Views
Message 18 of 17
Report

Hey there Jason!

Those special rules are in fact coded into the themes, so no, you won't need to make them yourself (though you can alter them in the CSS if you're inclined to).

What site are you seeing these other issues on? It may be some help if we can check it out.

1,457 Views
Message 18 of 17
Report

@Queso,

Hi, thank you for your reply.  The site is www.thefadedpoppy.com.

Thank you for any insight.

Regards,

Jason.

1,446 Views
Message 18 of 17
Report

Hello???

@Queso / @Adam,

Any update on this?

Thanks,

Jason.

2,008 Views
Message 18 of 17
Report
Square

Sorry, Jason, I don't have an update yet. I took another look at your site though, and it seems like the main issue with space is with the header section. The theme you're using is a little unique in that the header area is meant to be larger at first, then shrink after you scroll.

You might not have this issue if you switch to a different theme in the meantime.

2,006 Views
Message 18 of 17
Report

Hey Jason,

I see you are experiencing similar issues. This is a major porblem that I don't know why Weebly didn't figure this out before releasing this...

I was so annoyed to see my photos were cut in half on the mobile view. You can't see the photo so what's the point of adding a photo?!?! It just doesn't make sense... And I was annoyed that customer support reply to me was that this is how the images cut down to the mobile view and is acting normal, well yes it is acting normal but not displaying my photo.... Useless!

However I have discovered a work around that works. I wish the support staff could of told me about this and saved me a lot of time....

I added a 'Spacer' to the section. You will need to change the height of the 'Spacer' to suit your photo as this will change how much or little of the picture shows on the mobile view.

Later....

2,000 Views
Message 18 of 17
Report

 The problem, on my android mobile is  the text on two pages have alot of separation between the lines all the way down.  Sometimes too, the text overlaps.  The PC looks good, but........ Thanks, Pat 

808 Views
Message 18 of 17
Report
Square

Hi Pat! It sounds like the issue may be with line height and font size. Can you post a link to your site so we can take a look?

806 Views
Message 18 of 17
Report