How to integrate Vanilla WordPress plugins and widgets
Our latest release, as of this post date, comes with many new features including a suite of WordPress plugins and widgets to help you better integrate Vanilla Forums with WordPress. In this tutorial I will walk you through the basics steps required to install, enable, and integrate these plugins.
What we will cover
- What’s including in the suite
- Where to find the plugins
- How to install and activate
- Forum Administration
- <embed> Vanilla plugin
- Vanilla widgets – Discussions, Activity, Users
What’s included in the suite
- <embed> Vanilla plugin – Allows you to embed your Vanilla forum into WordPress with a single line of code.
- Discussions widget – Displays recent discussions.
- Activity widget - Displays recent activity.
- Users widget – Displays recently active user profile photos.
Where to find the plugins
The WordPress plugins are bundled with Vanilla v2.0.17 and can be downloaded from the Dashboard.
- On the left Menu Panel under “Addons” click on “<embed> Vanilla”.
- Once on the <embed> Vanilla page you will find at link at the top right “WordPress Plugin”.
- Click on link to download.
Or, you can download the plugins suite from WordPress.org
How to install and activate
If you already know how to install and enable a WordPress plugin you can skip this section. If you are new to WordPress, or have never installed a plugin before follow these simple instructions.
How to install
- Download the plugin (see above)
- Unpack the “vanilla_wordpress.zip” archive
- Upload the “vanilla-forums” folder to “/wp-content/plugins/”
- Activate the plugin through the “Plugins” menu in WordPress
How to activate
After following the above directions go the “Plugins” menu in WordPress. On the plugins page look for the Vanilla Forums plugin and click “Activate”.
Once activated look for the “Vanilla Forums” menu option on the left panel inside WordPress to find configuration settings.
In order for the <embed> Vanilla plugin or widgets to access information from your forum you need to tell WordPress where your Vanilla Forum is located and validate it. Once you validate your forum, the “<embed> Vanilla” and “Widgets” options will appear below the “Vanilla Forums” WordPress plugin menu.
To validate your forum
- Go to the “Vanilla Forums” menu option on the left panel inside WordPress.
- Click on “Forum Administration”.
- Enter the url of your Vanilla Forum (eg. http://yourdomain.com/forums)
- Click Validate and Save
<embed> Vanilla plugin
Just like embedding a YouTube video, you can now place your Vanilla Forum into your site with a single line of embed code.
First you will need to configure the <embed> Vanilla plugin inside your Vanilla Forum Dashboard. The <embed> Vanilla plugin is a core feature of Vanilla version 2.0.17 or greater. If you are using an older version you will need to either upgrade to the latest release of Vanilla or download the <embed> Vanilla plugin.
- Go to “Embed Vanilla” under “Addons” in the left panel of your Vanilla Dashboard.
- Copy embed code to your clip board.
- Choose your embed theme.
- Set remote url options.
To embed your Vanilla Forum into WordPress, use the forum embed code. To copy the embed code click inside the Forum <embed> Code box , select all the code, and copy. You will need this code when you get back to WordPress.
You can use any theme you want, however we recommend that you use the Embed-Friendly theme. This theme is specially designed to fit all screens and is easy to customize. The Embed-Friendly theme comes bundled with the plugin.
For more information on theming see “The Ultimate Theme Guide“.
Remote url options
Similar to the Forum Administration option in WordPress, we need to tell Vanilla where our forum will be embedded. We can also set some advanced features.
- Dashboard Embed – By default if you embed your forum the Dashboard will be embedded as well. If you check this box, the dashboard will open in a new window.
- Remote Url - You can force your forum to only be viewed from within your WordPress site. If a user attempts to access your forum via it’s domain (eg. http://yourdoamin.com/forum), they will be redirect to the embedded version (eg. http://yourdomain.com/wordpress/discussions).
Once we have configured our Vanilla Forum we can go back to WordPress.
In WordPress under the “Vanilla Forums” menu option click on “<embed> Vanilla”.
- Determine the location (page) in WordPress where we want to embed our forum.
- Enter the embed code we copied from the Vanilla Dashboard.
Once you have entered all the information click “Save Changes”. The plugin will now automagically create a page in WordPress called “discussions” (if that is what you chose) and put the embed code in it.
View and preview the page to see your new embedded Vanilla Forum! See it in action on our blog!
Vanilla Widgets – Discussions, Activity, Users
Currently we there are 3 Vanilla widgets available that display information from 3 common views (pages) in Vanilla: Recent Discussions, Recent Activity, and Recently Active Users. If you are new to WordPress you can learn more about widgets and widget ready themes on the WordPress codex.
To configure the Vanilla widgets
- Go to “Appearance” inside you WordPress dashboard.
- Click on “Widgets”.
- Drag widgets (one at a time) to your preferred “Widget Area”.
- Click arrow at top right of each widget to show setting.
- Number of Discussions
*Example from boagworld
- Number of Activities
- Number of Users
- Icon width (user photo)
This is only the first version of the Vanilla WordPress plugins and widgets. We are currently developing new features. Let us know what you think? What can be added? What can make it easier for integration?
If you’re looking for a high profile example of a WordPress integration, check out boagworld.
- The Ultimate Theme Guide for Designers
- <embed> Vanilla Documentation
- Single Sign-on Documentation
- Vanilla Community