DataEcho allows you simply connect simple website to DataRillCMS. It combines simple template engine with prerender (which also allows to use website when js in disabled). Unfortunately it can be used only for simple websites now. More details about working with the API, which is necessary to create more complex websites and applications, are available in the article "DataRill API".

You will learn:

1- Basic set up

2- Template set up

3- Checking work

1. Basic set up

First step is to choose, what version you will use. There are two DataEchos versions:
1. Standalone - only DataEcho, which will be connected to DataRillCMS on another domain.
2. Integrated - combined DataEcho with DataRillCMS, for work on one domain.

Step 1. Getting API key

To connect DataEcho to the CMS, you need to get the app API key. The steps for creating an application and obtaining a key are described in the article "Adding app".

Step 2. Key integration

After you get app API ky, open file "config.json" from DataEchos root directory. You have to set up it:

{
"default_file": "main", //main page template name
"404_file": "404", //template page name for displaying error 404
"datarill_entry_point": "http://example.com/", //domain, where DataRillCMS is running, look at the presence of a protocol (http: //) and a slash at the end.
"access_code": "Your app API key",
"cache_lifetime" : "3", //after how many days the cache of your templates is updated (used only in the prerender)
"preloader_id": "preloader" //id of html element, which will be used as a loading screen (more details below)
}

For standalone version

Html files of your website must be placed in the root of the directory with DataEcho.

For integrated version

In development.

Next, at the end of each html file, you need to add code for activating DataEcho:

<script type="text/javascript" src="path to file datarill.min.js"></script>
<script>
engine = new DataRill('domain, where DataRillCMS is running','your app API key');
engine.initialize();
</script>

2. Template set up

The syntax of the template engine is quite simple and so far supports a small number of commands.

  • {| ... |} display value from the post with standard schema single_value
  • {% ... %} execute a function (currently only for and include are supported)


2.1 Displaying value

Out of the box there is schema "single_value" with DataRillCMS, created specifically for DataEcho and which stores a single value (it can be either a large text or a simple website name, or a link to a logo). The syntax is pretty simple: {| post name [raw] |} . The optional raw key removes the escaping of special characters and allows you to insert js scripts or any other html elements, like:

code value in DataRillCMS result
<h1>{| brand_name |}</h1> Delivery <h1>Delivery</h1>
<h1>{| brand_name |}</h1> <center>Delivery</center> <h1>&lt;center&gt;Delivery&lt;/center&gt;</h1>
<h1>{| brand_name raw |}</h1> <center>Delivery</center> <h1><center>Delivery</center></h1>
2.1 Function blocks
2.1.1 Function for

Syntax:

{% [!]for elem in schemas_name [raw] %} <a href="unit.url">unit.text</a> {%endfor%}

Gets all publications of the schema 'schema name' and inserts their value into the specified element. Important! Schema, which is used with function "for" must have property "save_format" = "multi". The optional raw key removes the escaping of special characters and allows you to insert js scripts or any other html elements. The optional ! key displays elements in reverse order.

code value in DataRillCMS result
{% for unit in menu_items %} <a href="unit.url">unit.text</a> {%endfor%} Post №0 => text:Main; url=/;
Post №1 => text:About; url=/about;
<a href="/ ">Main</a><a href="/about">About</a>
{% !for unit in menu_items %} <a href="unit.url">unit.text</a> {%endfor%} Post №0 => text:Main; url=/;
Post №1 => text:About; url=/about;
<a href="/about">About</a><a href="/ ">Main</a>
2.1.2 Function include

Allows you to import another page, for example, insert a menu. Of the features, this is the possibility of combining with the output block the values discussed earlier.

code value in DataRillCMS result
{% include(menu) %} --- <!-- code from file menu.html -->
{% include({| menu_page |}) %} xmas <!-- code from file xmas.html -->
2.1.3 Function get...from

Syntax:

{% get post_id from schemas_name [raw] %} <a href="unit.url">unit.text</a> {%endfor%}

Gets specified post of the schema 'schema name' and inserts its value into the specified element. Important! Schema, which is used with function "for" must have property "save_format" = "multi". The optional raw key removes the escaping of special characters and allows you to insert js scripts or any other html elements.

code value in DataRillCMS result
{% get 0 from menu_items %} <a href="get.url">get.text</a> {%endget%} Post №0 => text:Main; url=/;
Post №1 => text:About; url=/about;
<a href="/ ">Main</a>
2.1.4 Function url_param

Syntax:

{% url_param url_element_index %}

Gets specified element from web-site url, like, if url is example.com/blog/1 then {% url_param 2 %} will return 1. It perfectly combines with function get...from.

code value in DataRillCMS result
{% get {% url_param 2 %} from menu_items %} <a href="get.url">get.text</a> {%endget%} url=example.com/blog/1
Post №0 => text:Main; url=/;
Post №1 => text:About; url=/about;
<a href="/about">About</a>