How To...
The templates provided are generic templates that can be easily edited and customized to fit your project. They are categorized by the purpose, which can be selected on the main page.
Once the type of template is selected, you will have the option to choose between a few different styles of that template. By clicking on the style of interest, you will be able to view that template applied on Scalar.
To apply a template to your own project, copy the code provided in the box at the bottom of that template page. Paste this code into the HTML tab of the EDIT screen for the page you want to display this template. (Refer to screenshots below)
If you would like a modified version of an existing template or a design not available in this book, contact Patrick or Andy regarding your design.
![]() Copy the template code located in the box at the bottom of each template page. |
![]() Paste the code into the HTML tab of the edit window of your project page. You MUST be in the HTML tab. |
![]() Replace the parts of the code as indicated with your own information/URL/content. |
![]() Once saved, the template should be applied. The shown template indicates the areas that were changed in the code in the previous screenshot. |
Customizing your Template
Certain areas of the template code must be changed in order to have a functionally working page. These areas are all displayed as "REPLACE WITH ____" statements in the code.
To clarify, most of these areas can be replaced with text such as titles, headers, and content. Some areas must be replaced with URLs, or web addresses. If you're unsure about how to upload or obtain a URL for an image, the following is one way to upload an image and obtain its URL through Scalar.
![]() Access the media import page via the menu on the left. Hovering over the "Menu" link will expose a menu where you can select Import > Local Media Files. |
![]() On the import page, insert a title for your image then click on the "Choose File" button to select your image from your computer. Click "Upload" once your file is selected. |
![]() Once uploaded, you will be taken to the page where your image is stored. To retrieve the URL for your image, right-click (two-finger click on Mac) on your image and select "Copy Image URL/Copy Image Location/Copy Image Address". Your image URL is now copied for you to paste into your code or wherever you need. |
To access your uploaded image pages after you've uploaded them, hover over the Menu on the left-side and select Index. From there, selected Media Files > Images, this will present a list of links to your uploaded images.
Preventing hover preview on links
Class="nopreview" to anchor tags will disable hover previews.







Discussion of "How To..."
Add your voice to this discussion.
Checking your signed in status ...