Jump to content

Insert Dropdown Accordion in Product Description

Recommended Posts

  • 2 weeks later...
  • 1 month later...
  • 1 month later...
  • 4 weeks later...

Hi,

 

here are more detail of how I'm using it. @fucci ids starting with #yui... are dynamic and always change so you cannot use them as a reference. You need to use ids starting with #block.

for a start I have used the code from silvabokis using markdown for the accordion feature. I only use markdowns for accordion and I use a brine template.

You create the accordion in the Additional Info of your product. 

The code below insert the accordion after the product description, you can add the script in the footer in the code injection section. 

<script>
$(document).ready(function (){

var myBlock = $(".sqs-block-markdown").detach();

myBlock.appendTo(".ProductItem-details-excerpt");

})
</script>

Laurent

Link to comment
  • 3 weeks later...
On 6/23/2020 at 11:08 AM, BelBarStudio said:

Hi,

 

here are more detail of how I'm using it. @fucci ids starting with #yui... are dynamic and always change so you cannot use them as a reference. You need to use ids starting with #block.

for a start I have used the code from silvabokis using markdown for the accordion feature. I only use markdowns for accordion and I use a brine template.

You create the accordion in the Additional Info of your product. 

The code below insert the accordion after the product description, you can add the script in the footer in the code injection section. 

<script>
$(document).ready(function (){

var myBlock = $(".sqs-block-markdown").detach();

myBlock.appendTo(".ProductItem-details-excerpt");

})
</script>

Laurent

Hi @BelBarStudio. I'm trying to follow your instructions but when I go to SilvaBokis' site I don't see any mention of the accordion feature. Do you happen to have the markdown that I need to paste in my "additional information" portion of my product page? Thank you. 

Link to comment
  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.