FAQ content

Look & Feel: Customize the profile landing page layout

In this article

A template is what provides the layout of a LibGuides page. Out of the box, LibGuides uses a default template for the profile landing page, which displays a directory of all available profiles in the system. If you need to modify this default layout to better fit the look and feel of your site, you can create your own custom template.

Before you get started with customizing a template, it's important to note a few key points.

  • Changing a template's layout requires modifying HTML code, so having some familiarity with HTML is important. If you're learning HTML for the first time, or just need to refresh your memory, the Mozilla Developer Network has some great tutorials and references.
  • Templates use the Bootstrap grid system to structure content in containers, rows, and columns. Not sure what this means? We recommend learning more in the Bootstrap documentation.
  • Code editors are your friends! Modifying templates within a code editor can make the process go more smoothly. Not only will you have an easier time organizing and editing your code, it also gives you an opportunity to save different versions of your code to your computer. All you need to do is copy and paste the code into LibGuides. There are some really great free and open source code editors, including:
  • Need help? If you run into any snags while customizing a template, contact the Springy Support Team -- we're always happy to lend a hand!

Creating a profile landing page template

Step 1. Select a template to customize

You can create a new template based upon any existing template, or you can select an existing custom template to modify it.

  1. Go to Admin > Look & Feel.
  2. Click on the Page Layout tab and select Profile.
  3. Click on the Landing Page tab.
  4. Click on the Customize Profile Page Templates panel to expand it.
  5. From the Select a template dropdown, choose the template you want to customize.

Selecting a template to customize

Step 2. Give your template a name

  1. In the Template Name field, enter a name for your template.
    • If you are editing an existing custom template, you do not need to change its name.

The Template Name field

Step 3. Modify the template code

The Template Code box contains the HTML code for your template. Throughout the code, you'll find template keywords enclosed in double curly braces (for example, {{content_box_search}}). Whereas the HTML code structures the page itself, those keywords are what insert the content into your pages. For example, where you place that {{content_box_search}} keyword is where your Search box will display.

  1. In the Template Code text box, modify the code for your template.
    • See the list of supported template keywords below to see which keywords are available to use. When adding or moving keywords, try to keep them within their parent HTML elements, as they often have element IDs and/or class names that help the keyword content display properly on the page.
    • The syntax of these parent elements is especially important. It can be especially helpful to use the system default template code as a reference, especially if you're updating an older template to use the latest keywords and element IDs/classes.
    • Pro tip: consider copying the template code into a code editor, such as Microsoft Visual Studio Code. This can make it easier to make your changes and keep your code organized. Once finished, just copy and paste the revised code back into the Template Code text box.

Template Code text box 

Supported template keywords
Keyword Output
{{skip_link}} Outputs the skip link, which users can click to navigate to the main content section of the page.
Important for optimizing page accessibility.
{{public_header}} Outputs the header from the system level.
{{breadcrumbs}} Outputs the breadcrumbs in the format Institution Reference > System Name > Page Name.
{{page_title}} Outputs the title of the page.
{{page_description}} Outputs the page description.
{{page_nav}} Does not currently output content.
{{navbar}} Outputs the navigation bar with the subjects dropdown.
{{content_box_search}} Outputs the Search box.
{{content_box_az}} Outputs the A-Z Database List box.
{{content_box_help}} Outputs the Help is Just a Click Away box.
{{content_box_guides}} When filtering the profile landing page by subject, this displays the list of guides assigned to that subject.
{{content_box_<id>}} Outputs the content box with whatever ID you define in the keyword.
Replace <id> with the appropriate box ID.
The box ID must already exist in a guide the system (e.g., a reusable content guide) for this to work.
{{system_footer}} Outputs the system footer, which includes the "Login to LibApps" and "Report a Problem" links.
{{public_footer}} Outputs the custom footer defined at the system level.

Step 4. Select template options

Below the template code, you'll find the following options:

  1. Make this template shareable in the community: select this checkbox if you would like to share your template with the LibGuides Community. (Please note: copying templates from the community is not yet available.)

Option to share the template in the community

Step 5. Save your template

  1. If you are making changes to an existing template, click on the Save changes to this template button.
  2. Click on the Save as a NEW template button to save your changes as a brand new custom template.

Save buttons

Managing customized templates

When editing a template, you can:

  1. Delete a custom template: if you no longer need the template, click on the Delete this template button.
    • This will permanently remove your template, so please make a copy of your template code if you want to save any of your work.
    • If that template was being used as the system default, we recommend selecting a different template to use before deleting it.

Delete this Template button

Applying a template to the profile landing page

To apply a template to your subject landing page:

  1. Go to Admin > Look & Feel.
  2. Click on the Page Layout tab and select Profile from the dropdown.
  3. Click on the Landing Page tab.
  4. In the Layout Options for Profile Page panel, select the template you want to apply.
  5. Click the Save button.

Selecting a template