Knowledge Base

Knowledge base

Explore How-To's and learn best practices from our knowledge base.

Troubleshooting Review Widget (Advance)

Modified on: Fri, 28 Jun, 2019 at 11:46 PM


Troubleshooting Review Widget (Advance)


1. My Widget shows an ellipse or weird circle before loading more reviews.

ISSUE:

Loading Icon/Spinner looks deformed

CAUSE:

Our widgets elements sizes do their best to fit the container you choose to put them: but sometimes the characteristics of those containers can override things like, in this case, a good size for the loading icon ( the loading icon is trying to fit the container). So we need to apply a rule to give it a fixed size and avoid this behavior.

SOLUTION:

What do I need?

  • Access to the main CSS theme file.
  • CODING LEVEL: none, almost no level.

What do I do?

1) Access the main CSS file of your theme ( You don't know what file is that? Click here )

2) Go to the very bottom of the file and add.

.jdgm-rev-widg__paginate-spinner-wrapper .jdgm-spinner {  width: 40px !important; }

NOTE: If you need your icon bigger/smaller, just change 40px on the example for the desired size

3) Save the changes.

EXPECTED RESULT:


2. 404 error page when click on links (stars, pagination) in our widgets - Fix Motion Theme


Go to theme.js.liquid you should find this line:


$('a:not(.js-no-transition)').bind('click', function(evt) {


Please add .jdgm-paginate__page, .jdgm-star to the jQuerry selector like this:


$('a:not(.js-no-transition, .jdgm-paginate__page, .jdgm-star)').bind('click', function(evt) {


Sometimes you have to find the class of the error elements:

Ex: .jdgm-rev__body-read-more is the class for Read more button.


$('a:not(.js-no-transition, .jdgm-star, .jdgm-rev__body-read-more, .jdgm-paginate__page)').bind('click', function(evt) {

 



Did you find it helpful? Yes No

Can you please tell us how we can improve this article?

More articles in Review Widget

See all 11 articles