How do move product description and product variants on Brooklyn theme?

Solved
Tourist
26 0 1
Hi there, 
 
I had a few questions about Product Description and Variant placement on my Brooklyn theme. So on our current website, www.vipgolfawards.com, I have added quite a bit of custom code and other additions. That being said while using the Brooklyn theme, I noticed it is quite hard to move the product description under the product picture. Given we have a ton of variants for each product, having the description on the left side of the page will make it feel much less cluttered. 
 
Either that or having the ability to move the product variants to under the product picture on the left side (opposed to under the product title and price) will give our website a much cleaner feel. 
 
I have attached a link to our products (https://www.vipgolfawards.com/collections/best-sellers/products/hole-in-one-frame-black-1?nopreview) so you have an idea what I am talking about. I have also attached a link to what I was hoping the end result will look like from a competitor's website.
 
They have the option to make their product variants in a separate form where it says 'submit artwork now' (which we would prefer if possible) https://www.recognitionsource.com/collections/crystal-awards-at-a-glance
If your order is over $100.00, then you can take advantage of Flat Rate FedEx Ground Shipping. Please keep in mind that Ground shipping can take 3-5 business days to arrive after your order has been produced.
 
Thank you all for your time and I hope to hear back from you all very soon!
 
 
0 Likes

Hello 

You have to customize 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
Custom Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Digital Marketing | Site Speed Optimization | Web Development
0 Likes
Tourist
26 0 1

Thanks for the response, but what part of the liquid theme file do I change? I am not the most well versed in HTML and CSS so I can use all the help I can get!

0 Likes
Highlighted

Success.

Astronaut
938 112 212

Open your product-template section and Ctrl + F for product.description. You should see something like this:

 

locate_product_description.jpg

 

nevermind that my code will look different, I did a different tutorial for someone else a while ago. You want the highlighted section of code. Copy that and then Ctrl + F for "product-single__photos". Click on that opening div tag so it's orange. It'll look like this:

 

locate_product_single_photos.jpg

 

Scroll down to find the other end of that div tag, it will be highlighted orange too. Paste your description under there:

 

locate_product_single_photos_closing_div.jpg

 

Should be on the left side now.

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Tourist
26 0 1

H


@Ninthony wrote:

Open your product-template section and Ctrl + F for product.description. You should see something like this:

 

locate_product_description.jpg

 

nevermind that my code will look different, I did a different tutorial for someone else a while ago. You want the highlighted section of code. Copy that and then Ctrl + F for "product-single__photos". Click on that opening div tag so it's orange. It'll look like this:

 

locate_product_single_photos.jpg

 

Scroll down to find the other end of that div tag, it will be highlighted orange too. Paste your description under there:

 

locate_product_single_photos_closing_div.jpg

 

Should be on the left side now.


Hey Ninthony, thanks for the reply it ended up working great! The only thing is that the original description and specs are still on the right side, along with the new description placement on the left side under the product picture. Was curious how I get rid of the original so it is no longer on the right side. Thanks!

0 Likes
Astronaut
938 112 212

It may be that your product description is contained in another snippet somewhere, because I saw that you have some tabs for your product description. I couldn't tell you exactly without looking at your code. I can request access to your themes and take a look if you'd like.

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Tourist
26 0 1

Got it all figured out, thank you so much! I will definitely be contacting you for future help. I will PM you but would love to possibly put you on retainer if you do that kind of work. 

 

Best, 

Jake

0 Likes
Tourist
26 0 1

Hey Nithony,

 

Again thanks for adive for getting the product description on the left side of the product page.

 

That being said, yesterday I attempted to place an embedded video on one of our products in the description (will eventually have them on most products)

Though it is showing up in the back end for me, when you go to preview or view the live site, no description at all is showing up.

 

Figured you were the person to ask for a solution!

 

Hope to hear from you soon, and thanks in advance.

 

- Jake

0 Likes
Astronaut
938 112 212

Hmm, I really couldnt tell you unless I could see your page. Your preview is expired so now I need a password to get in. Could you let me know what product? I can request access to your theme and products to take a look. Sorry for the late reply, I was out on Friday and I don't typically check the forums over the weekend.

If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Tourist
26 0 1

Thanks for the response!

 

If it isn't too much hassle for you, that would be great. I just gave you access to the site. 

 

Also, the 'Large golf tangent award' is the first one I tried putting the video on, and this is when the problems started to happen. Once going to preview, nothing comes up.

 

Thank you again Ninthony, you are a life saver

 

 

0 Likes