Customize Text tool

Throughout your knowledge base, there are certain text strings that KnowledgeOwl generates. Previously, we had set these as static text fields and you needed to add custom scripts to override that text.

With the Customize Text tool, we're converting those text strings so that you can customize them directly yourself--no coding required!

We've marked this feature as in Beta because we're still building out all of the sections, but here's what we have so far:

• Search
• Table of Contents/Breadcrumbs
• Reader Login
• Top Navigation
• Article
• Miscellaneous
• Required Reading
• Article Lists
• Contact Form

Use the Knowledge Base Section selector at the top of the page to move between these sections.

For each section, we provide a list of the Default Text Strings and a more detailed Description of where/how that text string is used. If you've set your own customized text string, it is displayed in the Your Text String column.

To add a new customized text string or edit an existing customized text string:

1. Review the available Knowledge Base Sections and select the section your text string belongs to. (This may require some trial and error!)
2. Find the string you'd like to update.
3. Click the gear cog icon to the right of it in the Actions column:
   
4. This will open the Edit Text String pop-up, where you can enter or edit the text string.
5. Once you've added the text you'd like used in Your Text String, click the Update Text String button to save your change.
   

These changes will immediately be live in your knowledge base, though if you were already viewing your knowledge base you may need to refresh to see them!

Some tips on adding text strings:

• You cannot enter a blank/empty text string or a text string that is all spaces.
• In most places, you can insert an emoji and it will work properly!
• Raw HTML entered here will not render as HTML, but will instead display as an encoded text string.

Resetting a customized text string will remove whatever text you have entered for the string and switch your knowledge base back to using the Default Text String.

To reset a customized text string:

1. Go to Tools > Customized Text.
2. Find the customized text string you'd like to remove.
3. In the Actions column, click the trashcan icon to the right of that text string.
   
4. This will open a pop-up which will ask you to confirm that you really want to remove your customized text string.
5. Click OK to complete the text string reset.
   
6. Your text string will be removed and your knowledge base will immediately start using the Default Text String again.

Here's a full list of the Default Text Strings available in the Search Knowledge Base Section, with accompanying screenshots to show how they're used:

Global Search screenshots

The global search bar can appear many places, including:

• The homepage
• The top navigation
• The table of contents
• The right column

Here are a few examples of where it's used:

Global search bar on the homepage

Global search bar on the homepage, with typeahead search

Global search bar in the top navigation & table of contents

Global search bar in the top navigation, with typeahead search

Global search bar in the top navigation, on-hover text

Search Results Page screenshots

The Search Results Page will look a bit different depending on whether you the option to Filter search by categories enabled or not. These screenshots show the page with that option enabled, but if you aren't using it, the Refine by Category section and its elements won't be visible.

Search Results Page with Relevance sort selected

Search Results Page with new Refine by Category options selected and Relevance search result elements highlighted

Search Results Page with Popularity sort selected

Search Results Page with Last Updated sort selected

Search Results Page with Newest sort selected

Search Results Page with matching glossary snippet

Search Results Page with "Glossary" searched and no article results found

Message displayed during search reindex

Here's a full list of the Default Text Strings available in the Table of Contents Knowledge Base Section, with accompanying screenshots to show how they're used:

Breadcrumbs screenshot

If Breadcrumbs are enabled, all content will display a breadcrumb beginning with the "Home" text, which you can customize:

Table of Contents screenshot

The Table of Contents options highlighted here are all set in Settings > Basic in the Website Settings section:

Here's a full list of the Default Text Strings available in the Top Navigation Knowledge Base Section, with accompanying screenshots to show how they're used:

Top Navigation visible screenshots

These Top Navigation elements are hyperlinks visible to all readers if the feature is enabled:

Top Navigation text-only screenshot

These Top Navigation text options are generally only used by screen-readers or if there are problems displaying logos or icons. Unless one of these situations happens, you can really only see them by looking at the underlying HTML:

Reader Login text customizations are only necessary if the Reader Login page is being used in your knowledge base. The Reader Login page will be shown if you have Enabled reader logins and:

