Customize an FAQ group's public pages using the default simple settings

When you create a new FAQ group, your pages will be ready to go right out of the box. That's because the default customization options automatically apply a user-friendly layout to each page of your group. This not only makes it easy to get your group up and running, but it also greatly simplifies the customization process. Instead of having to build each page from scratch, you can control the layout and content of your pages with just a few straightforward options. 

To get started:

  1. Go to Admin > FAQ Groups.
  2. For the group you want to customize, click on its edit () icon in the Actions column.
  3. On the Manage FAQ Groups page, click on the Pages tab.
    • If the Use advanced customization options checkbox is not selected, this means your group is using the default, simple customization options. The sections in the rest of this article will apply to these options.
    • If you'd like to get more hands-on with customizing the layout and content of your pages, consider enabling the advanced customization options instead. These options will allow you to customize each page of your group individually, from the number of columns on each page to the content in each box. See the Links & Files section of this article for more info on these options.

Caution: enabling the advanced customization options will remove all customizations and content from your group pages. In other words, each page will start as a blank slate. (Don't worry, though: you can always switch back to the default customization options at any time.)

The Use Advanced Customizations Options checkbox when disabled


Header & search box

When using the default customization options, each page will have a customizable header that appears below your group's banner or custom HTML header. This includes things such as the breadcrumbs, page title, search box, and browse options.

The header options allow you to customize the position of these elements on each page, as well as the background and text colors of the page header area. 

The Header box, containing the Header Layout, colors, and Customize Search Box options

1. Header Layout

The header layout allows you to set the position of the page title, search box, and browse options. There are three options to choose from -- just select the one you prefer and click the Save button.

2. Header Colors

You can customize the colors of the header, including the background color, text color, and link colors.

  1. Use the color pickers to select your desired colors; or, enter a color's hex code (e.g. #cccccc) into the color picker fields and press Enter.
    • To revert to the default colors, simply delete the entered hex code and press Enter.
  2. Click the Save button. 

Example of selecting header colors

3. Customizing the search box

The page header contains a search box that allows users to search your group's FAQs. This search box has several options which you can customize. Here's how:

  1. Click on the Customize Search Box button.
  2. For the Group Content To Search option, choose whether your want the box to limit results to just the current group, or show results for all public groups.
    • Please note: this cannot be customized for the default FAQ group.
    • The default group will always return all published FAQs the user has access to view.
  3. Customize the text of the Form Label (this is only visible to screenreaders).
  4. Customize the Placeholder Text, which is what displays in the field before a user enters their search terms.
  5. Customize the Button Text.
  6. Save your changes.

Screenshot of the search box customization options

[Return to Top]


Contact Us box & LibChat widget

Depending upon your Group Home Page settings, your pages can contain a "Contact Us" box that you can use to list various ways patrons can get in touch with you. This can include things such as your queue's email address, SMS number, or question form link. However, you can also add links to your social media accounts, your physical address, and more.

The Contact Us Box options

1. Title/Head

To customize the title of the box, enter your custom text in the Title/Head field and click the Save button.

Example of customize the title of the "Contact Us" box

2. Optional Intro Text

If you'd like, you can add text that displays at the top of the box, above your contact info. Use the Optional Intro Text field's rich text editor to add your text, then click the Save Intro Text button.

Example of customizing the intro text of the "Contact Us" box

3. Contact Links

This is where you can customize the actual contact methods that display in the "Contact Us" box. By default, the contact information for your system's default queue will be provided.

  1. To modify an existing contact link:
    1. Click on its Edit () icon to make changes.
    2. Click on the Delete () icon to remove it from the list.
  2. To add a new contact link, click on the Add Contact Item button.
  3. Use the Type of Contact dropdown to select the appropriate type of link for this contact item:
    • Generic Link: select this option to add a link to a specific URL (such as a staff directory, for example).
    • Email: select this option for adding mailto: links.
    • SMS: select this option to create an sms: link to an SMS number (this allows mobile users to send you a text message without having to manually enter your number).
    • Telephone: select this option to create a tel: link to a phone number (this allows mobile users to call you without having to manually enter your number).
    • Twitter: select this option to create a link to your Twitter page.
    • LibChat Widget: select this to include a LibChat button widget in your list of contact links.
      • When using this option, the LibChat Widget dropdown will appear, allowing you to select the widget you'd like to use.
    • Question Form Link: select this to include a link to the question form for one of your queues.
      • When using this option, the Queue dropdown will appear, allowing you to select which queue's question form to use.
  4. Select an Icon to display next to this link. Simply click on one of the default icons to apply it, or upload/link to an image instead.
  5. Enter the appropriate number or URL for the link in the Contact Info field (does not apply to the LibChat Widget and Question Form Link options):
    • Generic Links: enter the full URL of the link, including the http:// or https://
    • Email: enter an email address (the mailto: will be added automatically)
    • SMS and Telephone: enter the phone number without hyphens, periods, etc. (the sms: or tel: will be added automatically)
    • Twitter: enter your twitter handle, including the @ symbol (LibAnswers will use that to create the link to your Twitter page)
  6. If you would like to customize the text of the link, enter it in the Link Text field (does not apply to the LibChat Widget option). Otherwise, the text in the Contact Info field will be displayed.
  7. You can also add a More Info description for this contact link. When you use this option, an information icon () will appear next to the contact link, which will open a pop-up dialog when clicked.
  8. Save your changes.

Screenshot of contact link options

4. LibChat Widget

As an alternative to including a button widget in your list of contact links, you can include an in-page widget below your links. Here's how:

  1. Select the widget you'd like to display from the LibChat Widget dropdown.
    • Select the "Don't show a widget" option if you do not want to display an in-page widget.
  2. Save your changes.

Example of selecting an in-page LibChat Widget 

[Return to Top]


Submit Your Question box & question form

Depending upon your Group Home Page settings, you can embed a question form directly on your group's homepage. The Submit Your Question Box options allow you to choose which queue's question form to use.

The Submit Your Question Box options

1. Title/Head

This option allows you to customize the title of the question form box. Enter your text in the Title/Head field and click the Save button.

Example of customizing the title of the Submit Your Question box

2. Queue Form to Show

This allows you to select which queue's question form to display. Use the Queue Form to Show dropdown to select the form, then click the Save button.

Example of selecting the question form to show

[Return to Top]


Group Home Page & featured FAQs

These options allow you to customize the layout of your group's home page. To preview your group's home page, click on the View Page () icon at the top of the box.

The Group Home Page options

1. "Contact Us" location

Use this dropdown menu to select where you want to show the "Contact Us" box on your homepage, then click the Save button.

Example of customizing the "Contact Us" location

2. Display Submit Your Question Form in right column of the page?

Use this option to show or hide the "Submit Your Question" box on the homepage. Choose "Yes" to show the box or "No" to hide it, then click the Save button.

Example of customizing the question form display option

3. Featured FAQ list

The group homepage contains a tabbed box, with one tab showing your popular FAQs (based on total views) and the other showing your recently updated FAQs. However, you can add an optional third tab to display handpicked "featured" FAQs.

Example of adding featured FAQs

If you have specific FAQs you'd like to feature on your homepage, enter their ID numbers (separated by commas with no spaces) in the Featured FAQ List field and click the Save button.

  • To find an FAQ's ID, go to Answers > FAQ Entries.
  • If no IDs are entered, then this tab will not display on the homepage.

[Return to Top]


Search Page & Results (Traditional, Tabbed, & Bento)

These options allow you to customize the layout of your group's search results page. To preview your group's search results page, click on the View Page () icon at the top of the box.

There are three primary options you can choose from:

  • Traditional: this optional will only display search results from your LibAnswers system.
  • Tabbed style: this option has the ability to display results from your LibAnswers system, in addition to your other LibApps search sources. Results for each source will appear as a tab on the search results page.
  • "Bento box" style: this option also has the ability to display results from your LibAnswers system, in addition to your other LibApps search sources. Results for each source will appear in its own box, with the boxes positioned in different columns on the search results page.

To get started, select your preferred layout from the Search Results Layout field and click the Save button. Each option has its own settings which you can use to further customize the page. See the following sections for more information on each.

The Search Page & Results options

Traditional layout

The traditional layout has two columns: the first column is the largest and contains your search results, while the second column contains the facets you can use to filter your search results. You can customize this page as follows:

"Contact Us" location

If you'd like, you can also display your "Contact Us" box on the search results page.

  1. Choose your preferred location from the "Contact Us" Location dropdown and click the Save button.
Display Submit Your Question Form in right column of the page?

You can also choose to display the "Submit Your Question" box on the search results page, as well.

  1. Select "Yes" to display the box or "No" to hide it, then click the Save button.

Example of options for the traditional search results layout

Tabbed layout

Like the traditional layout, the tabbed layout also has two columns. The big difference is that the tabbed layout allows you to switch between tabs of results, each tab displaying results from a different LibApps search source (which must be set up by a LibApps admin before you can add them to the page). You can customize the page as follows:

Displayed Sources

To choose which search sources to display:

  1. Drag and drop them from the Available Sources box into the Displayed Sources box.
  2. Click the Save Displayed Sources button. The tabs will appear in the order in which they are arranged in the Displayed Sources box.
"Contact Us" location

If you'd like, you can also display your "Contact Us" box on the search results page.

  1. Choose your preferred location from the "Contact Us" Location dropdown and click the Save button.
Display Submit Your Question Form in right column of the page?

You can also choose to display the "Submit Your Question" box on the search results page, as well.

  1. Select "Yes" to display the box or "No" to hide it, then click the Save button.

Example of customizing the tabbed search results page

"Bento Boxes" layout

With the bento layout, the search results will be divided into multiple columns. Each column can contain multiple LibApps search sources (which must be set up by a LibApps admin before you can add them to the page), with the results from each displaying in its own box in that column. You can customize the page as follows:

Displayed sources

To choose which search sources to display:

  1. Drag and drop them from the Available Boxes list into the column where you want it to appear.
  2. Click the Save Bento Sources Layout button. The tabs will appear in the order in which they are arranged in each column.
"Contact Us" location

If you'd like, you can also display your "Contact Us" box on the search results page.

  1. Choose your preferred location from the "Contact Us" Location dropdown and click the Save button.
    • Unique to the bento layout, if you choose "Right Column", you will be able to drag and drop the "Contact Us" box into any of the three columns on the page. It will display in the order in which its placed in that column.
    • If you choose a side-tab location, "Contact Us" will still appear as an available box. If you do not want the box to display in addition to your side-tab, then leave it parked in the Available Boxes list.

Example of configuring the bento box layout

[Return to Top]


Individual FAQ Item (Question/Answer) Page

These options allow you to customize the layout of your group's FAQ pages. To preview your group's FAQ page, click on the View Page () icon at the top of the box.

The Individual FAQ Item Page options

1. "Contact Us" location

Use this dropdown menu to select where you want to show the "Contact Us" box on your FAQ pages, then click the Save button.

Example of customizing the "Contact Us" location

2. Display Submit Your Question Form in right column of the page?

Use this option to show or hide the "Submit Your Question" box on each FAQ page. Choose "Yes" to show the box or "No" to hide it, then click the Save button.

Example of customizing the question form display option

[Return to Top]

Related Articles