API
  • Yumpu documentations
  • JS
    • Introduction
    • Quick setup
    • Magazine example's
    • Bookshelf example's
    • FAQs
  • API
    • Introduction
    • Getting started
      • API token
      • Document API
      • User API
      • Search API
      • Install SDK's
    • Limits
    • Flowchart of basic processes
    • Documents
      • Get
    • Document
      • Get
      • Post file
      • Post url
      • Put
      • Delete
    • Document hotspots
      • Get
    • Document hotspot
      • Get
      • Post
      • Put
      • Delete
    • Document progress
      • Get
    • Document categories
      • Get
    • Document languages
      • Get
    • Countries
      • Get
    • Collections
      • Get
    • Collection
      • Get
      • Post
      • Put
      • Delete
    • Section
      • Get
      • Post
      • Put
      • Delete
    • Section document
      • Post
      • Delete
    • Search
      • Get
    • User
      • Get
      • Post
      • Put
    • Embeds
      • Get
    • Embed
      • Get
      • Post
      • Put
      • Delete
    • Members
      • Get
    • Member
      • Get
      • Post
      • Put
      • Delete
    • Access tags
      • Get
    • Access tag
      • Get
      • Post
      • Put
      • Delete
    • Subscriptions
      • Get
    • Subscription
      • Get
      • Post
      • Put
      • Delete
Powered by GitBook
On this page
  • Quick Setup
  • Wait! What parameters are you using?

Was this helpful?

  1. JS

Quick setup

Quick Setup

  1. Include our script within your websites page:

    <script type="text/javascript" src="https://players.yumpu.com/hub.js"></script>
  2. Provide a container you want the frontend to be placed in, give it an "id" and set the dimension. E.g.

    <div id="magazineContainer" style="width:620px; height:400px;"></div>
  3. Create the Yumpu object in a script tag:

    var myYumpu = new Yumpu();
  4. Create a magazine with:

    myYumpu.create_player("#magazineContainer", "17403069");
  5. Create a bookshelf with:

    var collectionID = "MjG471mbwPubqNLR";
    myYumpu.create_bookshelf("magazineContainer", collectionID, "myYumpuUsername" );

Wait! What parameters are you using?

With magazines, the parameters are:

  1. The "id" property of the HTML container where you want the magazine to be placed in. You can use a 's "id" with a leading "#", or you can also use "body" to use the whole page.

  2. The magazines id, which you can easily get from the magazines page, e.g. http://www.yumpu.com/en/document/view/17403069/faceon-online-magazin-yumpu -> it's "17403069"

  3. (optional) Parameters: You can add quite a lot of custom parameters to change certain functionality, switch on/off elements, and so on. Pass them as an object, e.g. { fallback_order:"hornet,"html5","js", startpage:7, hideOuterShadows:"0", ... } You'll see more infos below.

With bookshelfs, the parameters are:

  1. The "id" property of the HTML container where you want the magazine to be placed in. You can use a 's "id" with a leading "#", or you can also use "body" to use the whole page.

  2. The collection id, which you get, not quite so easily yet - we have to admit, from the magazines edit page, where you create your collection. Click on EDIT at he right and choose View JSON. On top of the popup you'll get a link like http://www.yumpu.com/en/collections/json/pHTQHdSYJggwsIoN ... in that example, the collection id is "pHTQHdSYJggwsIoN "

  3. (optional) Parameters: You can add some additional parameters to customize your bookshelf. You'll see more infos below.

PreviousIntroductionNextMagazine example's

Last updated 5 years ago

Was this helpful?