Text Column With Image Debut Mobile View Issue

Solved
usnpups
Tourist
9 0 1

I have the desktop view (photo 1) the way I want it (medium-up--one-quarter) but the mobile view (photo 2) is only showing one column and I would like for it to show two.  Not sure how to accomplish this.  Thank you in advance for any guidance.1.jpg2.jpg

0 Likes
Jasoliya
Shopify Expert
4138 569 1000

This is an accepted solution.

Hi @usnpups 

Follow this:

Section->feature-columns.liquid->find bellow line and add small--one-half

<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }}" {{ block.shopify_attributes }}>

So it look like:

<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }} small--one-half" {{ block.shopify_attributes }}>
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
usnpups
Tourist
9 0 1

Thank you so much!!!  Worked perfectly!

0 Likes
henz123
Excursionist
18 0 2

Hi Jasoliya

 

How do i do this for three icons on the same line for mobile?

 

Thanks!

 

 


@Jasoliya wrote:

Hi @usnpups 

Follow this:

Section->feature-columns.liquid->find bellow line and add small--one-half

<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }}" {{ block.shopify_attributes }}>

So it look like:

<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }} small--one-half" {{ block.shopify_attributes }}>

 

Jasoliya
Shopify Expert
4138 569 1000

Send me your store url. 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
henz123
Excursionist
18 0 2
www.jadons.co.uk



I only would like to make these changes to the first set of text columns (delivery, support etc)



Thank you :)


0 Likes
Jasoliya
Shopify Expert
4138 569 1000

Add this css in asset->theme.scss file at bottom:

#shopify-section-1581344988774 .grid__item {width:33.33% !important;}
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
henz123
Excursionist
18 0 2

Perfect! Thanks so much

0 Likes
TEAMHW
New Member
5 0 0

Hi,

 

I would like to do the same. I have three columns on my web site and when I go on mobile I have 1 image with the other one next a the bottom. I would like at least 2 columns on mobile pretty the same as collections.

 

When I use your code small--one-half  and put it at the good place, nothing happen on my mobile.

 

Can you help ?

 

thanks

0 Likes
Jasoliya
Shopify Expert
4138 569 1000

Send your store url 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com Or WhatsApp Or Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes