• Product

  • Solutions

  • Developers

  • Docs

  • Pricing

  • Cloud

Search icon
Strapi plugin logo for Snippets

Snippets

Populate custom snippets into API response data.

thumbnail for Snippets
Logo for Strapi snippets plugin

Strapi Snippets

A plugin for Strapi CMS that populates custom snippets into API response data.

Screenshot for Strapi snippets plugin

Get Started

✨ Features

  • Create variables to use throughout your content, which are replaced in API response data.
  • Copy and paste easily into your text fields.
  • Updating the snippet code automatically updates all of your data entries in Strapi with the new code.
  • Supports API models, plugin models, components, and dynamic zones.

💎 Installation

yarn add strapi-plugin-snippets@latest

Don't forget to restart or rebuild your Strapi app when installing a new plugin.

🔧 Configuration

propertytype (default)description
contentTypesobject (null)An optional config object that allows configuring which additional models should or should not support snippets.
contentTypes.allowarray (null)An array of either model, plugin, or component UIDs which support snippets.
contentTypes.denyarray (null)An array of either model, plugin, or component UIDs which DO NOT support snippets.
ignoreUnmatchedbool (false)If true, unmatched codes will remain unparsed in response data, otherwise they are replaced with an empty string.
uppercasebool (true)If true, the plugin will apply uppercase formatting to the code value when a snippet is created or updated.

contentTypes

By default, all API models and components are parsed by the snippets plugin. However, models defined in plugins are not automatically included.

Use the allow and deny props of contentTypes to include or exclude certain UIDs which can include API content types, plugin content types, and components.

Example

1
2
3
4
5
6
7
8
9
10
11
12
13
// ./config/plugins.js`
'use strict';

module.exports = {
  snippets: {
    config: {
      contentTypes: {
        allow: [ 'plugin::menus.menu', 'plugin::menus.menu-item' ],
        deny: [ 'api::example.example', 'comp.example-component' ],
      },
    },
  },
};
UID typeFormat
API modelapi::name.name
Plugin modelplugin::name.name
Component modelcategory.name

ignoreUnmatched

If true, unmatched codes will remain unparsed in response data, otherwise they are replaced with an empty string.

Example

1
2
3
4
5
6
7
8
9
10
// ./config/plugins.js`
'use strict';

module.exports = {
  snippets: {
    config: {
      ignoreUnmatched: false,
    },
  },
};

Consider a scenario where we have 2 snippets, one called SNIPPET_ONE and another called SNIPPET_TWO and both will be replaced with the string "foobar". We also have an entity with a title and summary fields where both fields use snippets.

The snippet named SNIPPET_MISSING does not actually exist and will either be replaced with an empty string or ignored completely. See the example below.

Response data BEFORE parsing snippets
1
2
3
4
5
6
7
8
9
10
{
  "data": {
    "id": 1,
    "attributes": {
      "title": "Testing snippet {SNIPPET_ONE} and {SNIPPET_MISSING}.",
      "summary": "Testing snippet {SNIPPET_ONE} and {SNIPPET_TWO}."
    }
  },
  "meta": {}
}
Response with ignoreUnmatched set to true
1
2
3
4
5
6
7
8
9
10
{
  "data": {
    "id": 1,
    "attributes": {
      "title": "Testing snippet foobar and {SNIPPET_MISSING}.",
      "summary": "Testing snippet foobar and foobar."
    }
  },
  "meta": {}
}
Response with ignoreUnmatched set to false
1
2
3
4
5
6
7
8
9
10
{
  "data": {
    "id": 1,
    "attributes": {
      "title": "Testing snippet foobar and .",
      "summary": "Testing snippet foobar and foobar."
    }
  },
  "meta": {}
}

uppercase

If true, the plugin will apply uppercase formatting to the code value when a snippet is created or updated.

Example

1
2
3
4
5
6
7
8
9
10
// ./config/plugins.js`
'use strict';

module.exports = {
  snippets: {
    config: {
      uppercase: false,
    },
  },
};

📘 User Guide

Creating

While typing the snippet code you will notice the input value is masked to the following conditions:

  • Must use only letters, numbers, and underscores.
  • Must start with a letter.

Uniqueness is validated upon saving.

Updating

After updating the code value of a snippet, it will be automatically updated across your content so you do not have to revisit every entry to update the snippet code to the new value.

Using snippets in your content

To use snippets in your content, you can type a snippet code wrapped in curly braces {} in string or text fields and it will be replaced with the replacement value when it appears in API response data.

Screenshot for code usage with Strapi snippets plugin

💩 Troubleshooting

In general

Remember to rebuild your app after making changes to some config or other code.

yarn build
# OR
yarn develop

❤️ Support or Donate

If you are enjoying this plugin and feel extra appreciative, you can buy me a beer or 3 🍺🍺🍺.

🚧 Roadmap

  • Edit view sidebar button to view and copy/paste snippet codes.
  • Reserved snippet codes for things like CURRENT_YEAR.
  • Localization support.

Install now

npm install strapi-plugin-snippets

STATS

3 GitHub stars76 weekly downloads

Last updated

157 days ago

Strapi Version

4.13.1 and above

Author

github profile image for Matt Milburn
Matt Milburn

Useful links

Create your own plugin

Check out the available plugin resources that will help you to develop your plugin or provider and get it listed on the marketplace.