• Default Access is set to public + someone clicks the Login link
• Default Access is set to Restrict by reader logins and someone navigates to any article or the homepage without being logged in

Here's a full list of the Default Text Strings available in the Customize Text Reader Login Knowledge Base Section, with accompanying screenshots to show how they're used:

Reader login screenshot

The Reader Login page will be shown if you have Enabled reader logins and:

• Default Access is set to public + someone clicks the Login link
• Default Access is set to Restrict by reader logins and someone navigates to any article or the homepage without being logged in

The reader login page

Reset password screenshot

The Reset Password pop-up will open once someone clicks the Reset Password link on the main Reader Login page.

The Reset Password popup

Reader signup screenshot

The Reader signup text and link will only be displayed in the main Reader Login page if you have enabled Reader signups. If you aren't using Reader signups, you can ignore these text strings.

If you have enabled any custom fields in the reader signup form, the text for those can be edited in your profile icon/name > Readers > Settings in the Reader Signup Custom Fields section.

The Reader Signup pop-up

Here's a full list of the Default Text Strings available in the Article Knowledge Base Section, with accompanying screenshots to show how they're used:

Full Article screenshot

Here are where most of the text string sections appear within a full article:

Full Article Screenshot

#2 is only relevant if you are using Related Articles.

#3 is only relevant if Ratings have been enabled and the Thumbs Up / Thumbs Down rating type is used.

#4 is only relevant if Comments are enabled.

Article Header screenshot

The Download PDF text string is only visible when someone hovers over the PDF icon in the header (and if the PDF icon is displayed in the article):

Article Rating screenshots

The screenshots below only apply if Ratings have been enabled.

The Helpful and Unhelpful text strings are displayed when the Thumbs Up / Thumbs Down rating type is used and someone hovers over the icons:

Hovering over the thumbs up icon

Hovering over the thumbs down icon

When the 5 Star rating type is used, a different text string displays above the stars:

The text displayed when 5 Star rating type is used

With either Article Rating type, once someone submits a rating, the ratings section is replaced by the feedback message:

The rating section is replaced with a feedback message once a rating is submitted

Article Comments screenshots

The screenshots in this section only apply if Comments are enabled.

Once someone clicks in the comments placeholder, the Change User Icon link and Submit button appear. Hovering over the Submit button will display the Submit comment text string.

The comments section as it appears once someone clicks into the comments text box.

Once someone submits a comment, the comments section is replaced with feedback text:

The feedback message replaces the comments section once a comment is submitted

Article Version PDF screenshot

The text strings below are currently only used in article version PDFs. Many of these text strings will be empty for versions created, activated, or deactivated prior to 11 October 2023. The layout of these PDFs may look different if you've edited Settings > Style > Custom HTML > Article Version.

Here's a full list of the Default Text Strings available in the Miscellaneous Knowledge Base Section, with accompanying screenshots to show how they're used:

Glossary screenshot

The Glossary page title is the header displayed at the top of the /glossary page in your knowledge base:

If you customize this text string and you have the Add the glossary page to your search results option enabled in Settings > Search, the Glossary page will be returned as a result when someone searches:

• The word "glossary"
• The custom text string you have entered

Be sure to adjust Table of Contents and Search options for Glossary references to get a total re-naming in place!

Here's a full list of the Default Text Strings available in the Required Reading Knowledge Base Section, with accompanying screenshots to show how they're used:

Homepage screenshots

If you add the Required Reading article list to your homepage (or another page), these text fields are the ones we'll display:

Required Reading article list with articles

Required Reading article list without articles

Required Reading screenshots

The Required Reading page can be accessed:

• by navigating to /{root}/required-reading
• by clicking the "See more..." link in the Required Reading article list

Sample Required Reading page with several articles

Sample Required Reading page with no articles

Article screenshots

The screenshots below only apply when:

• Required Reading has been enabled
• Merge codes for the flag and acknowledgement are in the Article Custom HTML template
• Someone is viewing an article marked as "Required".

The exact placement of these sections depends on where you've put them:

Flag and acknowledgement text displayed when a required article has not been acknowledged as read

