tracydickason

Hi Tracy, Will you please share the website link?

hi @tuanphan
 
I want these markdowns to be accordion drop-downs in the additional information section. I have added the code into the code injection (see screenshot and below) following this guide - https://stnsvn.com/blog/how-to-add-an-accordion-to-squarespace and use markdowns for the sections. But its not working. I cant click on the + signs and they do not hide the text below. They are visible like in the screenshot all the time. 
 
Any idea how to resolve this? 
 
/*Accordion Page Settings*/ <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function(){ $('.markdown-block .sqs-block-content h2').css('cursor','pointer'); $(".markdown-block .sqs-block-content h2").nextUntil("h2").slideToggle(); $(".markdown-block .sqs-block-content h2").click(function() {$(this).nextUntil("h2").slideToggle();}); }); $(document).ready(function(){ $('.markdown-block .sqs-block-content h2').click(function() {$(this).toggleClass('plus-minus');}); }); </script>  
 

Hi, i review your website and it seems like you are using h3 for the accordion. simply replace the h2 to h3 into JavaScript code and it will works.

Legend! Thank you. 
 
Can you help spread out the accordions so they cover the full width of the line below? 
 
 

I think you already fix it. now accordions show into 4 columns 

Also, if I were to change the accordions to a paragraph font, what would I change the code to? 

I would like them to reach the end of the line below - ie. They span the full width
 
I imagine its something to do with padding that I can channge with custom CSS? 
 
@tuanphan

if you want to change the font size of the accordion heading. add below code
.markdown-block h4 {
font-size: calc(1 * 1rem) !important;
}