Documentation

Button Widget WordPress Plugin

Adding & Managing Buttons 2017-11-24T11:38:55+00:00

Adding & Managing Buttons

Available from your WordPress site’s widget management page under menu item Appearance > Widgets, the Loomisoft Button widget can be dragged and dropped in the normal way.

Once inserted into the correct area, you can set up your button by configuring the following:

  • Button Text
  • Link URL – web address of the page you want to link to
  • Open in New Window
  • Button Alignment – Select from Full Width, Center, Left or Right / default is Center
  • Text Font Family – Select from standard font families or thousands of Google fonts. Leave blank for your theme’s default
  • Text Font Size – Leave blank for your theme’s default
  • Text Line Height – Leave blank for 1.3em
  • Text Color – Leave blank for white
  • Text Hover Color – Leave blank for white
  • Text Bold
  • Text Hover Bold
  • Text Italic
  • Text Hover Italic
  • Text Underline
  • Text Hover Underline
  • Background Color – Leave blank for light blue
  • Background Hover Color – Leave blank for dark blue
  • Border Width – Leave blank for none
  • Border Color – Leave blank for dark blue
  • Border Hover Color – Leave blank for dark blue
  • Corner (Border) Radius – Leave blank or 0 for square borders
  • Top/Bottom Padding – Leave blank for 10 pixels
  • Left/Right Padding – Leave blank for 5 pixels
  • Top Margin – Leave blank for 10 pixels
  • Bottom Margin – Leave blank for 10 pixels
  • Left/Right Margin – Leave blank for 0 pixels

Once you have set your button up, click “Save”.

Notes:

  • Button alignment is based on the containing area surrounding the widget so “Full Width” refers to the width of this area.
  • Numeric length measurements such as for Text Font Size, Text Line Height, Border Width, Corner (Border) Radius, Paddings and Margins may be in px, em or %. If the unit is omitted, the plugin assumes px.
  • Colors are in full 6-digit RGB hex (e.g. #ffffff for white, #000000 for black, etc.). For ease of use, a color picker is provided for each.
  • Padding is the space between the text and the border/edge of the button.
  • Margin is the space between the button and elements above/below or the edge of the containing element either side. Do be aware that elements above and below may also have margins set. While you may set negative values for the top and bottom margins, also be aware that the website’s theme may have set the containing block (e.g. the sidebar) to have “overflow” hidden, which may cause parts of your button to be hidden.