Ghost.js is a Node.js alternative to WordPress and other blogging CMS frameworks

Here we'll walk through how to make use of the supplied API that is available on every Ghost.js implementation in order to build custom dynamic post tag functionality

Why?

Dynamic tag generation functionality walks hand-in-hand with scalability

I looked around for an example Ghost.js site with dynamic tag functionality but couldn't find one

Using the Ghost.js API separates the men from the boys, the women from the girls

Ghost 0.8.0 API

Scratch-built but with some guidance from the Ghost.js spec

Using MixItUp to help present results

See it in action on the search page!

Ghost JS Tags

Dynamically display all tags:



    //Execute GET request against Tags endpoint
    $.get(ghost.url.api('tags'), { limit: 'all', order: 'created_at DESC' })
        .done(function (data) {

            //Tags success callback
            tagsOnSuccess(data);
            $('#MixItUpTags').mixItUp({
                selectors: {
                    sort: '.sort'
                }
            });
        })
        .fail(function (err) {
            console.log(err);
        });


Tags success callback:


function tagsOnSuccess(data) {
    var transfer = [];
    for (var key in data.tags) {
        var a = data.tags[key], entry = {
            name: JSON.stringify(a.name),
            url: JSON.stringify(a.slug)
        };
        transfer.push(entry)
    }
    if (transfer.length > 0) {
        var template = "";
        for (var key in transfer) {
            var b = transfer[key], url = (b.url).replace(/"/g, ""), name = (b.name).replace(/"/g, "");
            template += "<a class='tag-entry mix' data-order='" + name + "' href='http://www.postlib.com/tag/" + url + "'><span class='tag-entry'>" + name + "</span></a>";
        }
        $('.tags-mixitup-wrapper').append(template)
    }
}