Here you see how date from JSON can be formatted by twig.
Example of JSON with dates: http://api.json-content-importer.com/extra/json/date.php
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: 1664310702
time-formatted: Tuesday 27.09.2022
date: 2022-10-06T00:00:00.000+0000
date-formatted: Thursday 06.10.2022
otherdate: Tue, 27 Sep 22 22:31:42 +0200
otherdate-formatted: Tuesday 27.09.2022 20:31:42
https://verkehr.autobahn.de/o/autobahn/details/warning/{warning.identifier}
gives details of a warnings (list of warnings, see here)
Local stored JSON: http://api.json-content-importer.com/extra/json/nZpel9fTE1TLU5JL3JfTE1TLU5JLzI0MDQ5M19EICBOSSBMTVMtTkkgIC4w.json
JCI-Template:
- name: detail-autobahn
- URL:
“dummyrequest” does not do a http-request but gives basic info about the page. With that you can catch errors etc.
{% set url = "dummyrequest" %}
{% if urlparam.warningid %}
{% set url = "https://verkehr.autobahn.de/o/autobahn/details/warning/" ~ urlparam.warningid %}
{% endif %}
{{url}}
- urlparam4twig: warningid
- twig-template:
<a href="/api-verkehr-autobahn-de-o/">back to list</a><hr>
{% if subtitle %}
<strong>{{subtitle}}</strong><br>
{{description.0}}<br>
coordinates: {{coordinate.lat}},{{coordinate.long}}<br>
{% for k,v in description %}
{% if v %}
{{v}}<br>
{% endif %}
{% endfor %}
{% else %}
no warning found
{% endif %}
Shortcode:
[jsoncontentimporterpro nameoftemplate="detail-autobahn"]
In Action:
back to list
no warning found
https://verkehr.autobahn.de/o/autobahn/A2/services/warning
gives a list of warnings
Local stored JSON: http://api.json-content-importer.com/extra/json/verkehrwarning.json
twig-template:
- name: verkehr-autobahn
- URL: see above
- twig-template:
{% for i in warning %}
<strong>{{i.subtitle}}</strong><br>
{{i.description.0}}<br>
<a href="/api-overview-verkehr-autobahn-de-o/?warningid={{i.identifier | url_encode}}">more</a><hr>
{% endfor %}
Shortcode:
[jsoncontentimporterpro nameoftemplate="verkehr-autobahn"]
In Action:
Hannover Richtung Dortmund
Beginn: 10.12.2021 00:00
more
This pages shows you how to get access to the data at
http://api.json-content-importer.com/extra/api/getdata.php?gd=acc
This API / URL expects:
- Useragent: mozilla
- HTTP-Header with “Authorization:Bearer TOKEN”
- “TOKEN” has to be obtained from
http://api.json-content-importer.com/extra/api/gettoken.php
For that user / password has to be sent by CURL-POST.
This is called oAuth2, to avoid sending user / password via http, but a TOKEN the API can check if user / password is ok.
We need two JCI-Shortcodes for that.
JCI-Template 1: The Shortcode (orderofshortcodeeval=1 tells the plugin to first execute the twig code and then the Shortcode – 10 would not execute the Shortcode, then you can see the TOKEN…)
[jsoncontentimporterpro nameoftemplate="demo-oauth" orderofshortcodeeval=1]
is for the page which will show us the data.
Defined it like this:
- Name: demo-oauth
- URL: http://api.json-content-importer.com/extra/api/gettoken.php
- method: CURL-POST
- curloptions: CURLOPT_POSTFIELDS={“user”: “test”, “password”: “mypass”}
- twig-template:
test<br>
[jsoncontentimporterpro nameoftemplate="demo-oauth2" curloptions="CURLOPT_USERAGENT=mozilla;CURLOPT_HTTPHEADER=Authorization:Bearer {{access_token | striptags}}"]
Ok, we need JCI-Template 2:
- name: demo-oath2
- URL: http://api.json-content-importer.com/extra/api/getdata.php?gd=acc
- method: CURL-GET
- curloptions: are sent from the other JCI-Template, where this Shortcode is used
- twig-template:
{% if datasuccess %}
{% for b in boat %}
boat-id: {{b.id}}<br>
{% endfor %}
<hr>
{% for h in harbour %}
harbour-id: {{h.id}}<br>
{% endfor %}
{% endif %}
In Action:
test
boat-id: 2114032
boat-id: 2875214
boat-id: 5287757
boat-id: 2690458
boat-id: 2857841
boat-id: 4727688
harbour-id: 749211
harbour-id: 5950593
This pages shows you how to update Custom Post Type-Pages by running a twig-script which is loading the JSON-data and updates Page by Page.
Create a JCI-Template with
- URL: http://api.json-content-importer.com/extra/json/meetup/1.json
- twig-template:
- wp_clear_taxonomy: remove all taxconomy-enties from the taxonomy defined by “taxonomyslug”
- “{% for i in _context %}”: Loop through JSON-data
- wp_get_cp_by_cpf_keyvalue: Check if there are existing Pages of the CPT slug (=”cptexample”), where the CPF “cpf1” matches the JSON-datafield “id”
- If there is a Page use wp_insert_custom_field_keyvalue to insert / overwrite a CPF. And wp_insert_taxonomy to insert a taxonomy-value.
{% set slug = 'cptexample' %}
{% set taxonomyslug = 'cptaxonomyexample' %}
{% set cleartax = wp_clear_taxonomy(taxonomyslug, FALSE) %}
{% for i in _context %}
{% if i.id %}
name: {{i.name}}<br>
{% set cpfound = wp_get_cp_by_cpf_keyvalue(slug , 'cpf1', i.id) %}
{% if cpfound.0 %}
{% set tz = date().format('U') %}
{% set rescpf = wp_insert_custom_field_keyvalue(cpfound.0, 'cpf2', tz ~ ' - '~i.name, FALSE) %}
{% set taxval= 'tax-'~cpfound.0 %}
{% set addtax = wp_insert_taxonomy(cpfound.0, taxonomyslug, taxval, TRUE) %}
{% endif %}
{% endif %}
{% endfor %}
In Action:
name: Love Breakfast
add taxonomy to page 10296: cptaxonomyexample
name: Drupal Coworking Day
add taxonomy to page 10297: cptaxonomyexample
name: Geeks - Februrary Edition
add taxonomy to page 10298: cptaxonomyexample
name: February 2019 Meetup
add taxonomy to page 10299: cptaxonomyexample
name: UG February Event
add taxonomy to page 10300: cptaxonomyexample
name: Ignite Talks & Networking
add taxonomy to page 10301: cptaxonomyexample
name: public Event
add taxonomy to page 10302: cptaxonomyexample
name: D-Meetup
add taxonomy to page 10303: cptaxonomyexample
Challenge: Display the data from https://waterservices.usgs.gov/nwis/iv/?format=json&sites=01407600¶meterCd=72279&siteStatus=active
Local JSON stored at http://api.json-content-importer.com/extra/json/waterservices.usgs.gov.json
Simply displaying data is easy – create a Plugin template with the above URL and this Twigcode (Shortcode: [jsoncontentimporterpro nameoftemplate=NAME_OF_TEMPLATE])
Location: {{value.timeSeries.0.sourceInfo.siteName}}<br>
Date: {{value.timeSeries.0.values.0.value.0.dateTime | date("Y-m-d", "America/New_York") }} <br>
Time: {{value.timeSeries.0.values.0.value.0.dateTime | date("H:i", "America/New_York") }}<br>
Water Level: {{value.timeSeries.0.values.0.value.0.value}}
In Action:
Location: Shrewsbury River at Sea Bright NJ
Date: 2022-09-27
Time: 16:18
Water Level: -1.42
Display this data with the “Auto Refresh API Ajax” Plugin- Way 1:
- Install the Plugin
- Create a HTML-Div like
<div id="araatest">load data</div> - Go to the “Auto Refresh AA” menu and insert this:
- URL: See above
- What: value.timeSeries.0.values.0.value.0.value
- Where:
div[id="araatest"]
Display this data with the “Auto Refresh API Ajax” Plugin- Way 2:
Create a new JSON-Feed with the JCI-PRO-Plugin by adding a new plugin-template:
- Name: waterservices-json
- URL: https://waterservices.usgs.gov/nwis/iv/?format=json&sites=01407600¶meterCd=72279&siteStatus=active
- twig-template:
{"time": "{{"now" | date("d.m.Y, H:i:s") }}", "data": "Location: {{value.timeSeries.0.sourceInfo.siteName}}, Date: {{value.timeSeries.0.values.0.value.0.dateTime | date("Y-m-d", "America/New_York") }}, Time: {{value.timeSeries.0.values.0.value.0.dateTime | date("H:i:s", "America/New_York") }}, Water Level: {{value.timeSeries.0.values.0.value.0.value}}"}
Shortcode:
[jsoncontentimporterpro nameoftemplate="waterservices-json"]
This page with this Shortcode should be something like this:
http://api.json-content-importer.com/json-waterservices-usgs-gov/
Adding “?show=oc” removes the template and gives pure JSON:
http://api.json-content-importer.com/json-waterservices-usgs-gov/?show=oc
This JSON we can use in “Auto Refresh API Ajax”:
Example in Action:
load data
Challenge:
Display data from https://monitoringapi.solaredge.com/site/CUSTOMERNUMER/overview.json?api_key=APIKEY
There at least three ways to do that…
Continue reading “PRO & Free, AARA-Plugin: Show data from monitoringapi.solaredge.com…”
The Plugin “TablePress” and the PRO version of the JSON Content Importer can work together in this way:
- Create a new TablePress-Table with e. g. two columns and two rows. Fill the cells with some dummy text. This gives you a shortcode
[table id=NUMBER_OF_TABLEPRESS_TABLE /]. - Create a new JCI-Plugin Template:
Name: tablepress
URL: http://api.json-content-importer.com/extra/json/meetup/1.json
twig-template:
name: {{_context.0.name}}
| 1a: {{_context.0.name}} | 1b |
| 2a | 2b |
Shortcode:
name: Love Breakfast
| 1a: Love Breakfast | 1b |
| 2a | 2b |
3. Insert {{_context.0.name}} in a table-cell of the Tablepress-Table. Then reload the page and you should see the JSON-data in the Table.
If the number of columns or rows is dynamic: Up to my knowledge TablePress has a fixed number of cols and rows. So this is not that flexible.
Maybe Table Sort is an option then.
JCI and Tablepress in Action:
name: Love Breakfast
| 1a: Love Breakfast | 1b |
| 2a | 2b |
Challenge:
Show current and forecast weather data via
https://api.openweathermap.org/data/2.5/onecall?lat={{lat}}&lon={{lon}}&exclude={part}&appid=….
for a searchable location.
Solution:
Use the above API for the weather at a location defined by lat and lon. Also use the openweather-geocoding API to transform a locationname into lat & lon.
In Action:
Augsburg (DE
, Bavaria
)
show on map
|
show weather
Augsburg (DE
, Schleswig-Holstein
)
show on map
|
show weather
Augsburg (US
, Illinois
)
show on map
|
show weather
Augsburg (US
, Arkansas
)
show on map
|
show weather
Augsburg (GY
, Mahaica-Berbice
)
show on map
|
show weather
See how this is done with a JCI-Shortcode:
[jsoncontentimporterpro nameoftemplate="openweather-forecast"]
With this JCI-template:
{% set su = "augsburg" %}{% if urlparam.su %}{% set su = urlparam.su %}{% endif %}
http://api.openweathermap.org/geo/1.0/direct?q={{su}}&limit=10&appid=...
{% set su = "augsburg" %}{% if urlparam.su %}{% set su = urlparam.su %}{% endif %}
<form action=".">
<input type=text name=su placeholder="Insert name of a location" value="{{su}}">
<input type=submit value="Search location and weather">
</form>
<hr>
{% for l in _context %}
{% if l.lat %}
{{l.name}} ({{l.country}}
{% if l.state %}
, {{l.state}}
{% endif %})
<a href="https://www.google.com/maps/place//@{{l.lat}},{{l.lon}},14z" target="_blank">show on map</a>
|
<a href="/openweather-forecast/?lat={{l.lat}}&lon={{l.lon}}&su={{l.name|e|url_encode}}">show weather</a>
<br>
{% endif %}
{% endfor %}