Follow these instructions only if you've already Enabled favorites, viewed an article as a logged-in reader or author, and aren't seeing the favorites star icon next to the article title.
Once you've turned on favorites, if you don't see the star icon next to article titles, you're likely using an older knowledge base whose theme pre-dates the release of Article Favorites. Never fear, we just need to get your theme updated so it knows Favorites exists!
To do so:
- Go to Settings > Style.
- In the Customize HTML, CSS, and JSS section, be sure Custom HTML is selected.
- In the Select HTML section to edit dropdown, select Article.
- Look for the
h1 class="hg-article-title"
, usually around row 3 in the Custom HTML. If you don't seearticle("action_icons")
, we need to make more changes. Your HTML likely has aspan class="ko-article-actions"
, something like this:<div class="hg-article"> <div class="hg-article-header"> <h1 class="hg-article-title">[article("title")]<span class="ko-article-actions"><span class="pdf">[article("pdf_download_tool")]</span><a href="#" class="ko-js-print"><i class="fa fa-print fa-fw"></i></a><a href="#" onclick="javascript:window.location='mailto:?subject=[article("title")]&body=' + window.location;"><i class="fa fa-envelope-o fa-fw"></i></a></span></h1> <div class="metadata">
- You have two options:
- Recommended: Highlight all of the HTML for the ko-article-actions span, remove it, and replace it with the
article("action_icons")
template. For more detailed instructions, refer to Update your article actions merge code. - If you don't want to touch that HTML due to existing customizations, add a new merge code into the HTML to enable the favorites icon:
- Copy the merge code below:
[article("favorites_action")]
- Look for the final
</span>
before the</h1>
tag (row 3 usually wraps onto multiple lines, this should be right at the end of the final wrapped line). Paste the merge code in between the</a>
and the</span>
. Our code sample from above now looks like this:
<div class="hg-article"> <div class="hg-article-header"> <h1 class="hg-article-title">[article("title")]<span class="ko-article-actions"><span class="pdf">[article("pdf_download_tool")]</span><a href="#" class="ko-js-print"><i class="fa fa-print fa-fw"></i></a><a href="#" onclick="javascript:window.location='mailto:?subject=[article("title")]&body=' + window.location;"><i class="fa fa-envelope-o fa-fw"></i></a>[article("favorites_action")]</span></h1> <div class="metadata">
- Copy the merge code below:
- Recommended: Highlight all of the HTML for the ko-article-actions span, remove it, and replace it with the
- You can Preview your changes to be sure they look good.
- Just be sure to Save your changes once you're done!
Use View "My KB" at the top of the Style page and navigate to an article. If you've done everything correctly, you'll now see the favorites star icon:
If you're still not seeing the star icon, contact us for help.