JCI and Elementor
You have an API which gives you many sets of data-items. This data should be displayed by using Elementor, a great plugin to design your pages. For the following you need the Elementor PRO Version, as dynamic data is used.
- You have a JSON with 1000s of books. And many authors writing books in another JSON. Each books has an unique book-ID, and also each author as a unique author-ID. These IDs are part of the JSON and connect an author with some books. And books with several authors.
- Quite similar is data with events and venues: At http://api.json-content-importer.com/extra/json/meetup/create-cpt.json you see a list of events.
Solution 1: Generate Custom Post Pages out of Custom Post Types and JSON. Then use the Elementor Theme Builder
At http://api.json-content-importer.com/pro-generate-custom-post-custom-post-fields-taxonomies-with-twig-and-json/ is described, how to create WordPress-Custom Post Pages: Set up a CPT, load a blueprint-page, create & update the data out of JSON.
In this example the blueprint-page is an ordinary page.
With the Elementor Theme Builder the “blueprint-page” can be overwritten by a Template using just the Custom Post Fields: See how this is done here in a very good video
With this, you don’t have to care about what content is set when creatrin the Custom Post Pages and no blueprint-page is needed.
- Start the Elementor-Theme Builder and add a “Single Post” Template. Edit the conditions for that Template: “Where Do You Want to Display Your Template?” is answered by the CPT “meetups”. Byx this any meetups-Custom Post Page is designed by this Elementor Single Post Template.
- Then design the Template and add Custom Post Fileds:
For Text-Fileds this is done by using the Elementor “Dynamic Tages” where you can select the Custom Post Field-Type (Pods, ACF, Woocommerce…) and then the Custom Post Field-Key.
Solution 2: Use JCI-Shortcodes with Elementor
This is nice if you don’t want to create Custom Post Pages but display the JSON-API-data right out of the box:
You can use the WordPress-Shortcodes with the Elementor-Shortcode-Widget. Therefore you can add a JCI-Shortcode like [[jsoncontentimporterpro. nameoftemplate=…]] to a Elementor-Page by copypasting it via the Elementor-Widget “Shortcode” to the page.