Knowledge Base/3.0 Enhance your reader and publication/3.1 Enhance your reader (FOLDER)

3.1.4 Custom Embed - Show custom content to the left of your issue

Yoav Schwartz
posted this on August 24, 2009 10:48 am

Click Here for Video Tutorial

A custom embed widget will show to the left of your publication's pages and will display no matter what page the end user is viewing.

The example below shows a twitter feed custom embed widget.

Flipbook_-_Widget_Area.jpg

A widget is a piece of web code that operates like a small, self contained webpage.  This can include HTML, Javascript, CSS and other web programming languages.  The custom embed widget allows you to add a widget to the left of your digital reader that will remain visible to users no matter what page of your digital edition they are viewing.

This widget allows you to include virtually anything to the left of your digital reader. We kept this feature as flexible as possible so YOU can decide how your digital reader will look. The most common uses are:

  • Advertisements. Include your Google AdSense code, or any other advertisement.
  • Twitter feeds. Do you have a twitter account? If so, login to your account at twitter and grab the Twitter Widget embed code at: twitter.com/widgets/html_widget
  • Images and Links. If you have text and/or links that you want to share with your readers simply copy&paste it in!
  • Get creative! There are many tools only that offer widgets of all kinds. Here are a couple to check out: widgetbox.com, springwidgets.com

To add a widget to the left of your digital reader first go to the manage titles/issues screen, choose a title and click Edit title on the right hand side:

Manage Titles and Issues.png

Click on Widgets>Custom Embed then:

Click "activate the custom embed widget" and do the following (refer to screenshot below)

  1. Your Embed Code 
    • Enter/Paste your widget code in the "Your Embed Code" text box.
    • include text, html, css, javascript
    • you can include multiple objects but note that if your widget content's height is taller than the end user's browser display, a scroll bar will display to access the full widget content
  2. Widget Helper Codes
  3. Specify widget area width
    • Define, in pixels, the width of your widget area.
    • The widget area does take some of the flipbook's display so make sure you only use the width your widget content requires
    • Make sure to set the width of your widget window to the same width as your embedded widget content (e.g. if you're placing a 120x600 skyscraper ad, set your widget width to 120)
  4. Update your Title to save the changes OR Click GO BACK to cancel the changes and navigate back to your title view screen

NOTE: The custom embed left side widget is not supported on mobile devices

Edit Title - Widgets - Custom Embed Screenshot

Edit_Title_-_Custom_Embed.png

Video Tutorial


 

Comments

User photo
Burinha

Can the embedded widget be placed in publication?

May 23, 2010 01:44 am