Quickstart

Quickstart Buttons Pro can work totally out-of-the-box as it comes with several color schemes, button sizes, and shapes already configured.

Install add-on Add a Buttons Pro block to a page Set your design preferences (color, shape, size...) Set your functional preferences (link, dropdown...) Et voila: a gorgeous button ready for action General configuration Before you start you should have a look at the General Configuration. Those are default values that will apply whenever no specific style is selected for your buttons.

You can just leave those configuration values as they are if you want, the default values are pretty good.

Creating and editing styles You can create and edit new Color Schemes, Shapes, and Sizes for your buttons from the dashboard.

These elements along with others will be available for you to select when designing your buttons and adding them to pages.

All style elements you create and activate will be added to Buttons Pro CSS file. The CSS file is available to your blocks or can be added independently to any page.

Built-in styles CAN'T be edited. They can only be activated or deactivated.

Generating the CSS Anytime you modify or add to default configuration values, colors, sizes, or shapes, you must generate the new CSS file so changes show up on your site.

Whenever it is necessary (after modification) a popup will appear as a reminder to generate the CSS. You can choose to generate it right away or you can keep modifying your styles until you're totally done, before generating the CSS.

Another way of generating the CSS is by clicking on the green button labeled “Generate CSS” at the top of each Buttons Pro's dashboard pages.

Keeping your CSS weight small In the General Configuration screen, you can choose to NOT include Long Shadows, Glow, and wrappers. If you are not going to use them I strongly suggest you don't include them to slim down your stylesheet and save your bandwidth.

What's more, you should deactivate any style (color, shape, size...) you are not using in your site so it is not included in the CSS, keeping it as small as possible.

For instance, if you're not using any of the 7 color schemes bundled with Buttons Pro, just exclude them all.

To exclude a style from the final CSS, simply uncheck the box labeled “Included” while editing that style.