Why is my FAQ script not loading on product pages?

Technical Q&A
1

Hello Shopify Community,

I took over the upgrading of a customized theme to Shopify 2.0. The previous developers added a FAQ section on 2 product pages, using custom templates. I have copied everything over and have the product pages in place, except I have trouble getting the FAQ script to load.

I have tried everything. On the backup theme that they developed, I can see the script load, but can’t find anywhere on how they are getting it to load.

On mine, I see nothing.

I have tried this on theme.liquid and directly on the product template: {{ ‘product.js’ | asset_url | script_tag }}

I have tried this on theme.liquid and directly on the product template: , and still nothing.

Here is a link to the product page: https://azestfor.com/products/vitamins-for-homemade-dog-food

And the script:

$(function(){
$(document).on(‘click assess’, ‘.tab-lists a’, function(evt) {
// active class
$(this).addClass(‘tab–active’).closest(‘ul’).find(‘.tab–active’).not(this).removeClass(‘tab–active’);
// hide inactive content
$(this).closest(‘li’).siblings().find(‘a’).each(function() {
$($(this).attr(‘href’)).removeClass(‘tab-content–active’);
});
// show active content
$($(this).attr(‘href’)).addClass(‘tab-content–active’);
evt.preventDefault();
});

//faq accordion
$(‘.card button’).on(‘click’, function(e){
e.preventDefault();
var card = $(this).closest(‘.card’);
$(‘.card-content’).slideUp(‘fast’);
if(card.find(‘.card-content’).hasClass(‘expanded’)){
card.find(‘.card-content’).slideUp(‘fast’);
card.find(‘.card-content’).removeClass(‘expanded’);
}else{
card.find(‘.card-content’).addClass(‘expanded’);
card.find(‘.card-content’).slideDown(‘fast’);
}
});

Any help would be greatly appreciated!

Thanks in advance,

Todd

2

Hi All,

I was able to get this to work, I found a solution from another Shopify Community question doing a detailed search.

But now, I need some JQuery help as the when the FAQ answer slides down, it slides back up again before you can read it.

And help would be greatly appreciated.

Thanks in advance again,

Todd

3

Hi @Roxee541 ,

I checked and it works fine, did you solve the 2nd problem?

4

Hi LitExtension.

Yes, it seems that the JQuery was not loading properly for some reason, so I just removed the file from the assets folder and added in this to the theme.liquid section:

And solved it just like that! I found this solution from another Shopify Community thread, so that helped much.

Thanks for jumping in though.

i should mark this as a solution. :grin:

5

como e aonde eu coloco esse script?