Product page full width for Debutify

Solved
Highlighted
Tourist
8 0 2

I'm using Debutify as my theme, but I find the product page description are all lining on the right side which is shown as below.

Screen Shot 2020-03-06 at 6.20.06 PM.png

 

I tried to add this code at the bottom of  Theme -> edit code -> asset -> theme.scss.liquid

.product-single__description.rte {	clear: both;
}

but it doesn't work for my site.

 

I just wanna have a full width description underneath the images, can anyone help.

0 Likes
Highlighted

Hello @tgspack,

1. Go to Online Store->Theme->Edit code
2. Sections->product-template.liquid

2020-03-06_16-05.jpg

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
8 0 2

product-template.liquid doesn't have content as you have shown :(


0 Likes
Highlighted

@tgspack,

Can you please share your product-template.liquid file

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
8 0 2
{% comment %}
  The contents of the product.liquid template can be found in /snippets/product-template.liquid
{% endcomment %}
<div id="section-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product-template" data-enable-history-state="true" data-scroll-to-image="{% if section.settings.image_layout == "stacked" %}true{% else %}false{% endif %}">
  {% include 'product-template' %}
</div>
 
{% unless product.empty == empty %}
  <script type="application/json" id="ProductJson-{{ section.id }}">
    {{ product | json }}
  </script>
{% endunless %}
 
{% schema %}
  {
    "name": "Product pages",
"class": "product-section",
    "settings": [
  {
        "type": "header",
        "content": "Product photos"
      },
  {
        "type": "select",
        "id": "image_layout",
        "label": "Image display",
        "default": "stacked",
        "options": [
  {
            "value": "stacked",
            "label": "Stacked"
          },
    {
            "value": "thumbnail",
            "label": "Thumbnail"
          }
        ]
      },
  {
        "type": "select",
        "id": "product_photo_alignement",
        "label": "Image alignement",
        "default": "left",
        "options": [
          {
            "value": "left",
            "label": "Left"
          },
          {
            "value": "right",
            "label": "Right"
          }
        ]
      },
      {
        "type": "checkbox",
        "id": "enable_zoom",
        "label": "Enable image zoom",
"default": true
      },
  {
        "type": "header",
        "content": "Product details"
      },
  {
        "type": "checkbox",
        "id": "product_vendor",
        "label": "Show vendor",
        "default": false
      },
  {
        "type": "checkbox",
        "id": "product_title_size",
        "label": "Big product tite",
        "default": false
      },
      {
        "type": "select",
        "id": "product_header_alignement",
        "label": "Alignement",
        "default": "",
        "options": [
          {
            "value": "",
            "label": "Left"
          },
          {
            "value": "text-center",
            "label": "Center"
          }
        ]
      },
      {
        "type": "select",
        "id": "product_selector",
        "label": "Variant picker type",
        "options": [
          {
            "value": "radio",
            "label": "Button"
          },
          {
            "value": "select",
            "label": "Dropdown"
          }
        ]
      },
  {
        "type": "checkbox",
        "id": "quantity_enabled",
        "label": "Show quantity picker"
      },
  {
        "type": "checkbox",
        "id": "button_cart_icon",
        "label": "Show button icon",
        "default": true
      },
  {
        "type": "checkbox",
        "id": "enable_payment_button",
        "label": "Show dynamic checkout button",
        "info": "Lets customers check out directly using a familiar payment method. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "default": false
      },
      {
        "type": "checkbox",
        "id": "show_description",
        "label": "Show description",
        "default": true
      },
  {
        "type": "checkbox",
        "id": "social_sharing_products",
        "label": "Enable product sharing",
        "default": true
      },
  {
        "type": "checkbox",
        "id": "show_product_tags",
        "label": "Show product tags",
        "default": true
      }
    ]
  }
{% endschema %}
0 Likes
Highlighted

It would be great if you can share your store URL

CRO Expert at PageFly - Advanced Shopify Page Builder.
- Use the Christmas template to skyrocket your sales.
- PageFly Page Builder: Website | Facebook | LinkedIn | Group | Youtube.
- [Tutorial] Get more tips on using PageFly to soar sales this season
0 Likes
Highlighted
Tourist
8 0 2

https://www.tgs-pack.com/

 

This is my store URL

0 Likes
Highlighted

This is an accepted solution.

Change the content of your snippets/product-template.liquid file with this https://pastebin.com/raw/WGcg3er2

CRO Expert at PageFly - Advanced Shopify Page Builder.
- Use the Christmas template to skyrocket your sales.
- PageFly Page Builder: Website | Facebook | LinkedIn | Group | Youtube.
- [Tutorial] Get more tips on using PageFly to soar sales this season
Highlighted
Tourist
8 0 2

Oh My Goodness, this helps sooooo much.

I've been looking for an answer for hoursssss.

Very appreciate for your help !


@RichardNguyen wrote:

Change the content of your snippets/product-template.liquid file with this https://pastebin.com/raw/WGcg3er2


 

Highlighted
Tourist
6 0 0

Hello! It, seems you have a decent amount of code knowledge Richard Nguyen, I am also using the Debutify theme and was trying to add Custom Form Fields to a new Product Template but just like the friend here the Product. template.liquid located in the Sections ara seems to have different coding. Where should I add the UI Elements I generated for the Custom Text Fields? I tried contacting Support but they had no idea how to do it.  My store URL is www.auricjewellers.com

Here are the UI elements I wish to add ( one for "Name, one for "Date of Birth"):

<p class="line-item-property__field">
<label for="name">Name</label>
<input required class="required" id="name" type="text" name="properties[Name]">
</p>

<p class="line-item-property__field">
<label for="date-of-birth">Date of Birth</label>
<input required class="required" id="date-of-birth" type="text" name="properties[Date of Birth]">
</p>

I wanted to add them just above the Add to Cart Button in that same order but have failed to find where to add it or if there is some extra step i am missing.

This is the guide I was following:
https://community.shopify.com/c/Shopify-Design/Product-pages-Get-customization-information-for-produ...

It would be incredible if you could help me with this, I would really appreciate it. So far no one seems to be able or want to help with this.


0 Likes