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

CSS code not working on single page code injection


David_Ledger

Question

Site URL: https://mushroom-sapphire-grdc.squarespace.com/

(This code will allow a little outer glow around a specific image:)
 
If I put it in Design>Custom CSS, and it works, but I am trying to put page specific code on their respective pages to try to organize a bit better:
 
#block-yui_3_17_2_1_1596655451516_4134 {.image-overlay {box-shadow: 0px 0px 10px 4px (#fff);}}
 
How do I translate this code to a single blog page where I am either suppose to inject it into either the "Page Header Code Injection” area or the "Post Blog Item Code Injection
I thought it would be this but it is not working:
 
<style>
#block-yui_3_17_2_1_1596655451516_4134 {.image-overlay {box-shadow: 0px 0px 10px 4px (#fff);}}
</style>
 
Any thoughts?
 
Thanks in advance,
Link to post
  • Answers 8
  • Created
  • Last Reply

Top Posters For This Question

8 answers to this question

Recommended Posts

  • 0

That bloc id is for a specific image, Custom css applies it to all pages, so the one with the block will work, but if you post it in the header of any single page, it will not. This means you need to target the image block id put it in the code and apply the code to the page the image is on. You can id specific blocks with a free Chrome plug in:  https://chrome.google.com/webstore/detail/squarespace-id-finder Once you id the block just change it in your code insert in the header of the page you want. 

Edited by derricksrandomviews
Link to post
  • 0

Thanks Derrick,

That is the plug-in I used to id the block.  Like I said previously, it works when added to Design>Custom CSS, but I am not sure how to write it if I just wanted to add it to the Page Header Code Injection area of my blog page instead of the Design>Custom CSS area.

Edited by David_Ledger
Link to post
  • 0

I did that and it did not work.

 

I put this into the Into the Blog Page>Advanced>Page Header Code Injection:

<style>#block-yui_3_17_2_1_1596655451516_4134 {.image-overlay {box-shadow: 0px 0px 10px 4px (#fff);}}</style>

Edited by David_Ledger
Link to post
  • 0

I appreciate you reaching out.  I originally put everything in the Design>Custom CSS area.  I was hoping to tidy up the site by moving CSS that only effected single pages pages over to the Code Injection areas.  No worries, it still works in the Custom CSS area.  Thank you!

 

Link to post
  • 0

My code injection doesn't work on mobile devices on Product pages my client website. Stop working yesterday. I didn't have the problem before. Thank you for your help.
Please check this page. I can't rate the product and write review on iPhone, any mobile device. I test it both browsers Google and Safari on mobile and it doesn't work. 

I am using Facebook Comment Plugin code and Rating-Widget code in code injection and code blocks.

https://www.newdaywholehealth.com/essential-oils/eaters-digest

https://www.newdaywholehealth.com/essential-oils/brain-power

Edited by lstrauss831
Link to post
  • 0
On 12/5/2020 at 1:52 AM, lstrauss831 said:

My code injection doesn't work on mobile devices on Product pages my client website. Stop working yesterday. I didn't have the problem before. Thank you for your help.
Please check this page. I can't rate the product and write review on iPhone, any mobile device. I test it both browsers Google and Safari on mobile and it doesn't work. 

I am using Facebook Comment Plugin code and Rating-Widget code in code injection and code blocks.

https://www.newdaywholehealth.com/essential-oils/eaters-digest

https://www.newdaywholehealth.com/essential-oils/brain-power

Hi. Have you solved this yet?

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...