Formatting of date

Here you see how date from JSON can be formatted by twig.
Example of JSON with dates:

For that create a JCI-Template with:

time: {{time}}<br>
time-formatted: {{ time | date("l d.m.Y") }}<br>
date: {{date}}<br>
date-formatted: {{ date | date("l d.m.Y") }}<br>
otherdate: {{otherdate}}<br>
otherdate-formatted: {{ otherdate | date("l d.m.Y H:i:s") }}<br>

Then add [jsoncontentimporterpro nameoftemplate="dateformatting"] to a page:

time: 1670398337
time-formatted: Wednesday 07.12.2022
date: 2022-10-06T00:00:00.000+0000
date-formatted: Thursday 06.10.2022
otherdate: Wed, 07 Dec 22 08:32:17 +0100
otherdate-formatted: Wednesday 07.12.2022 07:32:17

API: Overview…
gives a list of warnings

Local stored JSON:


  • name: verkehr-autobahn
  • URL: see above
  • twig-template:
{% for i in warning %}
    <a href="/api-overview-verkehr-autobahn-de-o/?warningid={{i.identifier | url_encode}}">more</a><hr>
{% endfor %}


[jsoncontentimporterpro nameoftemplate="verkehr-autobahn"]

In Action:

Hannover Richtung Dortmund
Beginn: 10.12.2021 00:00

PRO: JCI-Template urlparam4twig

You can define a urlparam4twig-list like “one#two” via the shortcode “urlparam4twig ” or (preferrably) the JCI-plugin-template.

This gives you a flexible way to put a dynamic URL together for the API-call.

Create a template with the following settings. Save this template andput the shortcode on a page:

Click here and see the change in the following paragraph. You might change the values for the parameters.
In the back the twig code in the URL is executed and the values for “one” and “two” are used.

this is a template: <br>
time: {{ "now"|date("m.d.Y") }}<br>
urlparam "one": {{ | e}}<br>
urlparam "two": {{urlparam.two | e}}

URL:{{ "now"|date("mdY") }}&a={{}}&b={{urlparam.two}}

urlparam4twig: one#two

In Action:

this is a template:
time: 12.07.2022
urlparam "one":
urlparam "two":

PRO & Free: API and PRO-formatting of numbers

Show data from

Local stored at

Free JCI:

[jsoncontentimporter url=]
reported_volume_24h = {quotes.TRY.reported_volume_24h} 

In Action:
Note the rounded number!

reported_volume_24h = 1243624306.49



Note how formatnumber is used. First we separate the number before and after the decimal point. Then we use formatnumber for the number before the decimal point only.

quotes.TRY.reported_volume_24h: {{quotes.TRY.reported_volume_24h}}<br>
{% set lire = quotes.TRY.reported_volume_24h|split('.') %}
reported_volume_24h =  {{lire.0 | formatnumber(0, '', ',') }}.{{lire.1}}

convertjsonnumbers2strings=yes converts numbers into strings. Otherwise WordPress / PHP would round those numbers.

[jsoncontentimporterpro id=_NO_OF_TEMPLATE convertjsonnumbers2strings=yes]

In Action:

quotes.TRY.reported_volume_24h: 1243624306.492943
reported_volume_24h = 1,243,624,306.492943

twig: Pick items out of a array-list

Challlenge: Pick single items out of a JSON like this.

Solution: see the following twig-syntax

  • URL: see above
  • twig-template:
{{hospitalizationData.0.1.0}}: {{hospitalizationData.1.1.0 }}<br>
{{hospitalizationData.0.1.1 }}: {{hospitalizationData.1.1.1 }}<br>
{{hospitalizationData.0.1.2 }}: {{hospitalizationData.1.1.2 }}

In Action:

Date: 2020-04-14T00:00:00.000Z
Hospitalized: 427
Critical condition: 84

PRO & Free, Gutenberg: API

Via the question came in on how to use… (see also here) with the free plugin.

