#Blocs bootstrap builder how to
#Blocs bootstrap builder full

icon ( WPElement|string) An element or Dashicon slug to show as a visual approximation of the template.

name ( string) Unique identifier of the template.

templates ( array) List of template objects.Įach template has the following attributes:.

addFilter ( '', 'myplugin/wp-bootstrap-blocks/row/templates', myRowTemplates ) Parameters UsageĪdd_filter( 'wp_bootstrap_blocks_button_wrapper_classes', 'my_custom_button_wrapper_classes', 10, 2 ) įunction my_custom_button_wrapper_classes( $classes, $attributes ) wp. wp_bootstrap_blocks_template_pathĬhanges the default theme directory name ( wp-bootstrap-blocks/). Please visit the following page to get more information about PHP filters. The plugin provides the following PHP filters. You can copy the original template from wp-bootstrap-blocks/src/templates/.php as a starting point and adjust it to your needs. To overwrite a block template create a folder called wp-bootstrap-blocks/ in your theme directory. This makes it possible to overwrite the template of a block in your theme. Wp_enqueue_script( 'bootstrap', '', array(), '4.3.1', true ) Īdd_action( 'wp_enqueue_scripts', 'mytheme_load_bootstrap' ) TemplatesĪll blocks are implemented as dynamic blocks. Wp_deregister_script( 'jquery' ) // Remove WP jQuery version The easiest way to do this is to add the following to your theme's functions.php: We decided not to include the library so that you can modify Bootstrap to your own needs before loading it. Please be aware that this plugin does not include the Bootstrap library in your website.

#Blocs bootstrap builder how to

Please read the official Bootstrap documentation to get more information on how to use it. The support is still experimental since it's also marked as experimental in the Bootstarp library. When the CSS grid is enabled the row and the column blocks will use custom templates for the rendering process: define( 'WP_BOOTSTRAP_BLOCKS_ENABLE_CSS_GRID', true ) The CSS grid (supported with Bootstrap >= 5.1.0) can be enabled in the plugin settings (Settings > Bootstrap Blocks) or by defining the WP_BOOTSTRAP_BLOCKS_ENABLE_CSS_GRID constant in the wp-config.php file:Įg. By default Bootstrap version 4 is selected. Possible values right now are '4' or '5'. Bootstrap 5: define( 'WP_BOOTSTRAP_BLOCKS_BOOTSTRAP_VERSION', '5' ).Bootstrap 4 (default): define( 'WP_BOOTSTRAP_BLOCKS_BOOTSTRAP_VERSION', '4' ).The version can be selected in the plugin settings (Settings > Bootstrap Blocks) or by defining the WP_BOOTSTRAP_BLOCKS_BOOTSTRAP_VERSION constant in the wp-config.php file: This plugin supports Bootstrap v4 and v5. Alignment: Horizontal alignment of the button.Open in new tab: Choose if link should be opened in a new tab.Style: Choose the styling of the button.Padding: Define padding inside the column.Otherwise use the Alignment option of the outer row block. This option is only needed if a background color is set. Content vertical alignment: Align content vertically in column.Background Color: Set background color to column.Equal width for all breakpoints (xxl, xl, lg, md, sm, xs): If enabled column will spread width evenly with other columns.Sizes for all breakpoints (xxl, xl, lg, md, sm, xs): How much space the column should use for the given breakpoint.CSS Grid Gutters: Size of gutters when CSS grid is used.Vertical Gutters: Size of vertical gutters.Horizontal Gutters: Size of horizontal gutters.Editor stack columns: Displays stacked columns in the editor to enhance readability of block content.Vertical Alignment: Vertical alignment of inner column blocks.Alignment: Horizontal alignment of inner column blocks.No Gutters: Disable gutters between columns.Template: Choose from a predefined template for the inner column blocks.Margin After: Define a margin which should be added after the container.The container will use 100% of the width until the specified breakpoint is reached, after which the defined max-widths will apply for each of the higher breakpoints.

This feature only works with Bootstrap v4.4+. Fluid Breakpoint: Used to enable responsive containers.

#Blocs bootstrap builder full

Fluid: If enabled the container will use the full available width, spanning the entire width of the viewport.

Block templates can be overwritten in your theme.

Configuration via option page or programmatically with constants.This plugin adds Bootstrap components and layout options as Gutenberg blocks. Bootstrap Gutenberg Blocks for WordPress.