PRO: API Zippopotamus, Shortcode-Parameter httpstatuscodemustbe200

The API http://zippopotam.us/ gives Citynames and Coorindates to a Zipcode. The JCI-PRO-Plugin can use that for a “Zipcode to City-Search”.

This done this way:



Examples: Houston, US, TX | Munich, DE, Germany

1 .JCI-Shortcode:

httpstatuscodemustbe200=no tells the plugin to accept also non-ok-API-answers

[jsoncontentimporterpro nameoftemplate="zip" httpstatuscodemustbe200=no]

2. JCI template:

  • url:
http://api.zippopotam.us/{% if urlparam.co %}{{urlparam.co}}{% else %}US{% endif %}/{% if urlparam.zip %}{{urlparam.zip}}{% else %}80636{% endif %}
  • urlparam4twig: zip#co
  • twig-template:
{% if urlparam.co %}{% set coun = urlparam.co %}{% else %}{% set coun = "DE" %}{% endif %}
<form action=/pro-api-zippopotamus-shortcode-parameter-httpstatuscodemustbe200/>
<select name="co" id=jciinput>
<option value="DE" {% if coun =="DE" %}selected{% endif %}>Germany</option>
<option value="US" {% if coun =="US" %}selected{% endif %}>United States</option>
</select>
<input type=text name=zip placeholder="Insert Zipcode" value="{% if urlparam.zip %}{{urlparam.zip}}{% else %}80636{% endif %}">
<input type=submit id=jciinput value="Search Zipcode for City">
</form>
<hr>
{% if places %}
<strong>Found:</strong><br>
<ol>{% for p in places %}<li>
<a href="https://www.google.com/maps/search/{{p.latitude}},{{p.longitude}}" target="_blank">{{ attribute(p, 'place name') }} ({{ attribute(p, 'state abbreviation') }})</a>
</li>{% endfor %}</ol>
{% else %}
{% if urlparam.zip %}
no City to this Zipcode {{urlparam.zip}} found
{% endif %}
{% endif %}
<style>
#jciinput {
    border-radius: 5px;
    width: 320px;
    height:35px;
    background: #eee;
 color: black;
}
</style>
<hr>
Examples: <a href="/pro-api-zippopotamus-shortcode-parameter-httpstatuscodemustbe200/?co=US&zip=77004">Houston, US, TX</a> | 
<a href="/pro-api-zippopotamus-shortcode-parameter-httpstatuscodemustbe200/?co=DE&zip=80636">Munich, DE, Germany</a>

PRO: param1 and param2 in the Shortcode

There is a special way to use the same JCI-Shortcode with small variations. E .g. having almost the same JCI-Shortcode on two pages with different languages .

In detail: Add param1… or param2=… to the JCI-Shortcode.

Example:

[jsoncontentimporterpro nameoftemplate="demoparam1param2" param1="value_param1" param2="value_param2"]

Effect: Both in the URL and the twig-template you can use the values of param1 and param2

URL in the template (no spaces or special chars in the param1 / param2 as the values are passed as is):
http://api.json-content-importer.com/extra/json/1.json?p1=##param1##&p2=##param2##&end=yes

Used URL:
http://api.json-content-importer.com/extra/json/1.json?p1=value_param1&p2=value_param2&end=yes

twig-template:

Twig-syntax for showing the complete JSON-data:<br>
{{ _context | json_encode  }}
<hr>param1: {{param1}}
<hr>param2: {{param2}}

In Action:

Twig-syntax for showing the complete JSON-data:
{"pricing_plans":[{"data":{"id":3,"name":"Pro","amount":"436.0","sms_allowed":3200,"created_at":"2016-03-29T06:52:43.945Z","updated_at":"2016-03-29T06:52:43.945Z","discount_percentage":"0.1","plan_type":"Paid"}},{"data":{"id":2,"name":"Basic","amount":"0.2","sms_allowed":3200,"created_at":"2016-03-29T06:52:18.253Z","updated_at":"2016-03-29T06:52:18.253Z","discount_percentage":"0.1","plan_type":"Paid"}},{"data":{"id":1,"name":"Lite","amount":"157.0","sms_allowed":3200,"created_at":"2016-03-29T06:30:57.117Z","updated_at":"2016-03-29T06:30:57.117Z","discount_percentage":"0.1","plan_type":"Paid"}}],"param1":"value_param1","param2":"value_param2","urlparam":{"zip":"","co":""}}
param1: value_param1
param2: value_param2

