A light weight blog that can be ran from static webhosting using an API driven CMS service
1 person uses it

I/O Content Blog

A simple HTML, JS and CSS blog backed by I/O Content API driven CMS

This simple blog is the official I/O Content blog code, and an example of how I/O Content can be used to manage content for websites. You can also use this example to run your blog using content in your I/O Content account. The blog includes optional Disqus comments integration

The Demo is hosted on Amazon S3 using S3's static website feature. It could also be hosted on GitHub pages or any other static website hosting.

This blog uses simple HTML, JS and CSS, backed by the I/O Content API which serves content entries in response to a query sent over an HTTP GET request using the io-content-js library.

The required files required to run this blog are the index.html, template.html, app.js, style.css and the bower_components folder.

alternate text

Note this blog is not available as a bower package, and all dependencies have been copied to the respository so you can simply copy deploy this website on any web server. This will not run from the local file system, so you will need to run via your local web server (e.g. Apache / IIS) to test.

Configuring ths blog

This example pulls content hosted in our 'blog-example' sub account. You'll need to set up you're own sub account and content types and edit the sample as appropriate. Full documentation for I/O Content describes how to manage content, set up content types and query the API.

Once you have an account at I/O Content, open up app.js and edit blogConfig at the top of the file:

The dependencies for this project are:

All dependencies are commited to this repository so there will be no need to reinstall from bower.

Note that I/O Content is queried via REST API, and io-content-js simply assists with making cross domain requests compatible with all major browsers.

How content is loaded

API Query

The core content fetch code is as follows:

1. Set up the content client

2. Request a list of content entries and load the first into view

Content Assets

Content Assets managed in I/O Content are loaded from our CDN using plain HTTPS urls. Where requesting images, our CDN offers 'on the fly' image resizing, specified here using the ?maxHeight=80 query string argument. Resized images are cached in the CDN for fast load times.

Other file types are also served over the CDN in the same manner.

Which retrieves the following image:

io content logo

comments powered by Disqus
This page was last updated almost 3 years ago.