Jump to content

issue with markdown HTML

Recommended Posts

Site URL: http://rachelthor.com/

Hi there, I've been following the squarespace forum for adding code that allows me to create drop-down menus where only the heading is visible until you click it, then it toggles open to a longer explanation (often used for FAQs). This successfully worked for me on the last page I created on my site. This time around however, I'm trying to use the same code and it's weirding out on me. Working the first time I load a preview and then staying forever open after that, or continuously bouncing between open and closed. I am wondering if I have the code doubled somewhere and it's confusing itself, or what suggestions you have for clearing house and starting over to get this working across my whole site? 

Link to comment
  • Replies 17
  • Views 1.4k
  • Created
  • Last Reply

Top Posters In This Topic

the most recent one I've tried is:

<script>
var arrState=[];

(function() {
 var arrAnswerBlocks=document.getElementsByClassName('answer');

 for (var i=0;i<arrAnswerBlocks.length;i++) {
   var element = arrAnswerBlocks;
   var state = {id:(element.id), collapsed:true}; 
   arrState.push(state); 
 }

})();

function expand(id) {
 var state={};
 var answerBlock=document.getElementById(id);

 for (var n=0;n<arrState.length;n++) {
   state=arrState[n];

   if (state.id==id) {
     if (state.collapsed) {
       answerBlock.style.display="block";
       state.collapsed=false; }
     else {
       answerBlock.style.display="none";
       state.collapsed=true;
     } //end if
   }//end if

 }// end for
}
</script>

Link to comment
22 hours ago, rachelthor11 said:

I tried your new code, it's great. there's only one issue. Right now, any h4 header i click, it will open that one plus any headers underneath it (instead of just that one header). can you update your code to take care of that? thank you!

Hi, Can you share link to the page on your site? I will check.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

I very much appreciate your work on this. However after updating this in the "code injection" of my home page advanced settings,  it still has a glitch.

It will open every toggle underneath the heading I am clicking on, not just that heading. Is that possible to adjust in the code so it only opens the current heading I am clicking on?

Link to comment
3 hours ago, rachelthor11 said:

I very much appreciate your work on this. However after updating this in the "code injection" of my home page advanced settings,  it still has a glitch.

It will open every toggle underneath the heading I am clicking on, not just that heading. Is that possible to adjust in the code so it only opens the current heading I am clicking on?

Hi,

Did you read this?

You need to wrap all the content of each accordion in the blockquote to make the code work properly.

See blockquote syntax: https://support.squarespace.com/hc/en-us/articles/206543587

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 weeks later...

Hi there. I don't know what that means. Can you explain? Currently I've tried these things so far:

1. inject the code into the home page advanced code injection site. (result: every text block below and including clicked text block opens.)

2. Inject the code into the home page and each page with an accordion. (result: no text blocks will open when clicked.)

3. inject the code into the home page, as well as at the top of each individual markdown box. (result: same as #1).

4. only put code into markdown boxes, no code-injections. (result: same as #1.)

(www.rachelthor.com/portals)

Are one of these what you mean by your answer? Can you elucidate? Thank you for your continued support! I am looking forward to having this solved!

Warmly,

Rachel

Link to comment
  • 3 weeks later...
On 4/27/2020 at 10:04 AM, TDavy said:

Hi @tuanphan this saved my day. Thank you it worked very well. 

I changed the background colour and line.

I have tried so many different codes for this, yours worked. See attached with the accordian closed and open.

Thanks.

 

 

(y)

Let me know if you have any other questions.

Also, with accordion, you can use an Accordion Block. SS released it a few months ago.

Edited by tuanphan
update old answer with Accordion Block

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 year later...
4 hours ago, hostyle01 said:

Hi, I am struggling to get this to work on my site too, if I can have some help that would be awesome.

The site is https://magnolia-mandolin-k3fs.squarespace.com/ I have been working on the first two speakers on the Contributors page.

p/w: TJC2022

Thank you!

SS has Accordion Block. You can use it instead of using markdown with code.

https://support.squarespace.com/hc/en-us/articles/4411581892749-Accordion-blocks

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

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.