Display favorites outside the table of contents

Besides adding Favorites to your table of contents, you can choose to add the Favorites section to various areas of your theme using the merge code displayed on Settings > Article Favorites.

This will require working with some HTML.

Places you could consider adding the merge code:

• If your knowledge base is older and has had minimal customizations, most of your homepage likely lives in Knowledge Base > Home Page. You can add a section for your Favorites here.
• If your knowledge base is from at least October 2022 and/or has had theme customizations, your homepage code likely lives in Settings > Style, Custom HTML > Home Page. You can add a section for your Favorites here.
• If you are using a layout that includes the Right Column, you can choose to add a section to your Settings > Style, Custom HTML > Right Column for your favorites.
• To the footer of all articles, similar to the Related Articles section, in Settings > Style, Custom HTML in either the Body or the Article template.

Below, we'll walk through a couple of these as examples (Knowledge Base > Home Page and some Settings > Style options). For all options, you can control the number of favorites displayed in the list, too.

Add Favorites to Knowledge Base > Home Page

If the body of your homepage is set in Knowledge Base > Home Page, you can choose to replace one of the existing article lists with the Favorites list, or add the Favorites list on as an additional section.

Replace existing article list with Favorites

To replace an existing article list with Favorites:

1. Go to Knowledge Base > Home Page.
2. Find the list you'd like to replace. In this example, we'll replace the Popular Articles list. Here's what that looks like before we make any changes:
   
3. Each pre-built article list has a template below it. For example, for the Popular Articles list, this is [template("pop-articles")].
4. Copy the merge code below and paste it in to replace the existing list merge code:

   [reader("favorite-articles")]

5. Update the heading for the article list to use the Customize Text merge code for the Favorites list:

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

6. Your home page might now look like this:
   
7. You can Preview your changes to be sure they look good.
8. Be sure to Save your changes once you're done.

Add new article list section for Favorites

While this Home Page layout has a WYSIWYG editor, to add a totally new section to your home page, we recommend using the Code View option in the upper left of the editor:

1. Go to Knowledge Base > Home Page.
2. In the upper left of the editor, click the </> button to toggle to Code View.
3. The existing article lists are each set up within a div with class="col-md-4 col-sm-6", which helps handle the spacing. Highlight one of the full divs and copy it:
   
4. Move your cursor where you'd like the new list to live and paste that code in.
5. Remove the text between the <h3> and </h3> tags that was your previous list's title. Replace it with the Customize Text merge code for the Favorites list:

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

6. Remove the [template] portion that comes after that and replace it with this merge code:

   [reader("favorite-articles")]

7. Once you're done making changes, it should look a bit like this:
   
8. By default, this setup will bump the fourth list onto a new row. If you'd rather shrink all your lists a little so that you can fit all 4 onto a single row on medium to large screens, you can adjust the div class for all the article lists to col-md-3 instead of col-md-4.
   
9. You can Preview your changes to see what they look like.
10. Be sure to Save once you've finished making changes!

Add Favorites to Settings > Style

If your homepage code is not in Knowledge Base > Home Page, it will be in Settings > Style. If you'd like to add your Favorites section to your Right Column, you'll also head to Settings > Style.

For homepage adjustments here, you can follow the same basic steps whether you're editing the Right Column or the Home Page, you'd just select the appropriate area in the Custom HTML dropdown.

Here, we'll walk through the Home Page:

1. Go to Settings > Style.
2. Below the Preview pane, be sure Custom HTML is selected.
3. Select Home Page from the Custom HTML dropdown.
4. In this Custom HTML, you can either edit one of your existing article lists to change it to Favorites, or add a new section. The same basic steps are followed as in the Knowledge Base > Home Page instructions above, though there is no WYSIWYG in this view (but there is a Merge Code dropdown that will help you get the merge code in!)
5. To edit an existing article list:
   1. Locate the article list you'd like to repurpose. Here, we'll replace Popular Articles:
      
   2. Remove the text or merge code between the <h3> and </h3> tags that was your previous list's title. Replace it with the Customize Text merge code for the Favorites list:

   3. Delete the merge code that comes after that text, beginning with the [ and ending with the ]. So you should go straight from the </h3> to the </div>.
   4. Leave your cursor between the </h3> and the </div>
   5. Click in the -- Select a Merge Code -- dropdown.
   6. In the Article List Merge Codes section, select Favorite Articles.
      
   7. Click the Insert button.
   8. This should insert your merge code where you had your cursor. (You can also copy and paste the merge code in there if it's easier!)
      
   9. You can Preview your changes; just be sure to Save them once you're done!
6. To add to your existing article lists, copy one of the full divs for an article list and paste it where you'd like to add the Favorites. Then proceed with replacing the text and merge code as in the steps above. If you already have three article lists and you're adding a fourth, you can consider adjusting all the article lists to use col-md-3 instead of col-md-4 to get them to fit on a single row.