This is the documentation for the WordPress plugin Aoi Tori created & maintained by Paul Robinson.
This plugin helps you display your Twitter timeline on your website via a simple widget or, for more advanced users, a PHP function that can be placed anywhere in your active theme.
Using this plugin you can easily change the colors of various Tweet features (@replies, hashtags), select a template for displaying tweets and even customize the margin/padding. For more advanced users you can add your own custom CSS (or use SCSS syntax) and even create your own template using the built in template editor.
Table of contents
- Features
- Requirements
- Installation
- Setup
- Usage
- Options
- Template Customization
- Developers
- ToDo
- Bugs
- Support
- License
- Refunds
- Miscellaneous
Features
- Simple authorization with Twitter
- Custom options page
- Easy to use widget
- PHP Function - for more advanced users
- Pre-Built tweet display templates
- Custom Templates - for more advanced users
- Easily customize colors
- Easily customize margins/paddings
- and more...
Requirements
Due to some of the technologies used in the creation of this plugin it will only work if you have the prerequisites required. There shouldn't be anything here that your host doesn't already have readily available as most of these are pretty common, but they are listed here in case you wish to query your host about them.
- PHP 5.3.10 or greater (PHP 5.5 is recommended)
- cURL PHP Extension
- cURL must be able to make HTTPS calls to securely contact Twitter
Installation
Because this is a premium plugin and is not hosted by the WordPress plugin directory you cannot install it by finding it in your WordPress dashboard and clicking install. Thankfully though there is still a very easy way to install this plugin.
- Login to your WordPress admin
- Go to
Plugins
→Add New
- Click Upload Plugin
- Click the button and select the zip file you downloaded when you purchased the plugin
- Click the upload button
- That's it, just hit activate and the plugin will be ready for you to set up
If you prefer, or for some reason you are unable to use the plugin upload installer, you can install the plugin the old fashioned way. Using FTP. If you are familiar with FTP this should be a cinch, but here are some quick instructions.
- Login to your server via FTP/SFTP (SFTP is highly recommended)
- Navigate to the root of your WordPress install, depending on your host you may already be there, or it may be in a folder called
public_html
,htdocs
, orwww
- Navigate to wp-content/plugins
- Upload the contents of the zip file you downloaded when purchasing the plugin into that folder
- Login to your WordPress admin
- Go To Plugins
- That's it, just hit activate and the plugin will be ready for you to set up
On activation for the first time the plugin will load a splash screen to give you a brief run down of the features available. This will also be used on major updates to highlight any new features, similar to the way WordPress use it on major version updates.
Setup
Setup is simple, once you have installed the plugin using the instructions above. Visit Settings
→ Aoi Tori
to setup the plugin's options.
First visit the License tab and input the license code you received when you purchased the plugin. You will have been presented with the license code on the completed purchase screen, but you will also have received it via your purchase confirmation email. This license will allow you to update the plugin for free, for life. For more information on the license please visit the License section.
When you visit the plugin's option page you will see instructions on how to obtain and use your Twitter application keys. Please follow those to complete the setup of the plugin. For reference here are the instructions.
- Go to the Twitter Application Management website. Click
Create New App
. - Enter details based on the following.
- Name: The name for your application. Can be whatever you wish, but cannot include the word Twitter.
- Description: A short description for your application. Again, can be whatever you wish.
- Website: Just enter your home web address.
- Callback URL: Leave this field blank. If you fill this field in it
willmay cause an error, please leave it blank.
- Read & agree to the developer terms and press
Create your Twitter application
. - Click on the
Keys and Access Tokens
tab. Now copy:- Consumer Key
- Consumer Secret
- Access Token
- Access Token Secret
- Go back to the plugin's options page and click the
API Keys
tab. Enter these keys in the relevent fields & hitSave
- After you hit
save
the page will reload. Please check the small status message displayed under the keys to see if your keys were valid or not. It should display a green message if successful. If it displays a red message please refer to the support section at the end of these docs for help. - If you wish you can go back to the Twitter Application Management and click
Change App Permissions
and set them toRead only
as Aoi Tori does not need write permissions.
Once you have saved the keys and they have been deemed valid you can display your Tweets on your website using 2 different methods.
Widget
You can use a widget to display your tweets. To do that follow these instructions.
- Go to
Appearence
→Widgets
- Open up the widgetized area you wish to add the widget to
- Look for the
Aoi Tori Widget
in the list of widgets to the left - Drag the widget over to the widgetized area you opened previously
- Adjust the options as needed
PHP Function
More advanced users that are familiar with PHP & their theme can use the PHP function provided to have the tweets output anywhere you wish, not just in a widgetized area.
To use the function just use twitterStreamOutput($args, $echo)
somewhere in your theme. I advise creating a child theme if you are using a purchased or WordPress theme directory theme as any updates will wipe edits such as this. More on creating a child theme can be found in the WordPress Codex.
More information on the parameters that can be passed to the function can be found in the Usage section.
Note: Currently the widget & PHP function use the options you have set via the options page, other than changing the options passed to Twitter it is currently not possible to override the options page settings such as colors and template used. The ability to do this via the PHP function may be added in a future update. There are no plans to add the same feature to the widget, but if demand is high enough it may be added.
Usage
Using the widget is very simple. Just add the widget to a widgetized area in your theme, as described above, set your options and you are ready to go. Hints are built into the widget so there is no need to reference this file if you use the widget. However if you are using the PHP function it has a few options available.
twitterStreamOutput(array $args, bool $echo)
The PHP function has two parameters. The first should be passed as an Array
and can contain any of the options listed below. It determines the data returned from Twitter. The second parameter should be a Boolean
and determines if the data returned should be echoed straight to the page or returned for further processing.
Note: Returning Data
If you choose to return the data instead of echoing it will not be passed through the templating system and will instead return the raw data from Twitter. This is so you can process the data as you wish.
- screen_name
- Place a Twitter Screen Name in this option to display the tweets of that user. This can be any username, but trying to display the tweets of a private account will produce an error from Twitter. The only exception is if your tweets are private and you have created the app which authorized Twitter. Default:
empty
- count
- Determines the number of tweets returned from the Twitter timeline. This can be any number up to 3200. Default:
10
- exclude_replies
- If set to false this will exclude any tweet that starts with a reply to another Twitter screen name. Tweets that contain a mention anywhere else in the tweet will still be returned. Note that Twitter removes replies after retrieving the tweets so if this option is set to false Twitter may return less than the total number of tweets you requested. Default:
false
- include_rts
- If set to false this will exclude retweets. As with replies if this option is set to false the retweets are removed by Twitter after retrieving the tweets so Twitter may return less than the total number of tweets you requested. Default:
false
- cache_time
- Determines how long the data returned from Twitter should be cached for. Data is cached using a WordPress transient. The cache time you specify is passed to the expiration parameter of the
set_transient()
function. Since it is provided in minutes it is converted to seconds using theMINUTES_IN_SECONDS
constant. Default:30
Options Page
The options available in the options page are mostly self explanatory however they are listed here for a more detailed look at what each item does. They are split into their tabs. Note that the Instructions & FAQ tabs are missing as they are just there for information purposes.
API Keys
- Consumer Key
- This holds the Consumer Key generated by Twitter's Application Management system. It is used (along with the 3 other keys) to authorize you with Twitter to retrieve data from their API.
- Consumer Secret
- This holds the Consumer Secret generated by Twitter's Application Management system. It is used (along with the 3 other keys) to authorize you with Twitter to retrieve data from their API.
- oAuth Access Token
- This holds the oAuth Access Token generated by Twitter's Application Management system. It is used (along with the 3 other keys) to authorize you with Twitter to retrieve data from their API.
- oAuth Access Token Secret
- This holds the oAuth Access Token Secret generated by Twitter's Application Management system. It is used (along with the 3 other keys) to authorize you with Twitter to retrieve data from their API.
- Token Validity Check
- This checks your keys by making a simple request to Twitter's verify credentials endpoint. If Twitter returns user information and a HTTP 200 then all is okay and the message turns green. If not it will go red.
Template
- Tweet Template
- Use this to select the template used when displaying tweets. There are currently 3 built-in templates to choose from.
- List Style: Uses a standard unordered list styled to have no bullet points. Your theme's default styling should take over and provide the majority of the styling needed. Some themes do not have different styling for lists in widgetized areas, if this happens please use the margin/padding options to adjust the spacing as needed.
- Paragraph Style: Uses paragraph tags for each tweet. Good for footer widgets or areas where paragraphs would be more suitable.
- Media Object Style: Uses a media object layout as made popular by the Bootstrap framework. The styling built into the plugin will create the Media Object layout, but your theme styling will do the rest.
- Enable Custom Template
- Use this option to enable the custom template. This will override whichever built-in template has been selected with the code shown in the
Template Code
option. - Template Code
- This box, when the option above is enabled, runs the code typed into the box through the Twig template renderer instead of the built-in template selected. There is only 1 variable available to the template, that is the
tweets
object returned by Twitter. You can see the data returned by twitter on their Developers website. For more information check the Custom Template section below.
Styles
- Hashtag Color
- Changes the link color of hashtags displayed in a tweet.
- Hashtag Hover Color
- Changes the hover link color of hashtags displayed in a tweet.
- @reply Color
- Changes the link color of @replys displayed in a tweet.
- @reply Hover Color
- Changes the hover link color of @replys displayed in a tweet.
- Hyperlink Color
- Changes the link color of Hyperlinks displayed in a tweet.
- Hyperlink Hover Color
- Changes the hover link color of Hyperlinks displayed in a tweet.
Advanced CSS
About Margins/Paddings
Please note that the margin/padding options available rely on the classes assigned by the built-in templates. If you choose to use a custom template you will need to use the custom CSS box to apply your own CSS to your template as the margin/padding options will not be able to apply due to the lack of the correct CSS classes.
- Tweets Container
-
- Margin
- The margin applied to the container that contains all tweets. Margin is applied to the outside of the element. Must be in a valid CSS format. For example: 5px 3px 5px 3px
- Padding
- The padding applied to the container that contains all tweets. Padding is applied to the inside of the element. Must be in a valid CSS format. For example: 5px 3px 5px 3px
- Tweet Container
-
- Margin
- The margin applied to the container that contains a single tweet. This element is inside the Tweets container mentioned above and is repeated for each tweet found. Margin is applied to the outside of the element. Must be in a valid CSS format. For example: 5px 3px 5px 3px
- Padding
- The padding applied to the container that contains a single tweet. This element is inside the Tweets container mentioned above and is repeated for each tweet found. Padding is applied to the inside of the element. Must be in a valid CSS format. For example: 5px 3px 5px 3px
- Custom CSS
- You can use this box to add any custom CSS you like. This is a great place to put custom CSS should you wish to apply extra styling to your tweets, to customize the built-in templates, or to apply CSS to a custom template you have created. CSS entered in this box will be maintained over updates. Tip: The custom CSS box also supports the SCSS syntax so you can use features such as selector nesting.
Template Customization
You can create a custom template to display your tweets using the custom template option available via the options page. The template system used is the wonderfully simple Twig templating language that a lot of developers are already familiar with. If you aren't familiar with it, it is very similar to Laravel's Blade. Discussing how to use Twig is too large a subject for this documentation so you can read more on Twig on their website.
The template is passed a single variable by the render method. That variable is called tweets
and contains the raw object returned from Twitter. Because of that you have access to all of the data Twitter returned and can output any data you would like from it. To find out all of the data returned you can see a JSON version of the output on Twitter's Developers website. It is important to note that both objects and arrays alike are accessed through dot notation when using Twig, there is no distinction between the two.
There is a example of the code you might use for a custom template already written in the box by default, please use that as a helper for how to create your own. If you would like any help with creating your own template please feel free to send a support request to support@return-true.com, however note that it will not be treated as urgently as bug/support requests.
Along with all of Twig's regular filters there is also one extra custom filter defined by the plugin. This filter called process()
expects a single parameter which should be a single Tweet object, because of that it should only be used when looping through each tweet. This filter processes each tweet and replaces textual Hashtags, @replies and URL with hyperlinked versions. The filter has some extra parameters which allow you to choose if certain items should not be processed.
process(object tweet, bool hashtag, bool atreply, bool url)
process()
expects the tweet as its first parameter. The last three parameters expect a boolean (true/false) value and represent whether or not the hashtags, atreplies, and URLs should be processes respectively. They are all true by default. If set to false the textual representaion of each item will be left intact instead of converting it to a hyperlink.
Developers
This plugin makes use of Composer to autoload classes. Because this is a WordPress plugin and end-users may have little to no knowledge of how to use Composer, the Composer dependancies have been included in the plugin instead of requiring a composer update
to get them. Classes are autoloaded from the vendor folder, as is usual, but they are also loaded from the lib folder. If you are tinkering and are confused as to how some Classes seem to be 'magically' available, the autoloading is the trick to that.
You are free to make to make any modifications to the plugin you wish. Just remember that unless you make a custom copy you will lose any changes if the plugin is updated. You are not, however, permitted to make changes and then redistribute or sell them.
ToDo
This is a list of features that are planned to be added in future versions. There is no particular order, they will just be done as I am able to get to them. Easier/simpler ones will likely be completed first as they naturally take the least amount of time.
- Add the ability to load a custom template from the currently active theme directory as a third alternative to the built-in templates and custom template box.
- Add ability to override options page options via the PHP function call.
Bugs
This is a list of known bugs/issues in the plugin. They will always be minor but will always be fixed in order of seriousness. The plugin will never be released/updated with a known blocking (breaking) bug. If you find a bug please use the email address shown in the support section below to email me as soon as possible.
- Partially visible URLs, generally only seen in Retweets, are hyperlinked. There may however be edge cases where they do not work correctly due to how hyperlinking is implemented. Keep an eye on this one.
Support
If you have any issues, problems or questions I will try my best to help you out as quickly as possible. Here are the best ways to get in touch.
- You can email me at support@return-true.com.
- Support System
- You can use our support ticket system to report a bug, issue, or if you are having trouble getting something to work.
I normally respond as soon as I can, but I give 24-72 hours (3 working days) as a benchmark time for responses.
License
The license provided with this plugin is required to allow you to update the plugin to any new version that is released. Without the license you cannot update the plugin. This license key is displayed after purchase and is set to you via email in the purchase confirmation email. Please keep it safe. If you loose it please contact support and we will try to help you out.
A license will allow you to update the plugin and you may use the license on as many domains as you wish. License uses are tracked each time it is used on a new domain. Your license may be disabled without warning if it is used too activate too many domains too quickly. If this happens you will see a message when trying to save your license key, in this situation please contact support to find out more.
Refunds
Refunds are available within 7 days of purchase, if you change your mind. After that period a refund will only be given if you can show that the plugin is not fit for purpose and you have allowed for a reasonable attempt at fixing the issue.
Miscellaneous
You may have noticed that this plugin has an odd name. It was originally going to be called Twitter Stream Pro as the free version of this plugin is called Twitter Stream. However the plugin is now so far from the original free version in features, and I was worried about using the name Twitter in a commercial plugin, that I decided to rename it.
Aoi Tori (Kanji: 青い鳥 / Katakana: あおいとり) is Japanese for Blue Bird. I am currently learning Japanese and thought it was an interesting name for the plugin. Plus it is still related to Twitter since we all recognise the famous blue bird that Twitter use for their branding. So there you go, now you know why the plugin is called Aoi Tori.