Website not displaying correctly on mobile view(icon and slideshow images)

ThePhoneSpecial
New Member
1 0 0

Hello All,

I'm in my final stages of adjustments before launching my site and Shopify plan for www,ThePhoneSpecialist.co.uk(password is tawcla) and whilst doing all my website editing on my browser, my website had no visual issues. I've just done a test on a mobile browser, and if you can see in the attached images, there are two issues. I've uploaded desktop view and mobile view. If anyone can help me resolve the icon overlapping, and only half my image/slideshow showing, that would be incredible!

1) The basket checkout icon has moved for some reason and overlapping.

2) The 2 photo slideshows present, only show half of the image/slideshow.

Screenshot_20210622_205210_com.android.chrome.jpgScreenshot_20210622_211918_com.android.chrome.jpg

 

Now bellow is the attached view of the desktop version on a windows laptop, which displays perfectly:

DESKTOP 2.PNGDesktop.PNG

 

0 Likes
LitExtension
Shopify Partner
1236 162 218

Hi @ThePhoneSpecial

#1:

Please follow the steps:

- Step 1: Go to sections > header.liquid file and change code: https://i.imgur.com/P9eUdo6.png => https://i.imgur.com/oFPgbfA.png

Code: one-eighth, medium-down--six-eighths

- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

@media only screen and (max-width: 768px){

        .site-nav__link--burger{

           top: 0px !important;

        }

        .site-header__logo{

            font-size: 18px !important;

        }

}

https://i.imgur.com/7JvaCJa.png

#2: Please change Slide height: Adapt to first image

Refer: https://i.imgur.com/2GuTejf.png

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
0 Likes