Since CSS3 became widely supported, it has opened up a whole new world of CSS-based buttons that we can use in our web designs. You can now create the whole button in CSS with no images including things like complex gradients. Using such buttons in your WordPress based websites required you to write the CSS from scratch until now – MaxFoundry has released a plugin called Max Buttons in a free and pro version which costs just $10. It enables you to create all kinds of buttons visually and then use them in your posts with a custom shortcode. In this post I will be taking a look at how to use the plugin.
In this review I am using the pro version of the plugin which has the following extra features:
- Icon support (put icons to the left, right, top, or bottom of your text)
- Multi-line text, to communicate extra information to your users and customers
- Google Web Fonts, to make your buttons stand out with beautiful typography
- Button packs, to import pre-defined sets of buttons into your website
- Import/export functionality (useful for backing up and/or moving your buttons)
Install the Plugin
Once you have purchased the plugin you will receive a zip file to download – In your WordPress admin, visit “Plugins” > “Add New” > “Upload” and upload the file.
Activate the plugin and you will see a new menu item called Max Buttons Pro :
Creating a Button
To starting making your buttons, visit the “Add New” link and you will see a whole page full of options for designing it. You add your text, a description, a URL and the sizes you want it to be. Then you can start with the look of it, choosing padding, colors, gradients etc – all the time there is a live preview of what the button looks like.
Once you have it looking how you want, hit save and that button is stored for you to use in your site. Visit the “Buttons” link and you will see all your buttons there, along with a shortcode to place it in your pages. You can also go in and edit your buttons from here or delete altogether.
Exporting your Buttons
Once you have created a few buttons, you may wish to use them on another website – this is where the “Export” option comes in – you can create your own pack of buttons and download them in a zip file and use them on another site, as long as the max button plugin is active there as well – I think this is a really nice touch so you don’t have to recreate them all over again.
Importing a Button Pack
To import a button pack, visit the “Packs” link and you will see an upload form. MaxButtons sell a huge variety of packs for $5 or you can import your own packs here.
This is a good plugin if you dont have the ability to delve into CSS and create buttons yourself. I like the ability to import and export button packs, this is a nice feature. What I would have liked to see is the ability to export the CSS for the buttons so you can add it into your stylesheet and not have to use the plugin itself.
Give this plugin a go if you are not familiar with CSS and want an easy, visual way to add nice looking buttons to your theme.