Standout CSS3 Buttons

Standout CSS3 Buttons is a plugin for WordPress that displays CSS3 style gradient buttons for your website. Easy to implement with a shortcode.

Based on a blog post from Brian Gardner (update: the post is gone), this plugin creates really handsome buttons that change on hover.


Current Version

The most recent version of this plugin is 0.2.9. This version was released on August 16, 2014.


  • Easy to configure
  • CSS loads conditionally to minimize overhead
  • Beautiful looking gradient scale buttons that render in most browsers
  • Links may be nofollowed and opened in a new browser window



How to Install

  • Upload plugin through the WordPress interface
  • Activate the plugin through the 'Plugins' menu in WordPress
  • Click "Settings" under plugin name and configure the plugin
  • Insert the shortcode on posts or pages, or call plugin function from functions.php or a plugin, or configure plugin to auto-output to posts/pages (this feature not available with all plugins)

Live Demo


This is the current default style for my site:



Settings page

Plugin Settings page

Sample Usage

Insert shortcode on any post or page. Or use the plugin function in your functions.php or a plugin:

`add_action('the_content', 'show_css3_button');
function show_css3_button($content) {
  if (is_page('home')) { // we are on a page with slug 'home'
    if (function_exists('scss3button')) { // plugin is installed/active
      $content .= scss3button(array('cssclass' => 'button-rss', 'href' => ''), 'Click here');
  return $content;

See the plugin admin settings page for parameter names and default values.


Do you need help with this plugin? Check out the following resources:

  1. Documentation
  2. FAQ
  3. Support Forum
  4. Development
  5. Changelog

If you use and enjoy this plugin, please rate it and click the "Works" button so others know that it works with the latest version of WordPress.

Plugin Development Trac trac feed

Site last updated September 5, 2014