Tierra Innovation: Wordpress CMS Project
Billboard Manager
v 1.12The Tierra Billboard Manager plugin for WordPress offers a single, customizable “billboard panel” through which publishers can present images, animations, audio and video files to tout content they wish to bring to their visitors’ attention. An administration panel allows content creators to create multiple playlists with custom presentation styles for use in posts and page templates, and a simple menu and control panel allow visitors to browse each billboard within a rotating playlist. Each asset can be linked to any URL, whether its within the current blog or an external Web site.
Short Code Examples
Billboard Playlist:
If you are looking to embed a playlist within a page / post, you can use the following short code.
1 | [ti_billboard name="Billboard Demo"] |
The name of your billboard is referenced back to the database, where all of your saved settings (color, navigation, title card overlay, etc). You’ll never need to update your shortcode again should you make a style change or adjust settings.
Single Audio Track:
If you are looking to embed a single asset within a billboard, you can use the following short code.
1 | [ti_billboard media="242"] |
Please keep in mind that if you use a single asset that is not its own playlist, you will have to copy / paste all of the shortcode that is generated each time you make an update. Single assets do not save billboard settings like a playlist does, so you’ll need to make sure you include everything within your WordPress post. See the following example:
1 | [ti_billboard media="242" width="450" height="290" delay="9" autoplay="0" repeat="0" background="0x000000" navigation="0xffffff" titlebarcolor="0xcccccc" titleTextColor="0x000000" glow="0x000000" overlay="1" justify="center" keeptitles="1"] |
Our advice is, that if your billboard only has a single media file within it, save it as a playlist so you don’t have to worry about changing the shortcode should you want to make a skin change.
Templates:
You can embed a billboard playlist into any WordPress template. By setting the title of your saved playlist in your template code, it will inherit all of your saved settings. If you change those settings, it will automatically reflect out on the page it is embedded.
1 2 3 4 5 | <? if (function_exists ("ti_bbm_print_player")) { print ti_bbm_print_player (array( "name" => "tierra" )); } ?> |
To embed a single asset item from your billboard, here are all of the options you can set to customize your player. You can only save options for a playlist, thus you will need to enter your values into the template if you want your billboard to resemble a playlist billboard.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | <? if (function_exists ("ti_bbm_print_player")) { print ti_bbm_print_player (array( "media" => "1", "width" => 440, "height" => 280, "repeat" => 1, "delay" => 8, "autoplay" => 1, "background" => ffffff, "navigation" => 000000, "glow" => 9999ff, "overlay" => 0, "titles" => 1, "titlebarcolor" => 000000, "titletextcolor" => ffffff, "thumbnails" => 1, "keeptitles" => 0, "justify" => left, "rollovers" => 1, "titlesonrollover" => 1 )); } ?> |
Custom Template Variables
If you are embedding a single asset file, the below template variables can allow you to customize your single asset billboard. You will not be required to set all values if you plan to leave some as the default. Only specify override values in your template code. The above example shows all variables which can be set, so you can use that as a guide to update as needed.
media: this is the id number of an individual billboard item. You can gather this information by clicking any preview / embed link next to any asset.
width: the width of the player, specificed in pixels. The default value set is 440.
height: the height of the player, specificed in pixels. The default value set is 280.
repeat: specify whether you want the billboard to continue cycling content indefinitely or stop after the last asset is played. The default value is 1 which sets the player to auto repeat. Setting it to 0 if you want the billboard to stop after the last asset.
delay: the mount of time between each asset item. This does NOT apply if you have loaded an audio or video file. Those files will play until completed. For static images / content, delay applies here. The default value is 8 (seconds).
autoplay: start the player once the page loads. The default value set is 1 (yes). Set it to 0 to require users to click play first.
background: set the background behind the billboard. The default value set is ffffff (hex).
navigation: set the background behind the navigation bar. The default value set is 000000 (hex).
glow: set the highlight color on each navigation orb. The default value set is 9999ff (hex).
overlay: specify how you want the navigation to appear. The default value set is 0, which fixes the navigation at the bottom of the billboard. Setting it to 1 will float the navigation on top of your content, expanding the viewing region of the billboard content.
titles: specify whether you want title cards to show when each asset has loaded. The default value set is 1, which shows the title cards. Setting it to 0 will omit the title cards from loading.
titlebarcolor: set the background of the title card. The default value set is 000000 (hex).
titletextcolor: set the font color of the text within the title card. The default value set is ffffff (hex).
thumbnails: specify whether you want a WordPress generated thumbnail to show within the title card. The default value set is 1 which will show the thumbnail. Setting it to 0 will omit it from tht title card window.
keeptitles: specify whether you want the title cards on the screen at all time. The default value set is 0 which will not keep them at all time. Setting it to 1 will keep those title cards loaded at all times.
justify: set the text justification within the title card. The default value set is left. You can also specify ‘center’ or ‘right’ as options.
rollovers: show each asset’s title card when you hover over a navigation orb. The default value is set to 1 which shows the title card of each asset on orb hover. Setting it to 0 will not display the title card on orb hover.
titlesonrollover: show the current asset’s title card when you hover over the billboard. The default value is set to 1 which shows the title card of the current asset on billboard hover. Setting it to 0 will not display the title card on billboard hover.
Supported File Types / Limitations:
Image formats:
- PNG
- JPG
- GIF (non animated)
Audio Formats:
- MP3
Video Formats:
- FLV
- MPEG4 h.264 (extensions may vary, but h.264 encoding is a must)
Flash/Flex formats:
- SWF
ActionScript API within Flash content:
By default, Flash movies (SWF content) are presented using the same “delay” default as that used for still images, and the billboard maintains control of the mouse. Therefore, regardless of SWF length or desired interactivity, a SWF-based billboard may only be shown for 8 seconds (depending on the defaults assigned to the billboard itself), and any mouse movement or clicks will be ignored by the SWF. This ensures that the billboards play as expected, and continue content rotation, regardless of the content itself.
Flash content developers can override this default behavior, however, by including calls to the billboard manager’s API to request that the billboard suspend its normal behavior and return control to the content SWF itself. Because the interaction is handled through an external (Javascript) interface, both AS2- and AS3-based SWFs may use the same API calls:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //Give mouse control to the SWF, rather than using the default "click on the billboard to jump to the linked URL" behavior: ExternalInterface.call('ti_bbm_takeMouseControl', ExternalInterface.objectID); // By default, the billboard will advance to a new item after X seconds. The following call allows a SWF to override this behavior. // Please note, it should always have an accompanying "ti_bbm_resume()" call, too (see below). Otherwise, the user will need to use // the navigation menu to move on. ExternalInterface.call('ti_bbm_suspend', ExternalInterface.objectID); // By default, the billboard will advance to a new item after X seconds (or, if ti_bbm_suspend() is used, never). The following allows the SWF // to terminate itself, advancing the billboard to the next item. ExternalInterface.call('ti_bbm_resume', ExternalInterface.objectID); |
Example uses:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | // Check to make sure the ExternalInterface is available and the page supports SWF/browser interaction. // if (ExternalInterface.available) { // Give mouse control to the SWF, rather than to the billboard URL link. Note that all calls are wrapped in try/catch constructions, which allows more flexibility // for content designers, as the same SWF can now be used both inside a Tierra billboard AND independently elsewhere. // try{ ExternalInterface.call('ti_bbm_takeMouseControl', ExternalInterface.objectID); } catch (e) { trace ("Billboard SWF could not claim mouse control: " + e.text); } // Suspend the autoadvance... try{ ExternalInterface.call('ti_bbm_suspend', ExternalInterface.objectID); } catch (e) { trace ("Billboard SWF could not suspend auto advance: " + e.text); } // When a user clicks a clip named "closeButton," resume the billboard and advance to the next item. closeButton.addEventListener(MouseEvent.CLICK, function () { try{ ExternalInterface.call('ti_bbm_resume', ExternalInterface.objectID); } catch (e) { trace ("Billboard SWF could not resume auto advance: " + e.text); } }); } |
Change Log:
v1.12
- Fixed bug introduced in 1.11 that could affect existing playlists
v1.11
- Fixed bug in player that could lead to simultaneous sound playing
- Added logo to admin page.
- Added full-screen capabilities
- Removed audio icon on still image presentations
- Major revisions to asset management and player to accommodate inclusion of remote files within billboard.
- Various bug fixes
v1.0.1
- Fixed admin issues reported by users of Internet Explorer
Hi. Love the plugin. I’ve used it on several sites with no problem. I have it on my front page at http://anglicanwomensempowerment.org, and it displays fine in Firefox and Chrome. However, I noticed, after a Mac OS upgrade yesterday to Safari 5, it does not display at all in Safari.
I’m assuming this is something to do with the new Safari version. Any fixes?
Report this comment
@Paula – I am running Safari 5.0 and can see your billboard with no issues. I am running 10.6.4 with Safari 5.0. Can you send along your OS version? Also, are there any javascript or page errors?
Report this comment
Regarding “Tierra Billboard Manager”… This plug-in is among the best in breed not only for its functionality but the accompanying documentation. The plug-in documentation and support are all outstanding. The plug-in performs as promised and due to the documentation and support, research and compatibility testing have been cut 75%. Tierra sets the standard. Support and documentation are equally important as functionality. Many plug-in developers seem to overlook this fact…not so in this case. I am very pleased! The plug-in works!!! Enjoy!
Report this comment
Looks awesome BUT … when I upload my media (.flv) it says it was successfully uploaded but it does not show up in the list so I cannot add it to the player. Tried uploading through wordpress media too and it still doesn’t show up in the list.
Can idea why ?
Thanks !
Report this comment
@flav – I’ll pass it along to our dev team to take a look and see if they can replicate the issue and find a solution.
Report this comment
Is there a way to manually create a playlist without using the plug-in interface? (using text code or database) The dropdown to select a playlist doesn’t work on my installation.
Report this comment
@Rickey – do you see any JavaScript errors when trying to create a playlist? What version of WP are you running?
Report this comment
Upgraded plug-in and word press:
Warning: array_merge() [function.array-merge]: Argument #1 is not an array in /home/content/m/e/d/medleyindesign/html/wp-content/plugins/tierra-billboard-manager/tierra-billboard-manager.php on line 1203
Warning: array_merge() [function.array-merge]: Argument #2 is not an array in /home/content/m/e/d/medleyindesign/html/wp-content/plugins/tierra-billboard-manager/tierra-billboard-manager.php on line 1203
Report this comment
@jacob – working on a fix right now.
Report this comment
Just uploaded v1.12 which should resolve your issue.
Report this comment
In Chrome (I assume all webkit browsers) the billboard shows above my drop down menu. Any idea how I could fix this?
Report this comment
@Brandon – do you have a link I could take a look at?
Report this comment
The new version of your plugin (1.0.1) does not work in IE8 or Maxthin browsers. It only works (and quite badly) in Mozilla Firefox. I am deactivating this plugin and removing it from my Wordpress site. Thanks for trying.
Report this comment
@Paul – sorry to hear you’re having issues. We don’t support Maxthin browsers, so we can’t really offer any guidance there. I personally checked Mozilla Firefox v3.6 and had no issues with creating billboards, managing the player and saving content. What version of the browser / plugin are you using? Also, if you want to try IE8 again, I might suggest adding this meta tag to your site. Some users find it helpful when supporting pages in IE7 & 8.
I’m certainly happy to help troubleshoot this more with you.
Report this comment
Was the IE8 issues fixed? I checked this page out in ie8 and it worked. Is it because it is using the ie8 render as ie7? Is there a known bugs list, or problems with other plug-ins?
This appears to be a very promising Plug-In. Thank You.
Report this comment
@JLM – for some reason, IE8 won’t recognize the plugin unless you force compatibility mode to IE7. We’re thinking of adding a tag for you where if the plugin is active, it’ll set a conditional tag if it is IE8 so it will render using IE7’s engine. It’s a known browser bug that we have yet to see a patch for. Would adding the tag via the plugin work for you?
Report this comment
Is there a way to set an image as the background of the billboard as opposed to a single color? If not then is there a way to make it transparent and then set it on top of an image?
Also, I would like to request a feature if you do take requests. The feature I would like to see is the ability to use image thumbnails instead of circle dots.
Thanks for this plugin, it has helped immensely on my website.
Report this comment
@Zeathy – I’ll add the request for a front card to the player. Right now, we’re looking at various skinning options, so we’ll note your request for thumbnails. Thanks!
Report this comment
Hi Tierra
I find the Tierra Billboard plungin interesting, but after creating a playlist and want to add files to it (from Available Billboard-compatible Media) does not work at all. I selected files and click on Add located at the bottom of the section, but nothing goes into my playlist.
Any help?
Regards
Lili
Report this comment
@Lili – that’s the first we’ve heard of this issue. What browser are you using? Can you verify that JavaScript is enabled?
Report this comment
Hi Todd,
I was looking if any chance to sort out the issue, but I had no one. I am using IE8, but it the same when I tried IE7. My Java Script is enabled. I have no idea how the plunging can find the media in my library but, not able to create the playlist after selecting them.
LL
Report this comment
@Lili – just pushing a version up to WordPress now. Keep an eye out for 1.0.1 which has some JavaScript IE bug fixes.
Report this comment
Hi Todd – got it, great now works, but I have one big problem, I whatever my definition, I cannot get the video with same width as the Player dimensions ( W x H in pixels):The video is in the midle leaving blank sides filled with background color: [pppppppVVVVVVVVVVppppppp].
If any ideia please help.
LL
Report this comment
@Lili – good question. What are the dimensions of your video and the dimensions of the player. I should be able to help you set the player size accordingly. I’ll also add some additional documentation to our plugin page here that will describe the w x h settings and how to fill the full player.
Report this comment
Hi
Sorry Todd, what I am looking for is something as 590×289 for my visible video. Set that is looks the plugin apply it to tht player and apply it own dim to the video. Documentation will be helpful and for sure this plugin will became so powerfull for use. However other alternative over there but I still with hope to use your in my blog. Thanks Todd, awaiting for your help.
Report this comment
When I install the plugin on my domain yamsfromouterspace.com, I get the following message: “Plugin could not be activated because it triggered a fatal error.”
What’s the scoop?
Report this comment
@Scott Dickens – Are you able to access any php error logs? If so, I’d be curious if you see any error messages pointing to the Billboard Manager. What version of WP are you currently running?
Report this comment
This would be really great.
I don´t have troubles with WP or WPMU mediadirectory – i linked my files from other partition to mediadirectory (for example ln -s /mnt/blabla/bla.mp4 /var/www/wordpres/wp-content/upload). It works for all mp3(audio) or mp4(video) files fine.
Your Billboard Manager does check only WP medialibrary for files and i can´t set other path for my files.
Report this comment
Hi there, this plugin is abslutely what i was search around.
Thanks for all.
Report this comment
@silver – Thanks! Glad you like it. We’ll be adding some exciting new features soon. Stay tuned.
Report this comment
Hello,
thank you for your fantastic plugin – best multimedia Slider.
I have one Q : how can i change path of multimedia files ?
I have my collection of mp3 and mp4 not in Wordpress media directory (its too small space for me),but in /mnt/media/… .Can i change or define this path in some .config (php) file ?
Cheers
tom
Report this comment
@tom – I am currently testing our latest release which will let you link to media not uploaded to WP (externally referenced media). If you are able to access your media from a url, this feature would work. I’ll put a note in our feature request list to see if we can also add support for files on local disk but not uploaded to WP.
Report this comment
the Tierra Billboard Manager plugin. I found the error in IE and not in firefox. it was a unknown runtime error in the tools.php on line 253, char 7, code 0
Report this comment
Hi again,
the problem seems to be when I use my IE browser. When I log into my wordpress using firefox, i click on your billboard plugin and the settings screen doesn’t show a unknown runtime error on the page. It seem to only be when i do the same thing through internet explorer. if there is a fix, please let me know what to do.
Thanx
Report this comment
hello, i have uploaded your plugin while designing my website. I receive an unknown runtime error in the tools.php > Line 253, char 7.
Do you know what i need to do to fix it.
thanx
Report this comment
@Fred – can you tell me what plugin you are using, which browser you’re running and the error message that shows?
Report this comment
Did my information help?
Report this comment
@Fred – we’re looking into the IE issue which seems related to the thickbox tool. Once we have a fix, we’ll push it up as a new version to the plugin.
Report this comment
I am experiencing the same error in IE 8. Good luck with the fix!
Report this comment
@Paul – we have a fix slated to go up in the next release.
Report this comment
@Lili – look for documentation in the next day or so.
Report this comment