Embed data from your API into your WordPress site

The Kimono Wordpress Plugin allows you to easily embed KimonoBlocks in your wordpress site. KimonoBlocks are embeddable blocks that display the latest data from Kimono APIs on your own site. An example embedded block looks like this:

With the Kimono Plugin, you can create a block in one of two ways:

  • Insert a KimonoBlock or API URL. (OEmbed)
  • The [kimono] shortcode

 

Installation

We recommend installing the Kimono Wordpress Plugin through Plugins > Add New in the Wordpress administration interface. Or, if you would rather install from a zip, download it from the Wordpress Plugin Directory.

OEmbed

OEmbed is the simplest way to get started with Kimono content on your Wordpress site. Simply put a link to a Kimono API or a KimonoBlock on a line by itself in your post. For example:

Check out this great Kimono API:

https://www.kimonolabs.com/api/{API_ID}

That was a great API.

Or use a KimonoBlock URL, including style parameters to customize its appearance. (Learn more about styling KimonoBlocks)

Check out this stylish Kimono API:

https://www.kimonolabs.com/kimonoblock/?apiid={API_ID}&apikey={API_KEY}&title=one property single&titleColor=ffffff&titleBgColor=659fc0&bgColor=ffffff&textColor=6b7770&linkColor=659fc0&propertyColor=dddddd

That was a stylish API.

That's all it takes! Check out the Wordpress Codex on Embeds for more information.

Wordpress [kimono] Shortcode

You can also embed a KimonoBlock using the kimono shortcode:

[kimono api={API_ID}]

The shortcode is easy to use and allows a lot of control over how your content is embedded. A fuller example could look like this:

[kimono api={API_ID} apikey={API_KEY} width=300 height=200 title="My Awesome Block" titlecolor=8c5d11 titlebgcolor=95bfbf]

Shortcode Attributes

Just like with KimonoBlocks, you can customize the KimonoBlock inserted by a shortcode to match the style of your website by changing various color values and the title text. These can be specified in the shortcode itself or through the Plugin's Settings page in Wordpress. The full list of properties you can customize looks like this:

AttributeDescription
api Use this to change the API you want to pull data from.
apikey Use this to change the API_KEY you want to use.
title Edit the title text of your KimonoBlock
titlecolor Change title text color
titlebgcolor Change top band (title background) color
propertycolor Change property label color
bgcolor Change the background color for the main content area
textcolor Change the main text color
linkcolor Change the text color for hyperlinks
width Specify the width in pixels
height Specify the height in pixels

Kimono Wordpress Plugin Settings

The defaults values for the shortcode attributes can be changed through the Settings page for the Kimono Wordpress Plugin. This allows you to create a standard style for all the KimonoBlocks you use across your site.

Note that these settings do not apply to OEmbed, only to the shortcode.

Powered by Zendesk