How do I add videos to an accordion menu on the personal plan?

Looking to add a video, that I can replace later, into the first dropdown of my accordion menu. Any advice is appreciated. 

First, add a Markdown Block under Accordion Block > Paste this code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(() => {
const list = $('.accordion-block p:contains("mp4")');
    for (let i=0; i<list.length; i++) {
        const link = $(list[i]).text()
        $(`<video src="${link}" loop autoplay>${link}</video>`).insertAfter(list[i])
    }
for (let i=0; i<list.length; i++) {
        $(list[i]).remove()
    }
})
</script>

Next, edit First accordion >> Paste video URL (mp4)

Result

For some reason this isn't working for me. I have added the markdown block underneath the accordion block. 

Perhaps it is because I have updated to the next level higher than the personal plan (the business plan?)

Here is the website: https://www.benscott.actor/

password: abc

Also, do I have to host the .mp4 file at a specific URL, or can it be on Vimeo? Please let me know! Thanks

On 12/31/2023 at 1:56 AM, graphicultra said:

For some reason this isn't working for me. I have added the markdown block underneath the accordion block. 

Perhaps it is because I have updated to the next level higher than the personal plan (the business plan?)

Here is the website: https://www.benscott.actor/

password: abc

Also, do I have to host the .mp4 file at a specific URL, or can it be on Vimeo? Please let me know! Thanks

You need to host mp4 somewhere (you can upload to Squarespace) to get video direct url

With Vimeo, you need to use paid plan to get direct video url

Awesome! It is working. Is there any way for the user to pause, or have any playback controls for the video? It seems to just be looping from the second the accordion tab is opened. 

Change this line

src="${link}" loop autoplay

to this

src="${link}" loop autoplay controls

Hi Tuan -- Can you help me understand what you mean by, "First, add a Markdown Block under Accordion Block " ?

I hope to place an embedded video into my accordion, but was unable to figure out where to put that code you offered.

Ty!

On 10/2/2024 at 1:05 PM, Sissily said:

Hi Tuan -- Can you help me understand what you mean by, "First, add a Markdown Block under Accordion Block " ?

I hope to place an embedded video into my accordion, but was unable to figure out where to put that code you offered.

 

Ty!

Use Markdown if you have Personal Plan, but if you use Business Plan/higher, no need to add it.

Also, I wrote this new guide, you can follow it