Change design of every other featured product

GadgetCheckout
New Member
4 0 0

See the image of what I am trying to accomplish. How can I achieve this?

 

 

whatIwant.PNG

0 Likes
Michal17
Shopify Partner
820 73 144

Hi @GadgetCheckout 
Sincerely hope you're having a great day!
I've read your problem and, before providing a solution, would like to analyze your website. Then, I will provide a solution to you up here - on the forum.
Could you share your website URL? And if your website is password protected, then also provide a password?

0 Likes
Natztech
Shopify Partner
1920 494 1176

hello @GadgetCheckout 

Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.

Want to theme customize contact us E-mail : natztech2312@gmail.com | Whatsapp
PageFly Advanced Page Builder visit pagefly
0 Likes
GadgetCheckout
New Member
4 0 0

Hey!

Thank you for your reply. Here is the Website URL:  https://gadgetcheckout.com/

Best regards, Joshua

0 Likes
GadgetCheckout
New Member
4 0 0

Hey man!

Thank you for your reply. Here is the Website URL:  https://gadgetcheckout.com/

Best regards, Joshua

0 Likes
Natztech
Shopify Partner
1920 494 1176

hello @GadgetCheckout 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 749px) {
.template-index .featured-product__wrapper{
	flex-direction: row-reverse;
}
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com | Whatsapp
PageFly Advanced Page Builder visit pagefly
0 Likes
GadgetCheckout
New Member
4 0 0

Hey @Natztech 

That code does not make a six-sax pattern where every other featured product is reversed. It only reverses the layout. 

 

Best regards, Joshua

 

0 Likes

@GadgetCheckout, do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

@media (min-width: 749px) {
.index-section--featured-product:nth-child(odd) .featured-product__wrapper{
	flex-direction: row-reverse;
}
}


Please let me know whether it works.

Kind regards,
Diego

◦ Slideshow section not looking good? Try the Slideshow (PRO) section. No apps required.
◦ Product page images slider for free themes (w/ 20+ customization options): Minimal | Debut | Brooklyn | Supply
◦ If my answer helps you please click on like and Accept as solution!
0 Likes
Natztech
Shopify Partner
1920 494 1176

hello @GadgetCheckout 

 make a six-sax pattern insert below code 
 Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

 

 

@media only screen and (min-width: 749px) {
 .template-index .index-section--featured-product:nth-child(2n-1) .featured-product__wrapper{
	flex-direction: row-reverse;
}
}

 

 

 

Want to theme customize contact us E-mail : natztech2312@gmail.com | Whatsapp
PageFly Advanced Page Builder visit pagefly
0 Likes