How-To: Create a Sidebar Widget for Article Types

The Articles Module allows you to create a custom navigation widget in the sidebar that displays links to all your different Article Types. This widget helps users quickly navigate between different types of content like Blogs, Knowledge Base articles, Community posts, and more - all from a single convenient location.

What This Widget Does

When you add this widget to your article type layouts, users will see a list of clickable links in the sidebar that take them directly to different article types. For example, if you have three article types - Blog, Community, and Knowledge - the widget will display all three as a clickable list, making it easy for users to switch between content types without navigating through menus.

Learn more about the Articles Module and its capabilities on the Magentrix Articles Module for Partner Management and Customer Management.

Prerequisites

Before creating this widget, ensure:

• You have Administrator access
• The Article Types you want to link to already exist in your system
• You know the exact names/paths of your Article Types

How to Add the Widget

Step 1: Login as an Administrator

Step 2: Navigate to Setup > Create > Articles

Step 3: Open the desired Article Type you want to edit

Step 4: Click on the Layout tab

Step 5: In the sidebar configuration area, click the Add Embed Code button

Step 6: A window will open. Enter:

• Heading: Enter a title for your widget (e.g., "Article Types" or "Browse Content")
• Code: Paste the embed code (see example below)

Step 7: Click Add to add the widget to the sidebar

Step 8: Click Save Changes at the bottom of the page

Step 9: Repeat these steps for all Article Types where you want the widget to appear

Code Example

Use this code template for your widget. This example creates a widget listing three article types: Blog, Community, and Knowledge.

<ul class="blog-list data-list">
  <li class="">
    <a href="/articles/Blog" rel="nofollow" class="blog-list-item hoverable">
      Blog <i class="glyphicon glyphicon-chevron-right pull-right"></i>
    </a>
  </li>
  <li class="">
    <a href="/articles/Community" rel="nofollow" class="blog-list-item hoverable">
      Community <i class="glyphicon glyphicon-chevron-right pull-right"></i>
    </a>
  </li>
  <li class="">
    <a href="/articles/Knowledge" rel="nofollow" class="blog-list-item hoverable">
      Knowledge <i class="glyphicon glyphicon-chevron-right pull-right"></i>
    </a>
  </li>
</ul>

Customizing the Code

To add more article types or modify existing ones:

1. Add Additional Article Types: Copy an entire <li> block and paste it below the existing ones
2. Update the Path: Change /articles/YourArticleTypeName to match your article type's path
3. Update the Label: Change the text between the <a> tags to display the name you want users to see

Example: Adding a Fourth Article Type

<li class="">
  <a href="/articles/Press" rel="nofollow" class="blog-list-item hoverable">
    Press Releases <i class="glyphicon glyphicon-chevron-right pull-right"></i>
  </a>
</li>

Important Notes

• The widget will appear on every page within the Article Type where you add it (both list view and individual post view)
• You must add the widget to each Article Type separately if you want it to appear universally across all your article types
• Make sure the paths in your code (e.g., /articles/Blog) match the exact paths configured for your Article Types
• The widget will only show links - it does not check user permissions. Users may see links to article types they don't have access to, though they won't be able to view content when they click

Troubleshooting

The widget doesn't appear:

• Verify you clicked "Save Changes" after adding the embed code
• Check that you added the code in the Layout tab's sidebar area, not elsewhere
• Refresh your browser and clear cache

Links don't work or show "Page Not Found":

• Verify the article type paths in your code match the actual paths configured in your Article Types
• Check for typos in the path names (paths are case-sensitive)
• Ensure the Article Types are set to "Active" status

Widget appears but formatting looks wrong:

• Make sure you copied the entire code block including the <ul> and </ul> tags
• Verify there are no extra spaces or characters in the code
• Check that each <li> block is properly closed with </li>

Users report seeing article types they can't access:

• This is expected behavior - the widget displays all links you add to the code regardless of permissions
• Consider creating separate widgets for different user groups, or document which article types are available to which users