Flag and acknowledgement text displayed when a required article has been acknowledged as read

Here's a full list of the Default Text Strings available in the Article Lists Knowledge Base Section, with accompanying screenshots to show how they're used:

Homepage Default Article Lists screenshots

By default, new knowledge bases are created with the Popular Articles, New Articles, and Updated Articles sections on the homepage:

Homepage Default Article Lists, populated

Homepage Default Article Lists, empty

Optional Article Lists screenshot

The Favorite Articles and Recent Articles lists aren't included in your knowledge base by default, but you can choose where to add them. Both lists require individual reader logins to work.

Here's an example of what they'd look like added to your homepage, with the corresponding text strings numbered:

Optional Article Lists, empty

Popular Articles screenshot

Once you click the "See more..." link in the Popular Articles list (or navigate to /{root}/popular-articles in your knowledge base), you're presented with the full Popular Articles page:

Popular Articles page

Updated Articles screenshot

Once you click the "See more..." link in the Updated Articles list (or navigate to /{root}/updated-articles in your knowledge base), you're presented with the full Updated Articles page:

Updated Articles page

New Articles screenshot

Once you click the "See more..." link in the New Articles list (or navigate to /{root}/new-articles in your knowledge base), you're presented with the full New Articles page:

Use text strings to cu

Article List Pagination screenshot

The full page for the Popular, Updated, or New Articles pages displays pagination controls at the bottom if there are more than 10 articles on the page. The text strings here allow you to customize the text associated with those controls.

Update the text strings here to customize the pagination control text labels

Contact Form text customizations are only necessary if the Contact Form is being used.

The Contact Form basically has three main pages:

• The initial search page: this page prompts the viewer to search for something
• A search results page: their initial question or phrase is searched and we return potentially useful articles. They select whether the article there answered their question. If they say it did answer their question, they're kicked to a confirmed self-serve success page and finish the form. If they say it did not answer their question, they move to the full form.
• The full contact form: Once someone has navigated through the first two pages and confirmed that none of the suggested resources answered their question, they're presented with the full contact form. Submitting this form will trigger an email (or whatever method of contact form submission you've selected!) and will then present a confirmed submission page.

Here's a full list of the Default Text Strings available in the Customize Text Contact Form Knowledge Base Section, with accompanying screenshots to show how they're used:

Initial search screenshot

The Initial search page is displayed when someone first opens the Contact Form, and contains a streamlined set of fields:

The initial search page of the Contact Form

Once the reader clicks the "Next" button, a search is performed and they're taken to the search results page.

Search results page screenshot

Once a reader clicks Next on the initial search page, we'll perform a search for relevant articles. The reader will be taken to an intermediate Search results page to see if we can encourage them to self-serve with a relevant resource.

They use the two buttons at the bottom to either confirm that their question has been answered (Yes! That Helped!) or to confirm that their question hasn't been answered and they need to go to the full contact form (No, submit my request.):

The search results page

Confirmed self-serve screenshot

If the reader selects "Yes! That Helped!" from the search results, they'll exit the contact form and be taken to a confirmation page. This will log their search as a self-serve in Contact form reporting.

Confirmed self-serve page

Full contact form screenshots

If the reader clicks the "No, submit my request" button on the search results page, they'll be taken to the full contact form. Once they fill out the details here and select "Submit", the contact form submission will be delivered to you through whatever method you've selected in your configuration.

The full contact form

If the contact form has been set up to use multiple email addresses, that field will display between the full contact form header and the Subject:

The full contact form, with multiple email addresses

Submission confirmation page screenshot

Once a reader selects the "Submit" button from the full contact form, they're presented with a submission confirmation page:

The submission confirmation page

In some cases, when you edit a text string in the Customize Text tool, you'll see a warning that says you need to update your knowledge base theme and/or your homepage:

Sample theme or homepage warning message

The warning appears because we used to hard-code these text strings into the Custom HTML templates used in Settings > Style (and top-level Homepage), before the Customize Text merge codes existed. It will take a little bit of sleuthing to update the text accordingly. If you're unsure what to update, contact us and one of our support owls will happily help you!

