EMC2 Alert Boxes make a great way to notify your visitors of anything!

Eric McNiece

EMC2 Alert Boxes uses jQuery and HTML5 animations to provide a great-looking, simple and functional alerting system. Alert boxes can be placed using the <code>[emc2alert]</code> shortcode or by calling the <code>$().emc2alert()</code> jQuery function!
Check the demo at http://alert.emc2innovation.com !
Easy to use! Insert a shortcode on any page using a quick-create TinyMCE icon, or create alerts on the fly using jQuery:
Shortcode: <code>[emc2alert]This is some text![/emc2alert]</code> 
 -or- 
jQuery: <code>$('body').emc2alert({ text:"This is some text!" });</code>
Advanced Usage
Shortcode
[emc2alert type=”success” style=”normal” width=”300px” position=”top” wpbar=”auto” visible=”visible” closebtn=”1″ title=”Introducing…” animate=”true”]A great way to alert your visitors![/emc2alert]
Defaults:
<ul>
<li>type: “info” – “success”, “warning”, “error” also available</li>
<li>style: NULL – “normal” displays as block at shortcode location, or “fixed” for top or bottom of page</li>
<li>width: NULL – accepts position with units, ie “300px”, “100%” or “5em”</li>
<li>position: “top” – If style=”fixed”, position can be set to top or “bottom” of page</li>
<li>wpbar: “auto” – Auto-detects WP Admin Bar. Can be set to TRUE or FALSE as well to set compensation.</li>
<li>visible: TRUE – Set to FALSE to hide</li>
<li>closebtn: FALSE – Set to TRUE to add a close button to the box</li>
<li>title: “Alert Title” – Box title</li>
<li>animate: FALSE – Set to TRUE to enable slideUp() and slideDown() jQuery animations on open and close!</li>
</ul>
jQuery
<pre><code>$('body').emc2alert({ // Prepends Alert Box to 'body' element
 title: "Your Title", // or $('myTitleDiv').html()
 text: "Your Message", // or $('myMsgDiv').html()
 type: "info", // 'info', 'warning', 'error', 'success' - determines bg colors
 style: "normal", // 'normal', 'fixed' - in page or fixed to top or bottom
 visible: true, // true, false - hides if necessary
 position: "top", // 'top', 'bottom' - positions box on page
 width: null, // '100%', '960px' - specify units
 closebtn: false, // true, false - displays close button in corner
 wpbar: false, // true, false, 'auto' - adds top margin to avoid admin bar, with auto-detect
 animate: false // true, false - adds open/close animation
});
</code></pre>
BIG thanks to <a href="http://www.red-team-design.com/cool-notification-messages-with-css3-jquery" rel="nofollow ugc">Red Team Design’s work</a>!
To Do list:
<ul>
<li>Add animate argument to TinyMCE shortcode generator</li>
<li>Add custom class field to shortcode</li>
<li>Add a settings page</li>
<li>Make plugin child-theme compatible</li>
<li>Add !important styles to CSS</li>
</ul>
Known bugs:
<ul>
<li>None yet! Please post at http://alert.emc2innovation.com if you find one.</li>
</ul>
<h3>Configuration</h3>
EMC2 Alert Boxes will work straight out of the box. Everything is configured from the shortcode or jQuery call! Post in the forums if you want to see a feature added.
If you are editing with the TinyMCE WYSIWYG interface, you will notice an orange triangle icon appear. This is a quick-build shortcode generator in case you forget exactly

Alternatives to EMC2 Alert Boxes

Top alternatives