Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How to add a code block class to all product pages


spongebob-smc

Question

Site URL: https://mouse-trout-epjy.squarespace.com/shop-all/p/thomas-wilson-cello-sonata-download

OK, this is the problem I have: 

I have 300+ products on this site and I would like to add an accordion dropdown showing delivery info to all product pages. I have this code already working on other pages using JS and a markdown block: 

 

<script>
$(document).ready(function(){
$('.markdown-block .sqs-block-content h3').css('cursor','pointer');
$(".markdown-block .sqs-block-content h3").nextUntil("h3").slideToggle();
$(".markdown-block .sqs-block-content h3").click(function() {$(this).nextUntil("h3").slideToggle();});
});
</script>

 

I know that I can do this via the additional info section on products but obviously would need to do that 300+ times which is a pain. So I'm trying to figure out if there's a way I can add a markdown/code block class to all product pages so that every product page will automatically have it. It also means that my client will not have to add the code block when they add products. 

Any ideas? Thanks in advance 🙂

 

 

site pw: spong123

Edited by spongebob-smc
Link to post
  • Answers 9
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Site URL: https://mouse-trout-epjy.squarespace.com/shop-all/p/thomas-wilson-cello-sonata-download OK, this is the problem I have:  I have 300+ products on this site and I would like to add an a

Add this code to Last Line in Code Injection Footer <script> $(document).ready(function() { $('div#page-section-5f4fa1503fcde16f12ffcd23>.row:first-child .span-12').insertAfter('.Pro

9 answers to this question

Recommended Posts

  • 0
12 hours ago, bangank36 said:

You can use javascript to load the content from external page and append it into product description, or place the markdown block in footer (hidden) and move it to content using javascript

Okay thanks, but the part I am unsure about is how to append it to all product descriptions? 

I am new to JS so not quite sure yet 🙂

Link to post
  • 0
On 3/30/2021 at 7:32 PM, spongebob-smc said:

@tuanphan any ideas? 

All products use same accordion dropdown or different?

If same, we can add it in Footer, then use script code to move it into Product

Link to post
  • 0
21 hours ago, tuanphan said:

All products use same accordion dropdown or different?

If same, we can add it in Footer, then use script code to move it into Product

Same dropdown yes. This is a good idea to add it to footer but I don't know how to move it to product?

Link to post
  • 0
On 4/1/2021 at 8:17 PM, spongebob-smc said:

Same dropdown yes. This is a good idea to add it to footer but I don't know how to move it to product?

Hi. You can add it to Footer first, then share link to a product, we will give the code to move its position.

Link to post
  • 0
11 hours ago, spongebob-smc said:

@tuanphan

Okay I have added it to footer. Here is a link to product:

https://mouse-trout-epjy.squarespace.com/shop-all/p/alasdair-nicolson-42nd-street-stomp-download

The markdown starts with 'shipping information' and I'd like to position it under product details and before related products. 

Thank you!

Add this code to Last Line in Code Injection Footer

<script>
  $(document).ready(function() { 
		$('div#page-section-5f4fa1503fcde16f12ffcd23>.row:first-child .span-12').insertAfter('.ProductItem .ProductItem-additional');
	});
</script>

and add this to Code Injection Header

<style>
  body:not(.collection-type-products.view-item) div#page-section-5f4fa1503fcde16f12ffcd23>.row:first-child .span-12 {
  	display: none;
  }
</style>

 

Link to post
  • 0
On 4/6/2021 at 10:34 PM, spongebob-smc said:

That worked PERFECTLY! Thank you so much! 

I see the site has some problems

Site URL: https://mouse-trout-epjy.squarespace.com/

1. (Mobile-Products) Align left shipping info – description?

mouse-trout-epjy.squarespace.com-mobile-

2. (Tablet-Footer) change logo position?

mouse-trout-epjy.squarespace.com-tablet-

3. (Tablet-Right white bar)

mouse-trout-epjy.squarespace.com-tablet-

4. (Tablet-About)

mouse-trout-epjy.squarespace.com-tablet-

 
Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...