Skip to content

Custom element extension for Kontent.ai bringing Semrush Keyword analytics into your app.

License

Notifications You must be signed in to change notification settings

kontent-ai/integration-semrush

Repository files navigation

Core integration

Last modified Issues Contributors Forks MIT License

Stack Overflow Discord

Kontent.ai logo for dark/light scheme. Kontent.ai logo for dark/light scheme.

FeaturesDemoGetting startedConfigurationContributorsResources

This custom element extension for Kontent.ai allows users to analyze keywords through Semrush.

Features

Editors can analyze lists of keywords across different regions. The editor needs to have working Semrush account in order to log into the application.

Demo

Demo Animation

Getting started

Quick Deploy

Netlify has made this easy. If you click the deploy button below, it will guide you through the process of deploying it to Netlify and leave you with a copy of the repository in your account as well.

Deploy to Netlify

Running manually

You will need to deploy the Netlify function in the api directory. Or run it locally.

The integration's custom element is created with Create React App. First you will need to install npm dependencies with npm install. Then use npm run build to build the integration or npm run start to start a local development server. See https://create-react-app.dev/docs/available-scripts for more scripts.

You can also run the whole environment (custom element and Netlify functions) with npm run netlify or netlify dev. You can provide the SEMRUSH_API_KEY environment variable with .env.local file.

Configuration

Configuring the Netlify functions

Since you don't want to store the API key inside the custom element config, we are using Netlify functions to act as a proxy between your custom element and the Semrush API. In order to make the functions work, you'll need to provide them with the key. You can get the key following this tutorial. We'll use Netlify's Build environment variable. The only issue with these variables is that they are being loaded on build, so whenever you change the variables, you'll need to manually trigger a rebuild.

The expected variable name for the functions is SEMRUSH_API_KEY.

How this all can be done is described in our Kontent.ai-Netlify example repository.

Configuring the Custom Element

To install and configure your extensions, simply create a custom element in your desired content model and fill out the following values:

configuration

The keywordsElementCodename has to contain a codename of a text element/custom element that contains your keywords. There has to be a semicolon between the different values.

Please, keep in mind, that you have to pick the same keyword element from the dropdown under the hosted code URL so the application can access the element and read from it.

What is Saved

This custom element doesn't save any value.

Contributors

We have collected notes on how to contribute to this project in CONTRIBUTING.md.

Additional Resources

About

Custom element extension for Kontent.ai bringing Semrush Keyword analytics into your app.

Topics

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Languages