This warning message can be displayed for these knowledge base sections' text strings:

• Article: Last Modified on
• Article: Related Articles
• Top Navigation: Toggle navigation
• Top Navigation: Table of Contents
• Article Lists: Popular articles list heading
• Article Lists: Updated articles list heading
• Article Lists: New articles list heading
• Article Lists: Recent articles list heading
• Article Lists: Favorite articles list heading

Here's an overview of what you'll need to do if you see this warning:

1. Select the knowledge base theme link or navigate to Settings > Style.
2. Open the appropriate Custom HTML template (Article or Top Navigation).
3. Find the previously hard-coded text and replace it with a new merge code.
4. Save your changes.

We have more detailed instructions for each scenario below!

Article: Last Modified on

If you try to edit the default text string for Last Modified on in the Article section and receive the warning:

1. Select the knowledge base theme link in the warning or navigate to Settings > Style.
2. In the Customize HTML, CSS, and JS section, select Custom HTML.
3. Select Article from the Select HTML section to edit dropdown.
4. Identify the text that needs to be replaced. The Last modified on statement is usually near the top, in the <div class="metadata"> section, which begins on row 4. Here, we see it in row 4:

   <div class="hg-article">
       <div class="hg-article-header">
           <h1 class="hg-article-title">[article("title")][article("action_icons")]</h1>
           <div class="metadata">Last Modified on [article("date_modified")] by [author("name")]</div>
       </div>
       <div class="hg-article-body">
           [article("body")]

5. Put your cursor at the start of the text you'd like to replace.
6. Copy the merge code below and paste it in there:

   [translation("article:last-modified-on-label")]
   

7. Delete the original "Last modified on" text.
8. Your code should now look something like this:

   <div class="hg-article">
       <div class="hg-article-header">
           <h1 class="hg-article-title">[article("title")][article("action_icons")]</h1>
           <div class="metadata">[translation("article:last-modified-on-label")] [article("date_modified")] by [author("name")]</div>
       </div>
       <div class="hg-article-body">
           [article("body")]

9. You can Preview your changes (be sure you select Article from the preview dropdown to see the correct page!).
10. Be sure to Save your changes when you're done.

Article: Related Articles

If you try to edit the default text string for Related Articles in the Article section and receive the warning:

1. Select the knowledge base theme link in the warning or navigate to Settings > Style.
2. Below the preview pane, be sure Custom HTML is selected.
3. Select Article from the Custom HTML dropdown.
4. Identify the text that needs to be replaced. The Related Articles heading usually appears near the bottom, in the <div class="hg-article-footer"> within an h3. Here, we see it in row 6:

       <div class="hg-article-body">
           [article("body")]
       </div>
       <div class="hg-article-footer">
           <div class="ko-related-articles text-center">
               <h3>Related Articles</h3>
               [template("related")]

5. Put your cursor at the start of the text you'd like to replace.
6. Copy the merge code below and paste it in there:

   [translation("article:related-articles-heading")]

7. Now delete the original heading. Your Custom HTML should now look something like this:

    <div class="hg-article-body">
        [article("body")]
    </div>
    <div class="hg-article-footer">
        <div class="ko-related-articles text-center">
            <h3>[translation("article:related-articles-heading")]</h3>
            [template("related")]

8. You can Preview your changes (be sure you select Article from the preview dropdown to see the correct page!).
9. Be sure to Save your changes when you're done.

Top Navigation: Toggle navigation

If you try to edit the text string for Toggle navigation in the Top Navigation section and receive the warning:

1. Select the knowledge base theme link in the warning or navigate to Settings > Style.
2. Below the preview pane, be sure Custom HTML is selected.
3. Select Top Navigation from the Custom HTML dropdown.
4. Identify the text that needs to be replaced. The Toggle navigation text is usually about halfway down the pane below a slideout-right-toggle template. Here, it's in row 3:

       [template("slideout-right-toggle")]
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
           <span class="sr-only">Toggle navigation</span>
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
           <span class="icon-bar"></span>
       </button>

