-
AuthorPosts
-
January 31, 2016 at 6:27 am #575163
Hi it has been fun playing with the advanced backend drag and drop layout builder, and I have managed to make something that feels really beautiful and it is working great for desktop and laptop via Chrome, but looking bad on mobiles and cellphones.
Would you please be able to have a look and advise on what I can do? aka HELP :/
Thank you
February 1, 2016 at 8:31 am #575626Hi prettyfish,
I couldn’t see anything obviously wrong with your site on mobile, could you post screenshots of the issues please?
Regards,
RikardFebruary 1, 2016 at 9:20 am #575652Hi Rikard, thanks for your reply! There is text and copy in the dark / dark green areas between the light-brown scrolls, which is supposed to show just on the scroll. If you compare it to what you see on a desktop or laptop it will be obvious because the formatting and spacing has gone all weird with the responsive version.
Let me know if you will still need a mobile screenshot.
Cheers!
February 2, 2016 at 5:53 am #576241Hi,
Ok, I think I understand what you mean. Please send us a temporary admin login so that we can have a closer look. You can post the details in the Private Content section of your reply.
Regards,
RikardFebruary 2, 2016 at 6:59 am #576261Thanks! Here is it Rikard
February 3, 2016 at 5:08 am #576859Hi,
Because the background image you have chosen is set to repeat it’s almost inevitable that some of the text will eventually display over the dark area of the image and not be readable because of it. It will be very difficult to adjust that for every screen size, maybe you want to not display the background image for mobile? If not I think you will have to do a separate version for mobile only. Let us know what you would like to do and we’ll give you some custom CSS to use.
Thanks,
RikardFebruary 3, 2016 at 7:40 am #576926Hi Rikard, thanks for clarifying and looking into this.
What do I have to do to make another one for mobile with the background image? And what do I have to do to make a mobile version without the background?
I would prefer to keep the image.
Cheers,
Candace
February 4, 2016 at 5:39 am #577562Hi,
If you want to make a separate version for mobile, you can activate the custom CSS field for all element: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/, then add the following class to the elements you don’t want to show on mobile: not-visible-on-mobile, and this class to the elements you do want to show only for mobile: visible-on-mobile. Then add the following to Quick CSS:
@media only screen and (max-width: 767px) { .not-visible-on-mobile { display:none !important; } } @media only screen and (min-width: 768px) { .visible-on-mobile { display:none !important; } }
If you want to remove the background image for mobile only you can try the following in Quick CSS:
@media only screen and (max-width: 767px) { .page-id-130 .avia-builder-el-3 { background-image: none !important; } }
Thanks,
Rikard- This reply was modified 8 years, 9 months ago by Rikard.
February 6, 2016 at 6:57 am #578958Thanks so much Rikard. The logistics of making a new version for mobile only is hurting my brain.
If there is someone you could recommend to help me with it for a small fee of course, please let me know.
Otherwise I am going to try the version that allows the mobile version to have no background.
Thanks so much!
February 8, 2016 at 7:24 am #579393Hi,
If you need to hire a freelancer we recommend Codable, otherwise you can have a look at upwork.com where you can find a lot of freelancers as well.
Thanks,
Rikard -
AuthorPosts
- You must be logged in to reply to this topic.