@tanglemedia/directus-collection-flex-editor

Installs the Flex Content Collection and easily adds the flex content editor to a Directus collection

The package will install the following collections:

• Flex Content Collection (tngl_flex_content)
  • Table that contains the flex content editor and plain fields that is supposed to store the content of a directus collection
• Flex Content Nodes Collection (tngl_flex_content_nodes)
  • Junction table between the flex content table and node components
• The node components are separate tables. These node components are relational data types that can be added to the content editor
  • Embed
  • Image
  • Resource
  • Section

It automatically sets the following:

• Creates a new role called Website. If the Website role already exist, it will not create a new one.
• Website role will have READ permission to all collections in this package

Requirements

• Directus >= 10.10.1
• Node >= 18.x.x

Install

1. Before you proceed, install the following Directus extensions

   • directus-extension-inline-form-interface
   • directus-extension-flexible-editor
   • @tanglemedia/directus-extension-plainify-flex
     • to generate plainified version of the flex content
   • @tanglemedia/directus-collection-embed
     • to relate the embed node component to the tngl_embed table
   • @tanglemedia/directus-collection-resource
     • to relate the resource node component to the tngl_resource table
   • @tanglemedia/directus-collection-section-banner
     • to relate the resource node component to the tngl_secbanner table

2. Add the following variables to your Directus env file:

   • FLEX_COLLECTION
     • comma-separated names of collections that you want to add the flex content editor into
     • make sure these tables are installed (exist) first before you install this package

3. npm i @tanglemedia/directus-collection-flex-editor

4. npx directus bootstrap to update your database and restart directus