Buttons
Content
Description
Allows you to create a button with the specified colors and properties.
Features
- Unlimited colors
- Unlimited sizes
- Hovers allowed
- Tooltip allowed
- Target window allowed
- Border radius allowed
Usage
[button url="http://google.com"] Text button [/button]
Examples
- S
- S*
- M
- M*
- L
- L*
- XL
- XL*
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" radius="20"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" radius="20"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" radius="20"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" size="13"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" size="13"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" size="13"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" size="13"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" size="13"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" size="13"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" size="13"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" size="13"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" size="13"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" size="13"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" radius="20" size="13"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" radius="20" size="13"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" size="15"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" size="15"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" size="15"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" size="15"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" size="15"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" size="15"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" size="15"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" size="15"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" size="15"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" size="15"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" radius="20" size="15"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" radius="20" size="15"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" size="18"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" size="18"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" size="18"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" size="18"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" size="18"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" size="18"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" size="18"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" size="18"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" size="18"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" size="18"] Text button [/button] |
| Live preview | Shortcode |
|---|---|
| Text button | [button url="#" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" tooltip="Hello World!" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="8EAF00" color="FFF" bg_hover="9EC300" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="309bc9" color="FFF" bg_hover="35ade0" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="1569ff" color="FFF" bg_hover="1775ff" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="c25619" color="FFF" bg_hover="d8601c" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="e1785a" color="FFF" bg_hover="fb8664" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="db2c56" color="FFF" bg_hover="f43160" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="ff9900" color="FFF" bg_hover="ffaa00" radius="20" size="18"] Text button [/button] |
| Text button | [button url="#" bg="0a2a3a" color="FFF" bg_hover="0e3a50" radius="20" size="18"] Text button [/button] |
Attributes
url
Target URL.
url="http://google.com"
bg
Background color.
bg="336699"
bg_hover
Background color by hover.
bg_hover="000000"
color
Text color.
color="FFFFFF"
color_hover
Text color by hover.
color_hover="CCCCCC"
size
Font size. (pixels)
size="16"
radius
Border radius. (pixels)
radius="5"
tooltip
Tooltip.
tooltip="Hello World!"
target
Target window.
target="blank"
jonknight