Egnyte App Installation Guide

Egnyte is a cloud-based content security and collaboration platform designed for businesses. It offers secure file sharing, data protection, and infrastructure modernization capabilities, enabling users to access, store, and collaborate on files from any device.

Egnyte supports many file types, encompassing documents, images, videos, audio files, and more. This includes popular formats such as PDF, DOCX, PPTX, XLSX, JPEG, PNG, MP4, MP3, and others, making it versatile for various business needs.

The Contentstack Marketplace lets you install the Egnyte app and use it within your stack to fetch and display images, graphics, videos, and text files from the Egnyte account within your entries.

Prerequisites

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

Let's follow this step-by-step guide to install and configure Egnyte within your stack.

Steps for Execution

1. Retrieve Domain URL and API key for Egnyte account
2. Install and Configure Egnyte in Contentstack Marketplace
3. Use Egnyte within your Stack Entry

1. Retrieve Domain URL and API key for Egnyte account

   To get your configuration details for Egnyte, follow the steps given below:

   1. To get the Domain URL for app configuration in step 2, refer to the Custom URLs webpage. You can register the domain while creating the app.
   2. To get the API Key, log in to the Egnyte Developer account using your Egnyte account credentials.
   3. Click Get API Key on the dashboard.
   4. You can copy the Egnyte API Key to the clipboard to use in step 2.

      Note: The status of the API Key should be active for a successful configuration. Please contact the Egnyte support team if the API key is in a waiting or inactive state.

2. Install and Configure Egnyte in Contentstack Marketplace

   Follow the steps given below to install the Egnyte app in Contentstack.

   1. Log in to your Contentstack account.
   2. In the left-hand side primary navigation, click the Marketplace icon to go to the Marketplace.
   3. Click Apps from the left panel.
   4. Within the Marketplace, you can see all the available apps. Hover over the Egnyte app and click Install.
   5. In the pop-up window, select the stack where you want to install the Egnyte app, accept the terms of service, and click the Install button.
   6. On the Configuration screen, enter the Domain URL and Egnyte API Key retrieved from your Egnyte account in step 1.If you select Custom Fields then the Egnyte Keys drop-down appears. By default, entry_id, path, name, and link.url keys are already selected inside the dropdown. If you want to create a new key, click the + New Key Field option.

      In the Add Egnyte Key Path modal, enter the Egnyte Key Path and click the Create or Create and Apply button to create a new key.

      
   7. Click the Save button.
   8. On the UI Locations tab, you can see the predefined app locations. You can use the toggle button corresponding to each UI location to enable or disable it based on your requirements.

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

   9. Click Open Stack to start using the Egnyte application.

3. Use Egnyte within your Stack Entry

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

   1. Go to your stack, click the Content Models icon in the left navigation panel, and click the + New Content Type button.
   2. Create a content type by adding relevant details as displayed below:

   3. There are two ways to use the Egnyte app in your entry:

      1. Custom Field
      2. JSON Rich Text Editor Field

   Steps to Use the Egnyte App as a Custom Field

   1. In the Content Type Builder page, add a Custom field in your content type by clicking the Insert a field link represented by a + sign.
   2. Under Select Extension/App, select Egnyte and click the Proceed button.

      This adds Egnyte in the custom field.

      
   3. After adding the app in a custom field, click Save or Save and Close to save your changes.
   4. Now to use the Egnyte app, create an entry in this newly created 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.
      You can see the Egnyte app’s custom fields on your entry page as shown below:
   5. Click + Choose Asset(s) button.

      Note: If you are using the Egnyte app for the first time, the app will redirect you to the Egnyte login page after clicking the + Choose Asset(s) button. You need to authenticate the credentials and allow access to the Egnyte assets by clicking the Allow Access button.

      
   6. Choose the required assets from your Egnyte account and click OK to add them to your entry.

      The assets you select get added to your entry in the thumbnail view.

      

      To view the assets in the list view, select the List view option from the dropdown.

      

      The assets you select get added to your entry in the list view.

      
   7. Hover over the image to view the options to reorder, preview, and remove the asset.
      1. Click the Reorder icon to drag and reorder the asset.
      2. Click the Open in Egnyte icon to open the file in the Egnyte app.
      3. Click the Remove icon to delete the asset.

      Thumbnail View

      

      List View

      
   8. After adding the asset(s), Save and Publish your entry.

   Steps to Use the Egnyte App in a JSON Rich Text Editor Field

   1. 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.
   2. Under Select Extension/App, select Egnyte and click the Proceed button.

      This adds Egnyte in the custom field.

      
   3. After adding the app in a JSON Rich Text Editor field, click Save or Save and Close to save your changes.
   4. Now to use the Egnyte app, create an entry in this newly created 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.
      You can see the Egnyte icon in the JSON Rich Text Editor field on your entry page as shown below:
   5. Click the Egnyte app icon.

      Note: If you are using the Egnyte app for the first time, the app will redirect you to the Egnyte login page after clicking the app icon. You need to authenticate the credentials and allow access to the Egnyte assets by clicking the Allow Access button.

      
   6. Choose the assets from your Egnyte account and click OK to add them to your entry.

      The assets you select get added to your entry.

      
   7. To resize the image, drag the corner of the image and adjust the size as required. Hover over the image to view the options to edit and remove the asset.

      Additional Resource: You can use alignment and inline asset features to edit the asset placement within the JSON Rich Text Editor field.

   8. After adding the asset(s), Save and Publish your entry.