Product Reviews - Using JS to Change CSS After Loaded

Highlighted
New Member
1 0 0

Hello, thanks for reading and trying to help out!

Situation:

I am using Javascript to alter some of the CSS on the product reviews (Shopify Product Reviews). I am currently doing that via a setTimeout function after 1.5 seconds.

Problem

The reviews are loading first, and then my dynamic CSS is loading, causing a sudden change in style.

Question:

Does anybody know when exactly the app is loading these reviews? I would love to add my styles immediately afterwards. I tried adding my styles via an onload method for the .spr-reviews div, but that didn't work.

Thanks!

 

Bryan

0 Likes
Highlighted
Explorer
100 2 15

Hi @Bryan93 ,

A couple of things you could try:

- Turn the ‘setTimeout’ to an ‘onload’ event instead and see if that still works and improves the behaviour

- There's text-editor boxes in the app's settings that are using HTML and Liquid. I wonder if you could sneak some Javascript in there with <script> tags, or even additional HTML tags within there to dictate the style e.g. 

<div style="font-size:20px;"> An authors name is {{ review.author }} </div>

Screenshot 2020-07-15 at 13.52.49.png

All a bit hacky, but I can't see any assets from the app in the theme folder, so it might have to be.

Cheers,

Oli

——————————

Founder @ www.preproduct.io

Test and make sales for future products

 

 

 

 

 

 

0 Likes