RewardStyle - LTK + Showit

Using a RewardStyle widget with a Showit design

JT Pals avatar
Written by JT Pals
Updated over a week ago

⚠️ We cannot guarantee that any added pieces of code will work in every case inside of Showit.

RewardStyle LTK offers a great widget that you can embed directly into your Showit site that will allow you to showcase your products. They also offer a great WordPress embed option via [shortcode] or sidebar widget (might require their plugin).

Embedding Issues with Rewardstyle LTK


Depending on how you use LTK, if the widget causes page scrolling to stop functioning after you click on a photo in the widget, then you can add this Custom CSS to the page or blog template that's used. This will help format for better use with a Showit design. This solution won't work for every scenario.

/*RewardStyle Formatting*/

body {
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
}

.rs-ltk-widget-modal-on-body-overflow {
overflow: inherit !important;
position: inherit !important;
}

/*End RewardStyle Formatting*/

 

Still not working?

If you're still having trouble, we've found that sometimes the RewardStyle code itself needs additional code. You can add this code by going to the Embed Code settings and double-clicking on the code window.


Add the following code to the bottom of the current RewardStyle code, inside of the embed code widget.

<!-- showit fix -->
<script>
var waitForEl = function(selector, callback) {
  if (jQuery(selector).length) {
    callback();
  } else {
    setTimeout(function() {
      waitForEl(selector, callback);
    }, 100);
  }
};
waitForEl('..rs-ltk-widget__link', function() {
  $('..rs-ltk-widget__link').click(function(){
    $(this).closest('.si-embed').css('transform','none');
    $(this).closest('.se').css('transform','none');
  });
});
</script>
<!-- end showit fix -->

Did this answer your question?