Help Center
  • Welcome
  • Setka Editor
    • Getting started
    • Drag-and-Drop & Multiselect
    • Text editing
    • Grids and Layout
    • Images
      • Image Editor
    • Background images
    • Icons
    • Animations
    • Lists
    • Tables
    • Dividers
    • Footnotes
    • Hotspots
    • Enhance Symbols
    • Post templates
    • Buttons
    • Comments and collaboration
    • Embeds
    • Hyphenation
    • Responsive layout for mobile screens
    • Custom CSS
    • Custom JS plugins
  • Setka Content Design System Manager
    • Creating and editing styles
    • Text formats and fonts
    • Styles display for mobile mevices
    • Text and background colors
    • Dividers
    • Icons
    • Components – reusable design elements
      • Creating Components with HTML and CSS
        • CSS in components
        • Component examples
    • Configuring layout grids
    • Editing default elements with Custom CSS
    • Adding team members
  • Account Settings
    • Account settings basics
    • Access rights
    • Billing and subscription
  • Preserve your Setka Editor content after the service shutdown
  • Integrations
    • Setka and WordPress
      • Installing Setka Editor WordPress plugin
      • Launching Setka Editor on the post creation page
      • Setka Editor and WordPress compatibility
      • Setka Editor compatibility with the most popular WordPress plugins
      • Inserting graphs, charts, or diagrams into a post
      • Setka Editor and Google AMP
      • Inserting adverts into a post
      • srcset — the attribute for image size optimization
      • Page load speed optimization settings
        • Autoptimize plugin configuration
      • WordPress troubleshooting: known Issues and how to fix them
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Drupal
      • Setka for Drupal — compatibility, and features
      • Installing Setka modules for Drupal
      • Setka content on AMP pages in Drupal
    • Setka and Magento
      • Installing Magento 2 extension
        • Setka Editor configuration page
      • Preserve your Setka Editor content after the service shutdown
    • Setka and HubSpot
      • Setka Editor and HubSpot Blogs
      • Setka Editor and HubSpot Landing Pages
      • Semi-gated content with a HubSpot form
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Bitrix
      • Preserve your Setka Editor content after the service shutdown
    • Setka and Ghost
      • Copying and pasting posts from Setka to Ghost
    • Setka and SharePoint Online
      • Installing Setka Editor application into SharePoint Online
    • Setka and Zapier
      • Setka and Webflow
        • Exporting new posts
        • Updating exported posts
      • Setka and Shopify
    • Setka and Integromat
    • Content Cloud
  • API
    • Setka Content Cloud API
    • Webhooks
    • API for Custom CMS Integration
      • Introduction to custom integration
      • Integration with Content Design System Manager (CDSM)
        • Initial sync — receiving Setka Editor files to connect them to your CMS
        • Storing and processing Setka Editor files
        • Connecting Setka Editor files to the pages of your site
        • Receiving style updates from the Style Manager and new editor versions
      • Setka Post Editor initialization (JavaScript)
      • Integration with Style Manager (API v1, previous version)
      • Preserve your Setka Editor content after the service shutdown
    • Custom Components API
  • VIDEO TUTORIALS
    • Setka Editor Video Tutorials
  • Components Library
    • Components Library
    • Guide: Ideas for Using Setka Editor’s Components to Improve Content Design
  • Content Experience Design Best Practices
    • Guide To Designing a Great Content Experience
Powered by GitBook
On this page
  • What is Setka Editor?
  • Setka Editor integration
  • How to register and configure the account
  • What is necessary for the integration
  • Glossary
  • FAQ
  • Is Setka Editor compatible with my CMS?
  • Does Setka Editor code meet the requirements of SEO?
  • How Setka Editor exports the content?
  • Where and how my content is stored?
  • Useful links
  • Continue the custom integration:

Was this helpful?

  1. API
  2. API for Custom CMS Integration

Introduction to custom integration

PreviousAPI for Custom CMS IntegrationNextIntegration with Content Design System Manager (CDSM)

Last updated 3 years ago

Was this helpful?

What is Setka Editor?

Please learn about Setka Editor and Setka Content Experience Design Manager:

Setka Editor integration

Integration of Setka Editor and a CMS comes in 2 stages:

  1. Style Manager integration — to update styles from the Style Manager account and the editor itself.

  2. Editor initialization on a CMS' post editor page.

