1. Start
  2. Explanation
  3. Installation
  4. Style and Language
  5. Support
  6. Thanks

WEBSITE- SHELTER HELP

Button Maker for your own website...


Explanation


Structure of Program

On the Left side you will notice the settings for Button and On the right side you will see the live preview of menu on each state.
On the top of the left slider, there are three state of Normal, Hover and Pressed which indicate each style of Button.

 

  On the right side of webpage, shows the button included the width size of it. The moment your cursor moves to the right side of webpage, the indicator will remove and it shows the preview of all state of your button.

To make any state of your button, you at least need to click one time on either hover or pressed state.


Text

When you are writing on text, if you want to make space between the words, you will need to write “ ” instead of pressing space(eg: “King Button”). If you press space you will notice that the word will drop one line down.

 

Border

 

On Radius You are eligible to make rounded corner ( but some only support in browser that compatible with webkit).
You can easily set each edge with the exact amount of radius that you want.

 

 

 

Background

 

The are to color selector that helps you to make gradient color. if you just prefer to make a solid color , you got to set both input boxes with same color (hex).

 

 

Transition

 

Transition is a CSS3 animation, to make this work you need to have either hover or active state set already.

  At first you need to Choose the transition type then chose the duration.

 

 

 

Note: if you change the background  on hover state, and set the background transition  on , you will notice that there are no animation for background.  To make animation work on background,  you need to have Solid color for each state.


Source  Code

 

To get the source code for the button, just move your cursor on
“grab the code” and click on it.

Now all you have to do is to copy the  css codes for your custom button.

 

Browser compatibility:

img

Installation


Installation guide - ............................................

Please follow all the steps carefully.

F

Style and Language


 

Support


Support

FAQ for any general questions and there is also a support ticket system available if you can't find a answer to your problem.

 

Thanks


Thank you

I want to say thank you for purchasing. I hope you enjoy the product like I do!