Free JCI:

[jsoncontentimporter url= numberofdisplayeditems=-1 basenode=tank]
fish: {subloop-array:fish:-1}quantity: {fish.quantity}<br>{/subloop-array:fish}
plants: {subloop-array:plants:-1}species: {plants.species}<br>{/subloop-array:plants}

Another Free-Way is via the JCI-Gutenberg-Block (part of the free JCI):


{% for level_4_item in _context['tank']['fish'] %} 
quantity = {{ level_4_item['quantity'] }} 
species = {{ level_4_item['species'] }} 
{% endfor %} 
{% for level_4_item in _context['tank']['plants'] %} 
species = {{ level_4_item['species'] }} 
latin = {{ level_4_item['latin'] }}
{% endfor %} 
{% for level_4_item in _context['tank']['heaven'] %} 
quantity = {{ level_4_item['quantity'] }} 
species = {{ level_4_item['species'] }} 
reason = {{ level_4_item['reason'] }} 
{% endfor %}

Numbers and Strings in free and PRO plugin

Numbers and Strings:
See this JSON:

{"num": 3.5050, "str": "3.4040" }

There is a little difference: “num” is without quotation marks, “str” is with.
The JSON Content Importer Plugin and the PHP behind that handles the “num” as numeric data and removes the 0 at the end.

Free JCI:

[jsoncontentimporter url=]num: {num}, str: {str}[/jsoncontentimporter]

Free JCI in Action:
Note the missing 0 for the value of “num”

num: 3.505, str: 3.4040


To “save” the 0 you need the PRO plugin – unfortunately: There “convertjsonnumbers2strings=yes” converts the JSON to do this.


[jsoncontentimporterpro nameoftemplate="twig-numbers" convertjsonnumbers2strings=yes]


  • URL: see above
  • twig-template:
{{num}} {{str}}

PRO in action:

3.5050 3.4040

PRO & free: API

Challenge: Display data from the API

local stored JSON:

Free Plugin:

[jsoncontentimporter url=]
{subloop:today:-1}<br> {today.title}<br> {subloop-array:today.stationData:-1}<br> {subloop:today.stationData.symbol:-1} <br> {today.stationData.symbol.description}: {today.stationData.min}-{today.stationData.max}<br> {/subloop:today.stationData.symbol} <br> {/subloop-array:today.stationData} <br> {/subloop:today} <br> 

PRO JCI-Plugin:

  • twig-template:
{{ | date('d.m.Y, H:i:')}}: {{today.conditions}}<br>
{% for s in today.stationData %}
Station {{loop.index}}, code: {{s.symbol.code}}: {{s.min}}-{{s.max}} <img src="{{s.symbol.imageUrl}}"><hr>
{% endfor %}
<hr>Pick the 3rd station in the list:
 code: {{today.stationData.3.symbol.code}}: {{today.stationData.3.min}}-{{today.stationData.3.max}}  

PRO JCI Plugin in action:

05.02.2022, 00:00:: Anfangs streift eine schwache Kaltfront die Alpennordseite, im Tagesverlauf wird die Luft wieder trockener.
Die Höchstwerte liegen zwischen 3° bis 13°.
Station 1, code: a: -2-9
Station 2, code: a: -1-13
Station 3, code: a: -2-11
Station 4, code: b: -4-6
Station 5, code: a: -3-8
Station 6, code: b: -7-4

Pick the 3rd station in the list: code: b: -4-6

twig: Date-Formatting



  •… or

Create a new JCI-Template:

{{_context.0.kaledatum | dateformat('%A %d', 'Europe/Berlin', 'nl_NL')  }} 
{{_context.0.kaledatum | date('l d.m.Y')  }}: {{_context.0.thuisteamclubrelatiecode}}-{{_context.0.uitteamclubrelatiecode}}

In Action:

zaterdag 05
Saturday 05.02.2022: NCX38R6-NCX24H9