PRO: Upload and send Data to API

Your Challenge:
Offer a HTML-Form to your user for inserting some text and uploading a mediafile. The mediafile should be stored locally and displayed together with the text input. Also the text and mediafile should be sent to an API.


This is the way to achieve this:

Create two JCI-Templates.
JCI-Template 1:

  • templatename: uploadaddpic
  • URL: This must be a real API where you want to send the data (“dummyrequest” is not ok here)
  • method: CURL-POST
  • urlparam4twig: text1
  • twig-Template:
{{_context | json_encode }}

JCI-Template 2:

  • templatename: uploadmediafile
  • URL: URL to an API which gives all data you sent via this form. If not needed use “dummyrequest”.
  • method: CURL-POST
  • twig-template:
    get_data_of_uploaded_file: This JCI-twig-function returns $_FILES, a ‘superglobal’ PHP-variable where the HTTP File Upload variables are stored.
{% if urlparam.text1 %}
input text: {{urlparam.text1}}<br>
{% set picdata = get_data_of_uploaded_file('yourmediafile') %}
data of uploaded file: {{picdata | json_encode}}<hr>
{% set maxsizekb= 2*1024*1024 %}
{% if picdata.error==0 and picdata.size<maxsizekb %}
upload file is ok for saving in wp-medialib<br>
{% set jciaddkond='{"answer":"hello","urlparam":{"zip":"","co":"","text1":""},"apiresponseinfo":[]}' %}
shortcode for saving file: {{jciaddkond}}<hr>
{% set execsh = jciaddkond | doshortcode %}
shortcode-execution result: {{execsh | dump }}<br>
{% set execshArr = execsh | json_decode %}
{% set uploadedImgInWPLib = execshArr.apiresponseinfo.upload.attachment_url %}
<hr>{{urlparam.text1}}<br><img src="{{uploadedImgInWPLib }}">
{% else %}
mediafile not stored:<br>
picdata.error: {{picdata.error}}<br>
maxsize:  {{(maxsizekb/1024)| round(2)}} kB<br>
Bildgröße: {{(kondpicdata.size/1024)| round(2)}} kB<br>
{% endif %}
{% endif %}
 
<form action=/upload/ enctype="multipart/form-data" method=POST>
<input type=text name=text1 placeholder="Your example text">
<input type="file" name="yourmediafile">
<input type=submit>
</form>
  • urlparam4twig:
text1##yourmediafile

Use the JCI-Templates:

Place the following sortcode on the Page /upload/ (see <from action=…>” at twig-template JCI-Template 2, change this if needed)

[jsoncontentimporterpro nameoftemplate="uploadmediafile" orderofshortcodeeval=10] 

In Action, to avoid unwanted uploads this page is password protected:
http://api.json-content-importer.com/upload/

Ok, if you need a nice free plugin out of the box: Check https://wordpress.org/plugins/wp-file-upload/

Search JCI-Websites


Fatal error: Uncaught Error: Call to undefined function twig_call_macro() in /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig332adj/vendor/twig/twig/src/Environment.php(359) : eval()'d code:88 Stack trace: #0 /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig332adj/vendor/twig/twig/src/Template.php(394): __TwigTemplate_7b59c5b79ecf095c010fa281378acf2239afbd8fb32b2009ef3e2cdf519ea4e0->doDisplay(Array, Array) #1 /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig332adj/vendor/twig/twig/src/Template.php(367): JCITwig\Template->displayWithErrorHandling(Array, Array) #2 /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig332adj/vendor/twig/twig/src/Template.php(379): JCITwig\Template->display(Array) #3 /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig3 in /www/htdocs/w0135691/api.json-content-importer.com/wp-content/plugins/jsoncontentimporterpro3/twiglib/twig332adj/vendor/twig/twig/src/Environment.php(359) : eval()'d code on line 88