making Recommended Products section full width

Isa_Abrera
Tourist
4 0 1

Hello! I followed the instructions to add a recommended products section (https://help.shopify.com/en/themes/customization/products/features/recommend-related-products#sectio...) but it shows up under my product description on the right column. I'm using the Brooklyn theme

I couldn't figure out how to make the section go underneath the product photo and description sections, so it would take the entire width of the page and not just in a column. Much like a "footer" of the page.

Replies 26 (26)
Jackzsan
New Member
3 0 0

Hi there, i am having pretty much the same issue. 

I am using Debut theme. 

Is there a way to make Recommended products section full width so it stays full width wherever page the section is on ? 

Many thanks for you help ! 

 

suyash1
Shopify Partner
3743 410 612

@Jackzsan - we need to edit css to make section full width, can you please share page link where you have this section?

You are welcome to contact me, my email - suyash.patankar@gmail.com ,My timezone is GMT+5:30
Jackzsan
New Member
3 0 0

Hi suyash1,  

Wow !! Fastest answer ever !  


here you go : https://maisondereviere.com/products/carre-de-soie-mia-rouge  

Pw : shonta 

suyash1
Shopify Partner
3743 410 612

@Jackzsan - please add given css to the end of your theme.css file and check, you can adjust numbers as per need 

#shopify-section-product-recommendations .page-width {max-width: 100%; padding-left: 15px;
    padding-right: 15px;}
You are welcome to contact me, my email - suyash.patankar@gmail.com ,My timezone is GMT+5:30
Natztech
Shopify Partner
2238 565 1373

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

#shopify-section-product-recommendations  .page-width 
{
   max-width: 100%; 
   padding-left: 12px !important;
    padding-right: 12px !important;
}

 

Jackzsan
New Member
3 0 0


Many thanks @suyash1 & @Natztech for the given code... However it doesn't seems to be working. 

Would it be possible to have 6 products in recommendations row so it appears full width  ?  

suyash1
Shopify Partner
3743 410 612

@Jackzsan - please check line 7039 and 7050 in your css file... one bracket is extra, if you want ocde in media query then you need to remove bracket on line 7039 and if no then 7050.

 

also, css lines do not have semicolons. please check that too, any error can cause css to not work. If you find it difficult then please add me to staff,  I will check it

You are welcome to contact me, my email - suyash.patankar@gmail.com ,My timezone is GMT+5:30
Natztech
Shopify Partner
2238 565 1373

@Jackzsan  please insert code in your file after line  75 

RubenTantä
Tourist
25 0 4

Please can you help me to do the same in my alchemy theme?

 

This is the link but is with password now https://tantarainwear.myshopify.com/ 

This is a password: sheuso

 

Also i need to do in the product card.