Hello, and welcome once more, in this page you will learn about, the Button Block, which is Very advanced block to create any kind of button, and make Responsive

button.jpg

style it, add icon to it or Add an Interactive Functionality, like opening Popups, Opening Responsive Menus, Light Boxes, Dropdown list and much much more.

screenshot.jpg


Options Table

in the table below you can find the Features and Options.

Options
Menu ID select a classic menu ID for the dynamic responsive menu block to open it.
Modal ID enter a Modal/Popup Block ID to open it with the button


Toolbar Options

the Button Block, has many options with a quick access in the toolbar, Like its base Size, What type of button is it, Styles for text/backgrounds and typography styles, add URL and make it a Link, Switch between Filled and Outline styles, or Open a Media Image/Video in a Lightbox Popup

screenshot.jpg


07-Supports.png

Styles Supports

in the sidebar of the Block Editor, when you focus on one of Phenix Blocks you will often find a Field called Support, and from this Field you can Activate a lot of styling options to customize your content Freely and here is an Example of some of these options.


Margin and Padding & Positions

when you activate any of the Margin or Padding spacing styles properties for the block it will appear on the Block Toolbar, and when you click on it you can find the controls for Each device breakpoint, and both are working within the boundaries of Phenix Predefined Utilities classes start with 0 increasing 5 by 5 until 2500 maximum padding or margin and -5 is Center == Auto by CSS terms.

07-Margin.png


sizes.PNG

Responsive Sizes Width and Height

you also can assign a Fixed Width or Min/Max Width and Height for Most of the Element in Phenix Blocks

and it Comes with a Responsive size for each screen and device size.