Creating A Plugin

This page explains how to create your own TUI plugin. We will use the example of Stuff.co.nz in the examples

1. Download the base plugin code

The files in this directory ( https://github.com/mfiers/TUI/tree/master/Plugin ) are the base plugin. All of these are required when you bundle the plugin - but you won't have to alter too much of them.

2. Create your custom script

Create a new javascript file in the plugin directory. Preferably called the website name (eg: stuff.js).
Open up this file for editing

3. Configure the script for the site

Our example is using stuff.co.nz- so we only want this to run on the stuff.co.nz site. The first code to write is to ensure we are on the correct website (check that the url matches stuff.co.nz). If this is true, then we want to register a function to be run when TUI is ready.
This is done by creating a function - lets call it loadStuff() - and then giving it to the TUI.onReady function.
TUI.onReady(loadStuff)

In this function you will need to tell TUI:

• What the id of this page is (can normally get it from the url) TUI.setTuiMeta(TUI.META_TUI_ID, id)
• What the id prefix of this website is (for stuff.co.nz we used stuff) TUI.setTuiMeta(TUI.META_TUI_ID_PREFIX, idPrefix)
• Where to inject the like display TUIView.injectLikeDisplay(element)
• Where to inject the comment display TUIView.injectCommentDisplay(element)

That is all you need to do. TUI will handle the rest (posting to twitter, displaying total like/dislike counts, etc...)

4. Configure manifest.json

This file tells Google Chrome what the plugin has in it. For your script to work you need to include the name of it in this file.
Add it onto the end of this array here:
"js": ["sprintf.js" ... "tui_view.js", "inject.js", "put_it_here.js"],

5. Build the plugin in Google Chrome