Align the "Additional Info" text with the "Product Description" text on a product page

Hello!

I'm trying to align the "Additional Info" text with the "Product Description" text on a product page: https://www.freshkamp.com/shop-drinkware/p/traveler

Ideally I'd like the order to be the product description, then the all the variant options and add-to-cart button and then the additional info underneath, but have the text be lined up with the product description text. 

If possible, I'd also like to move the start of the text for both (product description and additional info) to be more right. Making a little more space for the image, and moving the text to the right. If anyone can help with this, it would be greatly appreciated!

On 3/22/2023 at 3:14 AM, NickFresh said:

Hello!

I'm trying to align the "Additional Info" text with the "Product Description" text on a product page: https://www.freshkamp.com/shop-drinkware/p/traveler

Ideally I'd like the order to be the product description, then the all the variant options and add-to-cart button and then the additional info underneath, but have the text be lined up with the product description text. 

If possible, I'd also like to move the start of the text for both (product description and additional info) to be more right. Making a little more space for the image, and moving the text to the right. If anyone can help with this, it would be greatly appreciated!

Hi, 

Move this?

Yes please! I'd like to align that bottom text under the 'add to cart button'.

If possible, would also like to be able to move that entire alignment (description, add to cart button, and additional description) to be aligned more right, giving more space for the image.

Thanks in advance! You've helped me a ton on other posts that I've read and had the same question. 

On 4/3/2023 at 2:09 AM, NickFresh said:

Yes please! I'd like to align that bottom text under the 'add to cart button'.

If possible, would also like to be able to move that entire alignment (description, add to cart button, and additional description) to be aligned more right, giving more space for the image.

 

Thanks in advance! You've helped me a ton on other posts that I've read and had the same question. 

 

Add to Settings > Advanced > Code Injection > Footer

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
jQuery(document).ready(function($){
  $('section.ProductItem-additional').insertAfter('.ProductItem-details .sqs-add-to-cart-button-wrapper');
})
</script>

Thanks so much!

Hi tuanphan,
I did use the code above in the code injection and it worked out really well (see screenshot 2).
But... now my client changed the plan from trial to personal, and the 'code injection' isn't working anymore. 😞
Is there a way to get this same result (the additional text to the right) with the 'custom CSS' function instead of the 'code injectio'?
Thank you in advance!

On 3/6/2024 at 7:28 PM, Jorinde said:

Hi tuanphan,
I did use the code above in the code injection and it worked out really well (see screenshot 2).
But... now my client changed the plan from trial to personal, and the 'code injection' isn't working anymore. 😞
Is there a way to get this same result (the additional text to the right) with the 'custom CSS' function instead of the 'code injectio'?
Thank you in advance!

Edit your site Footer > Add a Block > Choose Markdown > Paste the code.

In case you can't make it work, let me know, I will give another approach

On 3/9/2024 at 8:57 AM, tuanphan said:

Edit your site Footer > Add a Block > Choose Markdown > Paste the code.

In case you can't make it work, let me know, I will give another approach

Thank you a lot - it worked this way! 😄
So in general: can I mostly use codes for the Code injector field, in the mark down-field instead?
Or is that just working in this particularly case?

On 3/11/2024 at 8:56 PM, Jorinde said:

Thank you a lot - it worked this way! 😄
So in general: can I mostly use codes for the Code injector field, in the mark down-field instead?
Or is that just working in this particularly case?

Almost any script code can be inserted via Markdown. However, there is some code that will need a bit trick to run in Markdown. 😆