How can I set my product pages to full width in Debut?

[David007]

I think others may have posted similar, but cant find an answer. I would like to set my product pages as full width. I will attach the codes below

[motorcitypc]

I have the same issue. Did you get any resolution with this problem?

---

@David007 wrote:

I think others may have posted similar, but cant find an answer. I would like to set my product pages as full width. I will attach the codes below

---

[sehrish]

Hi

i want to download google shopping app but unable to find it in shopify. can you please help me 

[Bemestar]

Then what would you have a product picture in the middle and description bellow it?

Im also interested in doing something about how it looks but more interesting would be to have the product image follow the scrolling action and always be visible. That would be great!

[Misfit_Code_Dev]

Hey Everyone.

If you can make a mockup and provide your store link I would be happy to send an invite from my partner account to take a look at your store.  Based on your description I do not think it would be to hard to do.  As such, I would not charge you anything for it.

Best Regards,

Duncan.

Isle of Misfit Code & Development

[Joan-Carnegie]

Hello Dear Shopify Developers.

I use the minimal theme , 

I like it so much , but I would like to add some preferences on the store I have opened , 

would you help me with the codes and exact line to touch , and the file ..

this is what I would like to do

1> the slide show , I would like to have some more pixels for my slide pictures to show very well  as I wold really like that spirit be shared with the visitors of my stores to buy my products ,, quietness and so on , I would like to have some more pixels in   height,

2> the second thing is ,, I would like to have a slideshow button , as on the ``Brooklyn them`` ,, so that I could use that opportunity to have my clients buy directly using a link right upon the slide show rather than having them to produce any extra effort to go to the products ,to buy ,, a sort of call to action right in front ,,,

3> on the phone ,,``mobile`` display of my theme ,, ``Minimal ``,, the menu become ``superposed`` what I would like to avoid ,,because I think online clients are already so focused on many others of their person details on the net , not only , and the scarcity of time for many details of the numerical time we live in ,, they don`t care to give any utility in searching to scroll down menus to read them all and so on,, I have somehow noticed that the features ,,or here the ``menus`` right in-front helps solve for us all that problem whiteout and increases ``conversion`` better ,,so ,, this is my question ,, how would I on the minimal theme customize or retouch my codes to make the mobile display have its menu ,,``the home menus`` not be superposed but look as on the computer display ,, I mean ``a menu after an other ,,using the empty space after the logo in the header instead of going in the announcement bare and be superposed ,,

dear Guru ,, I love your helps so much , they have so so so much helped out here ///

so ,, Thanks for all the answer you`ve given already in many others post of yours,, 

socialfundfordevelopment77@gmail.com

[questilar]

I use the Debut theme and I had shopify do the change for me. After looking at the code I feel like an idiot for not even trying this. Super simple edit!!

this is the default.

       <div class="product-single__description rte">
          {{ product.description }}
        </div>

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>
</div>

Basically we are going to move the <div class="product-single__description rte"> below the end if and two divs. 

        

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>

{% comment %}  moved product description to be full width {% endcomment %}
  <div class="product-single__description rte">
    {{ product.description }}
  </div>

</div>

This is the easiest change and it works like a charm!!

[Katherine5]

This was soooo helpful! Thanks for the code - worked perfectly :-))

[plehner93]

thank you for the code, this is perfect 🙂 

i have only one issue, if I do this my product.description text is on the right edge, and in the mobile version I can't read the first 2 letters on the lift side. 
do you know how to fix this issue? 

best regards, 
Patrick

[questilar]

It automatically works for me. Could you send me your code and I can help to see what's wrong?

[NiOO]

Hello, I'm been trying all sorts of things to do this! So this sounds ideal but I'm really slow with the coding side, can you please explain where this code goes and show what the result looks like? THANK YOU.. 

---

@questilar wrote:

I use the Debut theme and I had shopify do the change for me. After looking at the code I feel like an idiot for not even trying this. Super simple edit!!

this is the default.

       <div class="product-single__description rte">
          {{ product.description }}
        </div>

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>
</div>

Basically we are going to move the <div class="product-single__description rte"> below the end if and two divs. 

        

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>

{% comment %}  moved product description to be full width {% endcomment %}
  <div class="product-single__description rte">
    {{ product.description }}
  </div>

</div>

This is the easiest change and it works like a charm!!

---

---

@questilar wrote:

I use the Debut theme and I had shopify do the change for me. After looking at the code I feel like an idiot for not even trying this. Super simple edit!!

this is the default.

       <div class="product-single__description rte">
          {{ product.description }}
        </div>

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>
</div>

Basically we are going to move the <div class="product-single__description rte"> below the end if and two divs. 

        

        {% if section.settings.show_share_buttons %}
          {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
        {% endif %}
    </div>
  </div>

{% comment %}  moved product description to be full width {% endcomment %}
  <div class="product-single__description rte">
    {{ product.description }}
  </div>

</div>

This is the easiest change and it works like a charm!!

---

[questilar]

I can definitely help you get this done.

We are going to go to edit theme code and find the product-template.liquid file in the sections theme.

On line 239 you will see the div class product-single__description. See image below.
[cid:image001.png@01D5E30A.3438E660]
We are going to move the div and place it on line 245 before the last closing div.
[cid:image002.png@01D5E30A.95290810]
That makes the description full width.

[NiOO]

YOU ARE AMAZING!!

Thank you for your help. Worked a treat!

I don't suppose you know how to add tabs to the product page to or dynamic text which is product variant specific? 

Thanks again 🙂

[airop]

Hi there. I think this is what we're all talking about.... I'm using the District theme

Here's the page

https://air-opportunity-adventure-co.myshopify.com/pages/adventures

I'm trying to get the 4 square images side by side instead of stacked. Any help greatly appreciated!

[MiriCork]

Hey there everyone! I would like to do the same thing, putting the description full width but I am not good with code. 

I have tried myself but not sure what I am doing wrong. 

Here is a screenshot, if anyone could help I would appreciate it very much.

Thank you

Nadia

screenshot

[tyrone3]

I would like to narrow the margins on my home page by half. making the background space smaller

please help. thank you

---

@David007 wrote:

I think others may have posted similar, but cant find an answer. I would like to set my product pages as full width. I will attach the codes below

---

[elenasers]

Hello, I believe this is the topic of discussion. I'm currently using the District theme.

Here's the specific webpage: https://air-opportunity-adventure-co.myshopify.com/pages/adventures
My objective is to arrange the four square images next to each other horizontally, instead of having them stacked vertically. I would greatly appreciate any assistance with this!