Change mobile view without changing desktop view extra help

Solved
laserbeampq
Excursionist
18 0 7

So I know that in order to change the mobile view of my site without affecting the desktop view, I need to use a code that wraps everything for a specific size in a media query. I tried that method but for some reason it still wouldn't let me edit the mobile version without affecting the desktop version.

 

How exactly would I use media queries for this? What specific code/s in what specific section/s? I use the Venture theme. Thanks!

Accepted Solution (1)

Accepted Solutions
KetanKumar
Shopify Partner
25049 2508 9067

This is an accepted solution.

@laserbeampq 

yes please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media only screen and (max-width: 749px) {
.link-block {padding: 50px 20px ;}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post

Replies 7 (7)
KetanKumar
Shopify Partner
25049 2508 9067

@laserbeampq 

sorry for any issue if possible to share store url and issue image 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
laserbeampq
Excursionist
18 0 7

@KetanKumar store url is https://helioenvy-cosplay.myshopify.com and the password is "rtewda"

 

I think that most of the images in the mobile view are still too large. That's what I wanted to change.

KetanKumar
Shopify Partner
25049 2508 9067

@laserbeampq 

can you please show me issue images

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
laserbeampq
Excursionist
18 0 7

laserbeampq_0-1635663778359.png 

 

laserbeampq_1-1635663905111.png

It's the second and third rows (the link blocks) that are too big

 

KetanKumar
Shopify Partner
25049 2508 9067

@laserbeampq 

do you have like this?

KetanKumar_0-1635667585374.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
laserbeampq
Excursionist
18 0 7
KetanKumar
Shopify Partner
25049 2508 9067

This is an accepted solution.

@laserbeampq 

yes please try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media only screen and (max-width: 749px) {
.link-block {padding: 50px 20px ;}
}

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Partner | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing

View solution in original post