Customizing homepage templates

What are homepage templates?

Homepage templates allow you to customize your homepage however you want. Admin level users can modify create a custom template and decide what elements display (or not), where elements display, add your own HTML, and more. These templates are really flexible - basically, you create your own HTML code based on Bootstrap and jQuery frameworks. Both Bootstrap and jQuery are already loaded with each page, so your template code must comply with the standard specifications for each framework.

You don't have to totally start from scratch, though - that's where the default templates come in. The basic formatting of the page is already set up for you. You can then move, remove, or add content as needed.

 CAUTION: Be careful when editing template code

Editing HTML is a core part of customizing custom templates. If you are not 100% comfortable with HTML, your best options are to either:

  1. Find someone at your library/institution 100% comfortable with HTML to help you, or
  2. Leave this area untouched and just use the default templates.

Creating and customizing homepage templates

  1. Go to Admin > Look & Feel.
  2. Under the Page Layout tab, choose Homepage from the dropdown.
  3. Under the Templates tab, click on the Customize Homepage Templates panel to expand it.
  4. Click the top dropdown to select a template to work off of (e.g., System Default - Homepage).
  5. In the Template Name field add a new name or modify the name for an existing template.
  6. Modify the template as needed in the Template Code box. Some basic things you can change in the template include:
    • Add / rearrange / comment out / remove whatever HTML you'd like.
    • Change the width of the columns by changing the col-md-n class, where n is a number between 1 and 12, and where the ns in that row add up to 12.
    • Add additional rows/columns to the template.
    • Add custom boxes to the page using the appropriate keyword/box ID.
  7. Adjust the Keyword Parameters:
    • content: content list: choose which list to display by default on the homepage.
    • content: guide / subject / group / type / owner columns: choose the number of columns to display that content when users select that area.
  8. Click Save as a NEW template or Save changes to this template

creating and customizing a homepage template

 If you get stuck or break a custom template

The default template will always be there. If you get stuck when editing a custom template, cannot remember the original order of content, break the HTML code/have unclosed tags that you cannot find, or something else you can always jump back to the default template.

And for any future changes we may make to the template code, you'll always have that version to compare your customized versions with. So you can add in any new placeholders / make whatever changes are necessary.

Or you can delete the custom template -- and the system will revert to using the default template if it was in use. As always, remember that we cannot recover deleted content, so delete with caution! 

Keywords used in the Homepage template

Keywords, delimited by 2 curly braces, are used to indicate where on the homepage content will be displayed. For example, the {{breadcrumbs}} keyword is used to display the breadcrumbs for the site. The keywords that can be used in a homepage template are:

Keyword Output
{{public_header}} Outputs the header from the system level or group level, as appropriate.
{{breadcrumbs}} Outputs the breadcrumbs in the format System Name > Group Name > Guide Name > Page Name.
{{title}}  Outputs the Welcome Message text.
{{system_intro}} Outputs the Introductory text.
{{button_all_guides}} Outputs the All Guides list button.
{{button_by_group}} Outputs the By Group list button.
{{button_by_subject}} Outputs the By Subject list button.
{{button_by_type}} Outputs the By Type list button.
{{button_by_owner}} Outputs the By Owner list button.
{{content}} Outputs the content of the guide lists area (that is displayed based on the list type selected).
{{search_guides}} Outputs the search box on the homepage.
{{guide_list_controls}} Outs the Display list: Alphabetically, By Popularity, or Most Recent option.
{{content_col_<id>}} Outputs the boxes belonging to the column designated.
Replace <id> with the appropriate identifier for the column. (e.g., {{content_col_1}}, {{content_col_2}}, etc.)
{{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.
{{content_boxes}} Outputs the profile box for the guide owner.
{{content_box_profile_<id>}} Outputs the profile box for a specific user.
Replace <id> with the appropriate User ID.
{{system_footer}} Outputs the "Powered by Springshare" footer.
{{public_footer}} Outputs the footer defined either at the system level or group level, as appropriate.


Note: some of the above keywords are not in the default homepage template (e.g. {{content_box_<id>}}), but can be added to the template to display additional content.


Related Articles