Kingsley eLearning Solutions

You have big dreams for your eLearning.
We'll make them come true.

image of Kingsley

Add Custom Tools to Articulate Toolbar with SDK

Submitted by Kingsley on Mon, 03/15/2010 - 12:21

One of the coolest features of the Articulate SDK is the ability to add your own tools to the Toolbar along the top of your course.  Some of the tools I have seen are voltage calculators, feedback forms, live charts, etc. This is also where I often put tools such as custom navigation.

In this post I will walk you through the steps to add your flash file to the Articulate Toolbar. This tutorial assume you have access to a Flash file and can edit it’s ActionScript. If you don’t have a file you can download the files I am using in this demo.  And don’t worry… you don’t have to be a hardcore, up-all-night, bawls-swilling, hacker-geek, I will give the code you need, so just copy-n-paste! Download this zip file to get all the resources. Keep in mind this is a sample file; all the Articulate related code works, but it will not actually send feedback anywhere.

From a high level view here is what we need to do.

  • Edit art_plugins.xml
  • Add Articulate SDK hooks
  • Add functions to hide/show your tool
  • Some Clean up.


Edit art_plugins.xml

One of the first things Articulate does when launched is look for a file named art_plugins.xml. If it finds this file, it loads any tools (or tabs) that are listed in it.

Chances are your course does not have an art_plugins.xml file. Don’t worry about creating one from scratch, you can use the one I included with the demo files. You will need to put this file and your .swf into your published course’s “player” folder. Watch the Screenr below to see how to customize it:

Add Articulate SDK hooks

Now that you have your Flash file loaded into the player, you need to let Articulate tell it what to do.

There are two things that Articulate looks for inside your Flash file: 

  • artModuleIsActive - A variable that declares if your tool is active
  • artModuleAPI(command) - a function that accepts commands to activate/deactivate.

Again… don’t worry about trying to write this code yourself. Use the code I put in frame one of the .fla file your downloaded. After watching the screenr below you should understand what the code is doing and how we plan to use it.


Add functions to hide/show your tool

OK, so now we have it setup so that our code will let Articulate know when the tool is active and we are listening for commands from Articulate. We need to write some functions to show/hide our tool when Articulate tells us to.  We will also want to hide it when it loads the first time or it will just be hanging out on the screen when the course launches. All this code is in the .fla and in this screenr I will explain what each function is doing.

Clean up

Alright... Everything we have is functional but there are still some tweaks we can make to improve the users’ experience.  Most of this is just adding the little touches that folks have come to expect from an application. For instance; when we click the ‘send’ button we expect the window to close. The same thing goes for clicking the toolbar button while the tool is open; we expect it to close.
To make the experience smoother I would suggest you mimic Articulate’s behavior. In this version I animate the tool sliding up and down. I didn’t have to write a bunch of code, instead I used an ActionScript Class that is free for anyone.
One important note here. For some reason Articulate calls the ‘activate’ command immediately after sending the ‘deactivate’ command. My solution to this is included in the screenr below.


Submitted by Brisco (not verified) on Thu, 12/02/2010 - 16:38


Just had a quick question concerning the script. Great script by the way.

Did you ever come up with scripting that would handle the out function? One that would make the flash ease out vs disappearing abruptly? Let me know your thoughts.



Submitted by sophie09 (not verified) on Fri, 08/31/2018 - 08:55


This looks important detail which needs some relevant and important stuff to read some importance should be given here which can provide a proper access never seen a work being presented in way which can calculated in way which which can help me deal with things which were pretty prominent stuff to read here.

Submitted by Gagan Deep (not verified) on Tue, 11/13/2018 - 05:40


Do you want to know a course that can give you good earnings? Become expert in technical training Institute in the Best Printer, Computer, LED LCD Tv, AC and Mobile Repairing Course in Laxmi Nagar. So join ABC Mobile Institute of Technology Delhi this time and get admission with bet offer running. Contact us at 9990879879. For info -

Submitted by Gagan Deep (not verified) on Tue, 11/13/2018 - 07:50


Get chance of job or business after the course. Join for the Best LED LCD Tv, AC, Printer, Laptop and Mobile Repairing Course in Delhi. We provide quality training at affordable fees. Join now and avail discount benefits also. ABC Mobile Repairing Courses is successfully training students since a long time. Contact us at 9990879879. For more info -

Submitted by Gagan Deep (not verified) on Tue, 11/13/2018 - 07:51


Practice and train yourself with the Best LED LCD Tv, AC, Printer, Laptop and Mobile Repairing Course in Delhi. Join us and get flat 20% discount on the course fees. Free Demo classes available. ABC Mobile Institute provides the best service in Computer, CCTV and Camera repairing training in Delhi. Contact us at 9990879879. For more info -

Submitted by Mannu Aryan (not verified) on Wed, 12/12/2018 - 06:26


this tutorial is always helpful ! Whenever I have to add the custom tools, I follow your tutorial for the same.. keep up the good work :)

Submitted by Deanna Williams (not verified) on Sat, 12/22/2018 - 07:00


We are famous in the leather industry with our best quality of leather and its stuff we are providing service from all over the world with shipping specially free shipping in the USA, CANADA, AUSTRALIA, and the UK we have our official website from where you are placing your order in a discount price so visit our website which is

Add new comment

This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.

Enter the characters shown in the image.