Days
Hours
Minutes
Seconds
Year’s Biggest Sale is here! Exclusive and limited time BF/Cyber Monday Sale 50% OFF.
qxio-ios-color-wand-outline Grab The Deal
💡 Quix Course
Enroll to our comprehensive Quix course here

Button Group

With this module, a group of buttons can be created in minutes without even a single line of code. Its pretty simple with a huge customization settings module that can easily configure. You can have various tests and share in buttons.

Button Group

General Settings

Button Group

  • Add New : - Add New : A button to add new Button. You can add Button as many as you want to make a Button Group with this button.
  • Duplicate : Clone the Button with all its settings.

Once you click on a created Button, a couple of settings will appear to configure below this.

  • Button Text : Give the Button Name
  • Url : Provide an URL that you want to redirect the users into when s/he clicks on the button.
  • Open New Window : Enable or Disable opening the URL in a new window.
  • Icon : Use an icon for the button. You can search the right type of icon using the search box below this.
  • Icon Placement : Define the position of the icon you have used for the button.
  • Style : You can select a button style from the drop-down menu or keep the default style.
  • Custom Style : You can either enable or disable this option. By enabling this, a couple of additional settings appears whereas setting this option to disable, a default style will be applied.
  • Text Color : Choose the color of the Button text.
  • Background Color : Set the Background Color of the Button.
  • Hover Background Color : Define the background color that you want to show the users when they hover over the Button.
  • Hover Text Color : Define the button text color that you want to show the users when they hover over the Button.
  • Border Styling : You can enable or disable this option.
  • Icon Color : Define the color of the icon, you have used on the button.
  • Icon Hover Color : You can set a hover color of the button icon with this option.
  • Padding : You can set the amount of padding in pixel for Top, Right, Bottom and Left as well for the Button.

Styles Settings

Button Group

  • Alignment : Define the position of the Button Group. You can put either left, center or right.
  • Animation : Define the animation effect to apply on the Button Group.
  • Font : Customize the Font for the texts used as the title of the Button Group. You can choose from plenty of existing Google fonts and define its type ( Bold, Italic, and Underline, Uppercase, Lowercase, and Capitalize as well ), size, line height, and letter spacing.
  • Button Spacing : Define the amount of space you want to have between the Buttons.
  • Margin : You can define the amount of margin in pixel for Top, Right, Bottom and Left as well for the Button Group.
On This Page