How to register and configure the account

To start the integration, it is necessary to create an account (if you don't have one). After the registration, go to the CMS Integration tab on and select Add your domain in the Set your domain block. Then select Via API as an integration type.

What is necessary for the integration

  1. Fill in the license key. It is located in your , on the Integrations tab. It is unnecessary to create a text field in your CMS interface; you can add it to the code. The license key is being transferred with your GET-requests.

  2. Fill in the Editor config URL in the CMS Integration > Other tab.

Editor config URL is an address on which you will receive a recent version of the editor and style updates, created in the Style Manager, to your CMS. On initial sync, you will also receive a public_token, which is required for several editor functions to work, e.g., for commenting and inserting embeds via URL.

The link should be specified with a protocol (HTTP/HTTPS) for the correct integration.

Glossary

Company — a Setka client, each company with a website with a license key and an account in the Style Manager.

License key — company's unique ID, used to connect client websites with the Style Manager.

  1. A company account.

  2. An interface for creating and editing styles (fonts, text formats, color palettes, etc.) and layout grids (column parameters, indentations, and margins).

  3. An API for an automatic connection between the client website and Setka Editor.

Editor — Setka JavaScript WYSIWYG Editor. Launches only in the admin panel. It consists of 2 files in the form of:

editor.min.js — editor's main JS file (hereinafter – editor.js).

editor.min.css — main CSS file, contains editor's interface styles (hereinafter — editor.css).

Post — HTML-code of the post, wrapped into<div class=“stk-post”>...</div>.

Style — set of CSS rules for text styles, fonts, colors, dividers, etc., defines a corporate identity. Being edited in the Style Manager.

Grid — set of CSS rules for building modular grids with columns and indents, used in post layouts and mobile versions. Being edited in the Style Manager.

Styles and grids can be built-in or custom. They are being created in Style Manager. Style Manager generates a new pair of files on each change:

company.min.css — CSS rules for all the company's styles and grids (hereinafter — company.css).

company.json — JSON metadata of styles, grids, etc. (hereinafter — company.json).

public.js — JS file with scripts to launch interactive elements of a post (animations and galleries). Activates on external post pages only.

FAQ

Is Setka Editor compatible with my CMS?

Does Setka Editor code meet the requirements of SEO?

Setka Editor generates well-structured code that meets the requirements of SEO. In the development of Setka Editor, we pay a lot of attention to semantics and correct code structure following the HTML5 standard. Setka Editor edits the page content only; thus, it generates the code with a less nesting level, unlike tools that generate the entire page (page builders). Less-nested HTML code allows faster page loading. Setka Editor also correctly tags headers and allows filling-in an alternate text for images.

How Setka Editor exports the content?

Setka Editor uses its' own tree data structure. Each layout element (paragraph, image, grid, etc.) is presented as an object with properties and connections to other elements. It allows to stay unattached to the HTML representation of a document and export the content in any required format, e.g., JSON.

Where and how my content is stored?

All the content is stored as HTML-code in our database. CSS files can be stored on the client-side or delivered via Setka Editor CDN.

Useful links

Continue the custom integration:

It is not possible to specify a local server (localhost, 127.0.0.1). Public IP-address on DNS servers should match the domain. Set up a tunnel with an external address if you want to test an interaction with a local server, e.g., with the service.

Public key (public token) — a public ID used to send auxiliary requests from the editor to the Style Manager. You can receive it in response to initial synchronization. The public key must be handled to .

(located at editor.setka.io):

Setka Editor is currently available on WordPress, , , , , and . Setka also offers integrations with and via . On top of that, Setka Editor can be integrated with any platform, such as Joomla, MOD X, Typo3, or your own-written proprietary CMS or eCommerce platform.

Setka Editor
Setka Content Design System Manager
editor.setka.io
Setka Account
localtunnel
editor initialization
Style Manager
Drupal
Magento
Microsoft SharePoint Online
HubSpot
Ghost
Shopify
Webflow
Zapier
The latest version of the API documentation
Integration sample for Ruby on Rails
Integration with Style Manager
Setka Post Editor initialization (JavaScript)
Screenshot of Setka Editor Cloud interface. CMS Integration tab with "Other" option and Editor config URL added