5. Put your cursor before the "T" in "Toggle navigation".
6. Copy the merge code below and paste it in.

   [translation("top-navigation:toggle-navigation")]

7. Delete the original "Toggle navigation" text. Your Custom HTML should now look something like this:

    [template("slideout-right-toggle")]
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">[translation("top-navigation:toggle-navigation")]</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>

8. Be sure to Save your changes when you're done.

Top Navigation: Table of contents

If you try to edit the text string for Table of  in the Top Navigation section and receive the warning:

1. Select the knowledge base theme link in the warning or navigate to Settings > Style.
2. Below the preview pane, be sure Custom HTML is selected.
3. Select Top Navigation from the Custom HTML dropdown.
4. Identify the text that needs to be replaced. The Table of Contents text actually involves TWO sections of text you'll need to replace. Both are fairly close to the top of the Top Navigation, under the button with target=".documentation-categories":
   <span class="sr-only">Table of Contents</span> and <span class="browse">Table of Contents</span>. Here, they're in rows 6-7:

       <h1 class="hg-project-name">[template("project-name")]</h1>
       <div class="nav-left-searchbar hidden-xs">
           [template("searchbar")]
       </div>
       <button type="button" class="navbar-toggle toc-toggle pull-left clear-left" data-toggle="collapse" data-target=".documentation-categories">
           <span class="sr-only">Table of Contents</span>
           <span class="browse">Table of Contents</span>

5. Put your cursor before the "T" in the "Table of Contents" text.
6. Copy the merge code below and paste it in:

   [translation("top-navigation:table-of-contents")]

7. Delete the "Table of contents" text.
8. Repeat steps 5-7 for the second Table of Contents text span.
9. Your Custom HTML should now look something like this:

    <h1 class="hg-project-name">[template("project-name")]</h1>
    <div class="nav-left-searchbar hidden-xs">
        [template("searchbar")]
    </div>
    <button type="button" class="navbar-toggle toc-toggle pull-left clear-left" data-toggle="collapse" data-target=".documentation-categories">
        <span class="sr-only">[translation("top-navigation:table-of-contents")]</span>
        <span class="browse">[translation("top-navigation:table-of-contents")]</span>

10. Be sure to Save your changes when you're done.

Article Lists: Any list heading

If you try to edit the default text string for any of the article list headings (New, Popular, Updated, Recent, Favorites) and receive the warning:

1. Select the knowledge base theme link in the warning or navigate to Settings > Style.
2. Below the preview pane, be sure Custom HTML is selected.
3. Select Homepage from the Custom HTML dropdown.
4. Identify the text that needs to be replaced. The Popular Articles, New Articles, and Updated Articles headings usually appear near the bottom, in the div class="homepage-widgets row" within an h3, in rows 10-12 below:

   <div class="ko-homepage-top">	
       <h1 class="hg-article-title xcolor">[homepage("title")]</h1>
       [template("large-search")]
   </div>	
   <div class="hg-article">
       <div class="hg-article-body">
           <div>[template("icon-cats,max=8,col=4,desc=0")]</div>
           <div>[homepage("body")]</div>
           <div class="homepage-widgets row">
               <div class="col-md-4 col-sm-6"><h3>Popular Articles</h3>[template("pop-articles")]</div>
               <div class="col-md-4 col-sm-6"><h3>New Articles</h3>[template("new-articles")]</div>
               <div class="col-md-4 col-sm-6"><h3>Updated Articles</h3>[template("up-articles")]</div>
           </div>
       </div>
   </div>

   Recent Articles and Favorites Articles lists need to be added manually, so you may need to look around a bit for them!
5. Put your cursor at the start of the text you'd like to replace.
6. Copy the appropriate merge code below and paste it in:
   1. Popular articles list heading:

      [translation("article-lists:popular-articles")]

   2. New articles list heading:

      [translation("article-lists:new-articles")]

   3. Updated articles list heading:

      [translation("article-lists:updated-articles")]

   4. Recent articles list heading:

      [translation("article-lists:recent-articles")]

   5. Favorite articles list heading:

      [translation("article-lists:favorite-articles")]

