How can I swap the product detail page description and additional info on the product detail page?

I am on squarespace 7.1

I am hiding the product title on the product detail page with the following code 

h1.ProductItem-details-title {
    display: none !important;
}

because the breadcrumb already contains the title so this was redundant. 

I want to swap the product detail page and the additional info sections (elements i am not sure of the terminology here) so the additional info section lines up with the top right of the picture while the description is below in linging up with the bottom left. 

I attempted to solve this with the following code 

<script>
/* place in store page header code injection  */
  jQuery(document).ready(function($) {
$('.ProductItem .ProductItem-additional').insertBefore('.ProductItem-details-excerpt');
});
</script>

which helped but but left me with the following alignment problems 

here is a link : https://dove-capybera-nn4w.squarespace.com/landscapes/p/sams-place-1
pw : Fr9Db9%wN0*qwO3_rCY

Thank you for your time! let me know if i need to clarify anything. 

10 hours ago, genfoch01 said:

I am on squarespace 7.1

I am hiding the product title on the product detail page with the following code 

h1.ProductItem-details-title {
    display: none !important;
}

because the breadcrumb already contains the title so this was redundant. 

I want to swap the product detail page and the additional info sections (elements i am not sure of the terminology here) so the additional info section lines up with the top right of the picture while the description is below in linging up with the bottom left. 

 

I attempted to solve this with the following code 

<script>
/* place in store page header code injection  */
  jQuery(document).ready(function($) {
$('.ProductItem .ProductItem-additional').insertBefore('.ProductItem-details-excerpt');
});
</script>

which helped but but left me with the following alignment problems 

here is a link : https://dove-capybera-nn4w.squarespace.com/landscapes/p/sams-place-1
pw : Fr9Db9%wN0*qwO3_rCY

Thank you for your time! let me know if i need to clarify anything. 

 

Insert this to Custom CSS

.collection-type-products.view-item .ProductItem-gallery {
  display: block;
}
.collection-type-products.view-item .ProductItem .ProductItem-details {
  padding-top: 0;
}
.collection-type-products.view-item .ProductItem .ProductItem-additional {
  margin-top: 0;
}
.collection-type-products.view-item .ProductItem-details .ProductItem-product-price {
  margin-bottom: 0;
}

and update your custom script

<script>
/* place in store page header code injection  */
  jQuery(document).ready(function($) {
	$('.ProductItem .ProductItem-additional').insertBefore('.ProductItem-details-excerpt');
    $('.ProductItem .ProductItem-details-excerpt').appendTo('.ProductItem-gallery');
});
</script>

That sir was dead solid perfect!  thank k you so much!

rsync -r /home/fridge/beer bangank36@squarespace:/home/fridge 

thanks again that was really helpful. 

@genfoch01 LOL! 😀