(Squarespace) Move Elfsight Widget Code Block under Product Gallery Images

#1. First, you need to add Elfsight widget code, use Code Block in Additional Info

#2. Next, use this code to Code Injection > Footer
If code doesn’t work, you can comment below, message or email me.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script>
  $(document).ready(function(){
    $('section.ProductItem-additional .code-block').appendTo('.ProductItem-gallery');
});
</script>
<style>
  .ProductItem-gallery {
    flex-wrap: wrap;
}
.ProductItem-gallery .code-block {
    flex: 100% !important;
}
.ProductItem-gallery-slides {
    width: calc(90% - 10px);
}
.ProductItem-gallery-scroll {
    width: 10% !important;
}
</style>

#3. Result

(before)

(after)

1 Like