Info Panel App Installation Guide

Info Panel is a user interface component that displays additional context, details, and insights related to the content or data being viewed or edited.

It typically displays metadata, version history, user activity, and other relevant information to help users understand and manage the content more effectively. The Info Panel enhances usability by offering quick access to critical information without navigating away from the main content interface.

By installing the Info Panel app from the Contentstack Marketplace you can add a Info Panel feature within your JSON Rich Text Editor as a plugin.

Prerequisites

• Contentstack account
• Access to the Contentstack Organization/Stack as the Owner/Admin

Let's follow this step-by-step guide to install and configure the Info Panel app within your stack.

Steps for Execution

1. Install and Configure the Info Panel app in Marketplace
2. Use the Info Panel app within your Entry

1. Install and Configure the Info Panel App in Marketplace

   To install the app, log in to your Contentstack account and follow the steps below:

   1. From the left-hand side primary navigation, click the Marketplace icon.
   2. Click Apps from the left panel.
   3. Within the Marketplace, you can see all the available apps. Hover over the Info Panel app and click Install.
   4. In the pop-up window, select the stack where you want to install the app, accept the Terms of Service, and click the Install button.
   5. On the UI Locations tab, you can see the predefined app location. If you disable the UI location, you will not be able to save the configuration as it requires at least one UI location.

      Additional Resource: For more information on UI locations, please refer to the Installed Apps guide.

   6. Click Open Stack to start using the Info Panel application.

2. Use the Info Panel App within your Entry

   To use the Info Panel app within an entry of your stack, follow the steps given below:

   1. Go to your stack, click the Content Models icon from the left navigation panel, and click the + New Content Type button.
   2. Create a content type by adding relevant details as displayed below:
   3. In the Content Type Builder page, add a JSON Rich Text Editor field in your content type by clicking the Insert a field link represented by a + sign.
   4. On the JSON Rich Text Editor Properties modal, enter the following:
      1. Enter a Display Name for the field, for example, Info Panel.
      2. (Optional) Enter an Instruction Value and Help Text for the field.
      3. Click inside the Select JSON RTE Plugin(s) field, select Info Panel from the list of plugins, and then click Add Plugin(s).

         This adds Info Panel in the JSON Rich Text Editor.

         
   5. After adding the app in a JSON Rich Text Editor field, click Save or Save and Close to save your changes.
   6. To use the Info Panel app, create an entry for this content type. In the left navigation panel, navigate to the Entries page, click + New Entry to create a new entry for the above content type, and then click Proceed.

      Click the Info Panel icon from the panel and write the important information. You can also select the text and click the Info Panel icon from the toolbar.

      
   7. You can then proceed to Save and Publish your entry.