Accordion - Add Javascript Shopify code

Support
#1

I have a Shopify button I would like to add to one of my accordion areas - is this possible? I’ve tried to add it in the code section but no love.

#2

Hello @lyrical,

Thanks for asking. :slight_smile:

The Javascript code you have got from Shopify, please use plugin like Insert Headers and Footers and add the JS code in the header section. After that use the DIV element code in the accordion item to show the Shopify button.

Here’s the resource to get started with Insert Headers and Footers:

Thanks.

#3

thank you - that works in other sections, but just not in the accordion. I’ve entered the following (without the spaces)
< div id=‘product-component-9412fea1711’>

#4

Hi @lyrical,

May I know which page that has this accordion and code? It should be a complete code

<div id="product-component-9412fea1711"></div>

Thanks!

#5
#6

Hello @lyrical,

Thanks for updating the thread and sharing the code.

Please add the JS code and the HTML code in accordion items. Here’s a screencast that you can take a look. I have used the code from Shopify website as a sample. Please make sure you copy the code correctly. For example, HTML code should have a closing tag. Here’s a screencast.

Screencast for Raw Content element:

Screencast to add on Accordion element:

Thanks.

#7

ok - I have created a new accordion (the other I had was the classic accordion) and placed the script as indicated. Now I’m getting 2 buy now buttons at the bottom left of the page and a lot of white space in the accordion.

https://courageouswordsmith.com_emphasized text_

#8

Hello @lyrical,

Thanks for updating the thread.

Can you please confirm the URL again? The URL you have shared is not in proper format. I tried few permutations but it’s not working. Please confirm the URL.

Thanks.

#9
#10

and just so you can see another page - this one has the code and everything is as it should be show
https://courageouswordsmith.com/gallery/book-release/

#11

Hi,

You can try adding a hight to your div.

eg.


<div style="height:500px;overflow:scroll;" id='product-component-9412fea1711'>

Hope that helps

#12

sadly, not. Thank you, though. It’s just the accordion that I’m having the problem with.

#13

Hi There,

It looks good on my end:

Could you please share us with your screenshots?

Many thanks.

#14

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.