Button

How to use

  1. Switch to “visual editor”
  2. Push on icon “Add button”
    shortcodes-btn
  3. Put content inside [fruitful_btn] [/fruitful_btn]
  4. Add or remove additional attributes

Attributes

  • size = “mini, large”
  • color = “default, primary, info, success, warning, danger, inverse”
  • type = “link, button, input, submit”
  • state = “active, disabled”
  • text_color = “#fff”
  • icon = “fa-check-square-o” full list of Font Awesome icons”
  • icon_position = “left, right”
  • link = “#”

Size

Click me
[fruitful_btn]Click me[/fruitful_btn]
Click me
[fruitful_btn size="mini"]Click me[/fruitful_btn]
Click me
[fruitful_btn size="large"]Click me[/fruitful_btn]

Color

Click me
[fruitful_btn color="default"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="primary"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="info"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="success"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="warning"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="danger"]Click me[/fruitful_btn]
Click me
[fruitful_btn color="inverse"]Click me[/fruitful_btn]

Type

Click me
[fruitful_btn type="link"]Click me[/fruitful_btn]
[fruitful_btn type="button"]Click me[/fruitful_btn]
[fruitful_btn type="input"]Click me[/fruitful_btn]
[fruitful_btn type="submit"]Click me[/fruitful_btn]

Icon

Click me
[fruitful_btn icon="fa-check-square-o" size="large"]Click me[/fruitful_btn]

Link

Click me
[fruitful_btn link="http://google.com"]Click me[/fruitful_btn]