Skip to Main Content
It looks like you're using Internet Explorer 11 or older. This website works best with modern browsers such as the latest versions of Chrome, Firefox, Safari, and Edge. If you continue with this browser, you may see unexpected results.

University Library, University of Illinois at Urbana-Champaign

Scalar: An Introduction: Advanced Topics

This is a short introductory guide to using the Scalar publishing platform.

Have More Questions?

Have more questions? Contact Scholarly Communication and Publishing at for more information and guidance or visit our website. 


You will need to request a registration key from Scalar via the request form. If you are still having trouble, contact the Alliance for Networking Visual Culture at

The page layouts for Scalar automatically place the key image in the center of the page and at a fixed size, a placement which does not always focus on a meaningful portion of the image. Rather than upload a new, cropped version of the image and creating duplicate items, we can move and resize the existing image on the page using CSS in the page editor. The code that is used will be different for each page layout.

In each case, go to Edit Page and locate the Styling tab. Choose CSS.

Book Splash or Splash

The default code for the image in Scalar is controlled by the following:

.splash {

    background-size: cover;

    background-position: center center;


Edit the size and/or position by percentages or pixels.

Image Header

.image_header {

    background-size: cover;

    background-position: center center;


Edit the size and/or position by percentages or pixels.

Say you need an image to annotate another image. Or a timestamp in a video with a page. With Scalar’s flexible structure, you can do that too.

In the basic instructions for annotations, you start with the item you want to annotate. Now, Instead, you’ll go to the secondary item—the one you want added as an annotation to the first item. On the page edit screen, under the “Relationships” tab, select Choose the media that it annotates. You can manually enter the x, y coordinates for the image or the time-stamp for the video.


Widgets allow one to add maps, timelines, visualizations, click-through media galleries, and stylish summaries of related content to Scalar pages using the same formatting options as with media. One can add each of these interactive components anywhere on a page; above, below or within any paragraph. One can also choose to link a widget to text in the main body, that is, to reference a map or timeline the same way one would reference an image or video in Scalar.

When attempting to create a widget, check that all the necessary fields are satisfied. If the User’s Guide says a widget requires a thumbnail, check that the item has a thumbnail set under the “Styling” tab on the Page Editor. If a widget is not working as expected, it is likely because something has been left blank.


With Scalar, you can create interactive annotations for images and videos in addition to annotations for plain text.

Third Party Plugins and Platforms

If Scalar’s built-in widgets don’t quite suit your needs, Scalar allows for embedding on third party material into Scalar Pages. Check out these options for extending the interactivity of your Scalar book.

Text Annotation



Data Visualizations

Further Resources


Sometimes playing with CSS and JavaScript can have unintended consequences. If an experiment goes awry, restore content to a past version using the Book Dashboard.

Select the Version number listed next to an item to get to the Version Editor. Delete the corrupted versions of the item to restore access.

The Version Editor

When experimenting with custom code, it is good practice to use a sandbox account which is separate from the server. Students and faculty at the University of Illinois can contact to request access to the Library’s sandbox account.

Publishing Something? We can help!

The Illinois Open Publishing Network (IOPN) team can help you navigate the process of starting a journal or digital publication. We provide advising and resources related to digital publishing, open access and scholarly communications, and copyright.

We provide access to the local installation of Scalar and technical support for faculty seeking publication. Request a consultation to learn more.

For students working on class projects, contact or Dan Tracy at with questions.

Scholarly Communication and Publishing