Skip to main content

Introduction

The Calaméo Skin Markup Language (CSML) allows you to completely change the look and feel of all the viewer features using Calaméo Skin Styles (CSS). For example, you can modify the appearance of external links, customize the related publications pop-up and use your own cursor icon.

Make sure to check the "Common attributes" for the features you wish to change.

How to add a Calaméo Skin Stylesheet to your publication​

There are currently 2 ways to add Calaméo Skin Styles (CSS) to your publications:

  • via an URL parameter
  • via a skin

Using an URL parameter​

You can specify a styleurl parameter in the HTML embed code that links to your Calaméo Skin Stylesheet (using an absolute URL).

Example:
<iframe src="//v.calameo.com/?bkcode=0000000018a530f2597ee&styleurl=https://mydomain.com/calameo/styles.txt"></iframe>

Using a Calaméo skin​

To include a Calaméo Skin Stylesheet in your Calaméo Skin, simply use the tag styles.

You can either place your styles in a CDATA inside the content of the tag like this:

<styles>
    common.text.color=0xFF0000
    common.text.size=14
</styles>

Or use an external Calaméo Skin Stylesheet specified in a source attribute like this:

<styles source="https://mydomain.com/calameo/styles.txt"></styles>

You can also combine both techniques like this:

<styles source="https://mydomain.com/calameo/styles.txt">
    common.text.color=0xFF0000
    common.text.size=14
</styles>