7. Delete the original text. Here's a sample of what Custom HTML might look like if we replaced all three of the article lists with the merge codes:

   <div class="ko-homepage-top"> 	
       <h1 class="hg-article-title xcolor">[homepage("title")]</h1>
       [template("large-search")]
   </div>	
   <div class="hg-article">
       <div class="hg-article-body">
           <div>[template("icon-cats,max=8,col=4,desc=0")]</div>
           <div>[homepage("body")]</div>
           <div class="homepage-widgets row">
               <div class="col-md-4 col-sm-6"><h3>[translation("article-lists:popular-articles")]</h3>[template("pop-articles")]</div>
               <div class="col-md-4 col-sm-6"><h3>[translation("article-lists:new-articles")]</h3>[template("new-articles")]</div>
               <div class="col-md-4 col-sm-6"><h3>[translation("article-lists:updated-articles")]</h3>[template("up-articles")]</div>
           </div>
       </div>
   </div>

8. You can Preview your changes.
9. Be sure to Save your changes when you're done.

In some cases, when you edit a text string in the Customize Text tool, you'll see a warning that says you need to update your knowledge base theme:

Sample warning message displayed when you edit a text string

The warning appears because we used to hard-code these text strings into either the top-level Homepage content editor (for knowledge bases created before October 2022) or the Custom HTML templates used in Settings > Style before the Customize Text merge codes existed.

It will take a little bit of sleuthing to update the text accordingly. If you're unsure what to update, contact us and one of our support owls will happily help you!

This warning message can be displayed for these knowledge base sections' text strings:

• Article Lists: Popular articles list heading
• Article Lists: Updated articles list heading
• Article Lists: New articles list heading
• Article Lists: Recent articles list heading
• Article Lists: Favorite articles list heading

Here's an overview of what you'll need to do if you see this warning:

1. Figure out where the article lists are stored. Select the homepage link to navigate to Homepage and check for the lists there first. (Knowledge bases created before October 2022 often have this setup.) If you see the article list you want to edit here, keep using these instructions!
   1. If you don't see the lists there, they're likely in Settings > Style. Follow the instructions in Update Style Settings with Customize Text merge code instead.
2. Find the previously hard-coded text and replace it with a new merge code.
3. Save your changes.

Since the steps are fairly similar for all three article lists, we'll walk through how to update one list as an example:

Article Lists in Homepage

If you try to edit the default text string for the New, Popular, Updated, Recent, or Favorites Articles list headings and receive the warning:

1. Select the homepage link in the warning or navigate to Homepage.
2. In the Homepage content pane, look for the list title you want to update. Here, we'll update the Popular Articles list.
   
3. Highlight part or all of the text you want to update.
   Highlight part or all of the text you want to update
4. Select the </> icon in the editor controls to toggle to code view.
5. With the text highlighted, the code editor will open with that same text highlighted. 😉
   Code view opens with the same text highlighted
6. Delete that text.
7. Copy the appropriate merge code from below and paste it in where the text was. Be sure you keep any <h3></h3> or other tags that were already there.
   1. Popular articles list heading:

      [translation("article-lists:popular-articles")]

   2. New articles list heading:

      [translation("article-lists:new-articles")]

   3. Updated articles list heading:

      [translation("article-lists:updated-articles")]

   4. Recent articles list heading:

      [translation("article-lists:recent-articles")]

   5. Favorite articles list heading:

      [translation("article-lists:favorite-articles")]

8. Your code view should now look something like this:

   <div>[template("base-cats")]</div>
   <div class="homepage-widgets">
       <div class="col-md-4 col-sm-6">
   
           <h3>[translation("article-lists:popular-articles")]</h3>[template("pop-articles")]</div>
       <div class="col-md-4 col-sm-6">

9. And if you toggle back to the regular editor, you'll see the title replaced with the merge code you added:
   
   Sample editor with the customize text merge code used
   
10. Be sure to Save your changes.

At this point, any updates to Tools > Customize Text for the article list heading should properly show in your knowledge base!