TLDR: This page contains some information what Styla is from a technical point of view. The content is here only to help you better understand how Styla works. If you work on an implementation for your client or employee then you might also just move on to another page. If you need more information on them, follow the links or just ask us via Email or on a call.
Styla accounts are groups of content with set styling rules and lots of other features, that you can place on your website. You can create content for them with Styla's editor (see below). If you have different audience groups or locales, you should get one Styla account for each of these groups.
Styla content pages are single page-applications rendered by JavaScript which means the page initially requested from a Styla server once and then dynamically updated for subsequent pages. This is especially important for Magazines and has several consequences, among others:
Apart from rendering content in browser window with JS, Styla provides an API which delivers JSON with tags that can be rendered server-side and included in <head> and <body> tags of pages on which Styla content is embedded.
This means that:
Read about integration with Styla's SEO API on this page.
You can read a detailed list of Styla's features that are SEO-relevant and how we improve loading speed on this page: SEO and Page Speed
Together with your accounts, you get an access to editor.styla.com with which you create and edit Pages, Magazines and Modular Content, upload images, embed products into stories. You can also:
Every new client gets a training on how to use the Editor and tips and tricks for creating content with Styla.
Any page you create there consists of modules that you can drag&drop into place, fill with content (text, images, videos, products), rearrange on a page, copy. Currently, the following modules are available:
Modules are grouped in rows and there can be up to three modules in a single row. You can set modules to take 1/3 or 2/3 of a row's width. You can also set some other properties for a row like: margin above it, padding inside it, width: full window or row width.
Read more about the modules on this page.
There are two options for interacting with products from your shop in your Styla Content:
The first option requires a higher integration level since you have to display product details (price, variants) and have a callback to add to cart. Product data can be sourced by Styla either from a static file or an API. Read about our product integration on this page.
Product data is used in two modules: product slider/grid and hotspot/editorial shopping.
Of course, Styla content without products at all is possible as well.
Images used in Styla content are:
They reduce all integration effort to just installing and configuring them:
Please find a list and a description of what they do on this page.
Each new account launched for a client is being monitored 24/7 by a tool that checks if:
We call this tool the LiveChecker. It works by simulating user clicks on the content hub. The LiveChecker is able to handle most basic popups (like cookie policies, promotionals, ...), but will get disturbed by more arcane implementations.
For instance, if there is one popup/overlay message displayed on first visit to inform about cookie policy and another one displayed periodically to inform about special discounts, then the LiveChecker will not work properly. As a consequence, Styla will not be alerted right away, if any of the features on the list above is not working correctly. Please be aware of this.