jQuery Notify: a fast and easy way to display notifications on your website. Some possible uses:
- Form validation (“Please fill out all of the fields.”)
- A welcome message the first time someone visits your site.
- Newsletter subscription form
- Submission confirmation: (“Message sent. We’ll be in touch soon.”)
- Breaking news, updates, special offers
- Advertising
Features:
- Can be used on a per-page basis with a shortcode, or embedded directly into your template
- Elegantly styled and animated in W3C valid HTML5 and CSS3, without any images
- Animation speed and delay settings available from the shortcode
- Comes with four styles: ‘default’ (blue), ‘error’ (red), ‘warning’ (orange), and ‘success’ (green)
- Supports unlimited user-created styles
We’ll be working to add new features as we think of them.
Demo
FYI, something just happened!
This is just an info notification message.
Ups, an error ocurred
This is just an error notification message.
Wait, I must warn you!
This is just a warning notification message.
Congrats, you did it!
This is just a success notification message.
Installation
- Upload the jquery-notify folder to the /wp-content/plugins/ directory
- Activate the plugin through the ‘Plugins’ menu in WordPress
Shortcode
The shortcode syntax is:
[jq_notify style=$style, speed=$speed, delay=$delay] Content [/jq_notify]
$style (optional): sets the style of the panel. Options are: default, error, warning, and success
$speed (optional): time it takes (in milliseconds) for the panel to slide out. Larger numbers = slower. Default: 1000ms
$delay (optional): delay (in milliseconds) between when the page has finished loading and when the panel slides out. Default: 500ms
For example:
[jq_notify style="warning" speed=700 delay=1000]
<h2>Notification Title</h2> <p>Notification body content.</p>
[/jq_notify]
Template tag
jq_notify($content, $style, $speed, $delay)
For example:
$content = "<h3>This is the content</h3><p>And this is some more</p>";
jq_notify($content, 'default', 2000, 500, );