change text and image placement on mobile view

alexmosp91
New Member
8 0 0

hi, i have a shopify theme that I paid for (start up theme) and when i set up slide show and view it on mobile, the text is on the right. is there a code I can input that centers the image and text on mobile only?

I want it on the right on desktop but it looks odd on mobile.

www.chiquebeautybar.com

0 Likes
dmwwebartisan
Shopify Partner
5716 1307 1677

@alexmosp91 

Please add the following code at the bottom of your assets/theme.css file

@media (max-width: 719px){
.has-image .slide-text { text-align: left !important; }
}

Hope this helps.

Thanks! 

If helpful then please Like and Accept Solution.
Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Advanced Shopify Page Builder to customize your pages - check here PageFly App
0 Likes
Michael_Pink
Navigator
264 44 56

Hi @alexmosp91 
Thank you for your question. 
If you are talking about the text align on the slider.
You can follow this to fix:
follow this path:
Themes => edit code => asset => theme.css.liquid
and add this code to bottom of the file theme.css.liquid

@media (max-width: 719px) {
.slide-text {
text-align: center!important;
}
}


Do not hesitate to let me know, if you have any questions.
email: shopify.expert.team@gmail.com

My life is sharing.
I hope my solution can help you save at least 1$
Build Page faster with PageFly PageBuilder App.
shopify.expert.team@gmail.com
0 Likes
alexmosp91
New Member
8 0 0

it worked thank you!!

 

is there anyway i can adjust the header image to be more centre as well??

0 Likes
Michael_Pink
Navigator
264 44 56

Hi @alexmosp91 
Your mean is image in slider??

 

My life is sharing.
I hope my solution can help you save at least 1$
Build Page faster with PageFly PageBuilder App.
shopify.expert.team@gmail.com
0 Likes
alexmosp91
New Member
8 0 0

yes, i have the same image but centered. is there anyway to center the image with product in the middle, or insert the actual image with product in the middle? 

 

current image has the product on the left so the text is on the right.

 

0 Likes
alexmosp91
New Member
8 0 0

this website does it well : https://flovitamins.com/

0 Likes
Michael_Pink
Navigator
264 44 56

Hi @alexmosp91 
The images on your site and demo you send me are different.
in your images, the product is align left
https://cdn.shopify.com/s/files/1/0470/3515/4599/files/web_Ale_Mospanyuk_Chique_Beauty_Bar_r2_MSP_21...
so better than if you can make the section display another image for mobile view.

My life is sharing.
I hope my solution can help you save at least 1$
Build Page faster with PageFly PageBuilder App.
shopify.expert.team@gmail.com
0 Likes
alexmosp91
New Member
8 0 0

thanks michael. how can i do that? can i set up a completely different image for mobile view only? 

 

 

0 Likes
alexmosp91
New Member
8 0 0

i have images here, these are centred. if possible, i would like for these to show on mobile only, as for desktop, the original images work well as they are.

 

Ale Mospanyuk_Chique Beauty Bar_r1_MSP_2172.jpgAle Mospanyuk_Chique Beauty Bar_r1_MSP_2193.jpgIMG_8186.jpg

0 Likes