x

How to get it to look good on BOTH ph and tablet

I am wondering how to get my Weebly website to look good on both a mobile phone and a tablet.  If I get it to look good on one, it looks bad on the other. And vice versa.  I am sure it has something to do with the sizing.

By the way I also went into the "Advanced" features and made a mHome page (and a few other pages) so that if someone is using a mobile device, my site kicks them over to my mHome page which is optimized for moble.  I had the same problem getting the NON-optimized version look goos at the same time as the mobile-optimized version.  I hit upon this idea of creating a dummy page that ony comes up when a mobile device is used.    But the question remains, how can I get both the phone and tablet version looking good (as well as my non-optimized version) -- all at the same time?  THX.

B.

4,500 Views
Message 1 of 9
Report
8 REPLIES 8

Hello @Bdor

I am really happy to hear you did the identify by user agent (mHome) option! I personally feel this is the best way to get the best results in the mobile views for all sizes.


I would like to review the structure of your element layout so I can give you some pointers on how to make it look the best possible across mobile devices. Which page is giving you the most problems? Please add all that content you wish to have on the page. I will also need a little summary of how you would like for it to look.

4,495 Views
Message 2 of 9
Report

Let's see if I can answer your questions.  First, I think the Home page (unfortunately) looks the worst.  The list of items that appears should be centered.  You will notice it is off-klter.  Never mind that our image does not show up.  I wish it did but I am thinking that may not be possible.

The other pages I have "m"pages for are Who We Are and Express Packages.  I do not have a tablet, only a smart phone, so I have to depend on my partner (who owns a tablet) to tell me when the tablet version looks lousy.  I work to get the phone version looking good.  Let's start with the Home page.  I actually can't remember if the other ones look lousy on a tablet.  They look fine on my phone. The Home page I cannot get to look right to save my life.

The site is Rev21.biz.  Thanks, Nicky, for your help!

B.

4,479 Views
Message 3 of 9
Report

Nicky and Bdor, how did you create the mHome page under Advanced? I can't see how to do that for my website www.learneft.nz which is having display problems in the mobile version on Android. Text blocks lose some of the text on the right hand margin making it unintelligible. More detailed instructions would be really appreciated. Thanks, Liz 

4,473 Views
Message 4 of 9
Report

Hello @lilibet60

You will paste a script in the advanced SEO page of each page you wish to have redirected.

<script>
 var ua = navigator.userAgent;
 if ((ua.match(/iPhone/i)) || (ua.match(/Android/i)) || (ua.match(/Windows/i))) {
 location.replace("mYourpagename.html");
 }
</script>

The script above does into your desktop page advanced>header section.

The "mYourpage.html" is the name of your mobile page with is created and hidden from navigation. I have a post about this somewhere in the community. I think I need to write up a " HOW TO" post for this one though.  It is most useful.

@Bdor

I am going to look into your site now so I can see what I can help with.

4,465 Views
Message 5 of 9
Report

Hello @Bdor

I see you are in there making changes. From what I see in the words it is simple spacing. But the method you are taking is just basically adding all the text to a large text element with spaces and this will reflect rather harsh on every single mobile view. It will also reflect very differently by screen size because you can fit more spaces on a larger screen. I would recommend creating an image of what you are trying to accomplish, then changing the header to no header and adding a single image element to the top. Publish and see how it looks 😃

4,460 Views
Message 6 of 9
Report

Nicky, can you refresh and take a look?  I think I was doing exactly what you are saying while you were replying!  It suddenly occurred to me to not try to use the background but just to add the image at the top, use no header, and just rebuild the page.  It looks good on my phone now and my partner says it looks good on her tablet.  What do you think? THX.

4,453 Views
Message 7 of 9
Report

Hello @Bdor

It is not working! It is directing to a page named m.home.html   You cannot have the additional period in there. Your mhome.html looks great though!

If you want to have your entire site on the m.yourdomain.com subdomain we would have to build a second site and then add the code to one site to direct to the other. It can be done though if that is your goal 😃

4,451 Views
Message 8 of 9
Report

you want ecoin to give you user and pass you an ecoin container

1,506 Views
Message 10 of 9
Report