Læsekompas Widgets

This is a collection of embeddable læsekompas widgets. At the moment two types of widgets are available.

A recommender widget which embeds a slider of recommendations and an inspiration widget that embeds a læsekompas inspiration page.

How to add recommender widget on DDB CMS

Add the following code to the page on which you wants to embed the recommender widget:

<script src="https://api.laesekompas.dk/ddbWidget.js"></script>
      <script>
        EmbeddableWidget.mount({
          type: 'recommender',
          parentElement: '#widget', // Dom Element in which the widget is mounted.
          pid: '870970-basis:51980247', // Pid of the book, the recommendations are based upon
          agency: '733000', // ID of Library whos collection recommendations are based upon.
          limit: 30, // Maximum number of books to show
          token: '5e03b34c9e105ce05751898141cd642eac7f894c' // Needs to be provided på DBC.
        });
      </script>

it is also possible to add a pid as an option, but as a default the widget will attempt to extract it from the current url.

How to add inspiration widget on DDB CMS

Add the following code to the page on which you wants to embed the recommender widget:

<script src="https://api.laesekompas.dk/ddbWidget.js"></script>
      <script>
        EmbeddableWidget.mount({
          type: 'inspiration',
          parentElement: '#widget', // Dom Element in which the widget is mounted.
          agency: '733000', // ID of Library whos collection inspirations are based on.
          token: '5e03b34c9e105ce05751898141cd642eac7f894c' // Needs to be provided på DBC.
        });
      </script>

The inspiration widget should be able to take om the full width of the page.

Bookmarklet

To test the widgets on a ddb cms you can add a bookmarklet to your browser, by adding a bookmark pointing to one of the following urls:

recommender:

javascript:(function(){var s= document.createElement('script'); s.setAttribute('src', 'https://api.laesekompas.dk/bookmarklet-recommender.js'); s.setAttribute('crossorigin', 'anonymous'); document.body.appendChild(s);})();

inspiration page:

javascript:(function(){var s= document.createElement('script'); s.setAttribute('src', 'https://api.laesekompas.dk/bookmarklet-inspiration.js'); s.setAttribute('crossorigin', 'anonymous'); document.body.appendChild(s);})();

Demo Links

You can find examples on embedded widgets here:

The widgets are also exposed through storybook: