=== All Bootstrap Blocks === Contributors: areoimiles Tags: Bootstrap, Bootstrap Blocks, Bootstrap 5, Gutenberg, Gutenberg Blocks, Blocks, Layout Blocks Requires at least: 5 Tested up to: 5.9 Requires PHP: 7 Stable tag: 1.0.1 License: GPL v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Create Bootstrap 5 layouts directly in the WordPress editor. Plus choose from over 20 component blocks including carousels, modals, buttons and more. == Description == == The power of Bootstrap 5 in the WordPress editor == [All Bootstrap Blocks is a free WordPress plugin for agencies, freelancers and hobbyists](https://areoi.io/all-bootstrap-blocks/). Speeding up the delivery of WordPress websites by making the Bootstrap 5 framework available directly within the editor. [Full documentation is available here.](https://areoi.io/all-bootstrap-blocks/documentation/) Watch [All Bootstrap Blocks](https://areoi.io/blog/all-bootstrap-blocks/) in action. == Features == - **100% FREE** - **[Quick and easy Bootstrap customisation:](https://areoi.io/all-bootstrap-blocks/features/customisations/)** Use Bootstrap in a way that suits you - **[Fully responsive layout blocks with a live preview:](https://areoi.io/all-bootstrap-blocks/features/layout/)** Including containers, rows and columns - **[20+ Bootstrap component blocks:](https://areoi.io/all-bootstrap-blocks/features/components/)** Including buttons, cards, modals and much more == Examples == - [Full page height carousel with navigation and indicators](https://areoi.io/all-bootstrap-blocks/examples/full-height-carousel/) - [Multiple content strips with alternating layouts](https://areoi.io/all-bootstrap-blocks/examples/content-page-with-background-images/) - [Posts displayed within cards and custom grid layout](https://areoi.io/all-bootstrap-blocks/examples/posts-page-using-cards/) - [Banners with background images, videos and flat colours](https://areoi.io/all-bootstrap-blocks/examples/full-height-content-strips/) == Quick and easy Bootstrap customisation == If you're not a pro developer it can be difficult to customize Bootstrap for your needs. With All Bootstrap Blocks you can quickly and easily manage all of your Bootstrap options directly within the WordPress dashboard without writing a single line of code. [Read the full documentation on customisations here.](https://areoi.io/all-bootstrap-blocks/documentation/getting-started/) = Implement your own Bootstrap CSS and JS = If you're plugging All Bootstrap Blocks into an existing site you may already have Bootstrap included in your theme. We've made it as easy as clicking a button to turn off our built in Bootstrap options to avoid duplication and give you the flexibility to use Bootstrap your way. = No code needed Bootstrap customisation = If you'd like to avoid code then we have built in the ability to manage all of your Bootstrap options within your WordPress admin. Fill in options by searching the available Bootstrap variables, inputting custom values or using a simple user interface. Bootstrap CSS and JS will automatically be included on your site customised with your options. = 20 popular Google fonts to choose from = To make your life easier we have included the 20 most popular Google fonts for you to use within your site. Change the font used across your site in seconds. If you can't find the font you're looking for you can always add your own. == Fully responsive layout blocks with live preview == Utilise the Bootstrap grid system directly within the WordPress block editor. All layout blocks display a live preview and give you the power to use the built in Bootstrap utility settings and set specific settings for different size devices. [Read the full documentation on layout blocks here.](https://areoi.io/all-bootstrap-blocks/documentation/layout/) = Strip block = The strip block isn't a standard in Bootstrap. It's a block we find incredibly useful though. It's a full width div that allows you to add a background (color, images and videos) along with an overlay, set height, padding and margin and insert any content you wish. This is the perfect block for creating full width banners or adding background to strips of content. = Container block = Containers are the most basic layout element in Bootstrap and are required when using the default grid system. The All Bootstrap Blocks container block comes with the ability to choose between the default container (sets a max-width at each breakpoint), responsive containers (sets 100% width until the specified breakpoint) and a full width container (sets 100% width at all breakpoints). = Row block = Rows work as wrappers for columns. The row block makes it easy to set uniform column sizing for all inner columns such as vertical and horizontal alignment as well as specifying the number of columns to display per row. All of these settings can be managed for each breakpoint so you can have a completely different layout on mobile vs. desktop. = Column block = Columns work with the Bootstrap 12 column grid and make it possible to create simple or complex layouts that change based on the device size. The column block allows any inner content you wish and has quick settings to manage the horizontal and vertical alignment, offset and ordering of columns. = Column break block = Sometimes you'll want to force columns to wrap on to a new line. The column break block was built for this. Add a column break to easily reset columns. You can also show or hide column breaks based on device size to provide full control over your layout. = Div block = Bootstrap has loads of useful utility classes to modify layouts however you want. We've created a basic `
` block that can hold any inner content you like and the ability to add additional classes to make use of the built in Bootstrap classes. If for any reason the Bootstrap layout components aren't right for what you need, you can add a div block and customize it however you want. == 20+ Bootstrap component blocks == We've created blocks for [all of the Bootstrap components from accordions and modals to buttons and cards](https://areoi.io/all-bootstrap-blocks/features/components/). All blocks preview directly in the block editor, work seamlessly with other WordPress blocks and have loads of options so you can tailor them to your needs. [Read the full documentation on component blocks here.](https://areoi.io/all-bootstrap-blocks/documentation/components/) = Accordion block = Build vertically collapsing accordions, made up of a header and body. The accordion body can have whatever content you like from headings and paragraphs to images and videos. Control how accordions react to interactions and easily select whether to open an accordion item on page load. = Alert block = Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. Quickly style alerts by using theme colours, add a custom icon and even include a close button so that users can dismiss the message. = Breadcrumb block = Indicate the current page’s location within a navigational hierarchy. Add the breadcrumb block and we’ll automatically generate a breadcrumb for the current page. Customise your breadcrumbs with dividers. = Button block = Make use of all of Bootstraps predefined button styles with simple settings for changing colours and sizes. You can even add additional functionality to buttons like popovers, tooltips and dropdown menus. = Button group block = Group a series of buttons together on a single line or stack them in a vertical column. Quickly manage sizing of all buttons within the group. = Card block = Bootstrap’s cards provide a flexible and extensible content container with multiple variants and options. All Bootstrap Blocks includes blocks for cards, card headers and card footers with full flexibility to add whatever content you like within them. Change the background, text colour and border colour of any card. = Card group block = Use card groups to render cards as a single, attached element with equal width and height columns. Card groups start off stacked and use display: flex; to become attached with uniform dimensions starting at the sm breakpoint. = Carousel block = The All Bootstrap Blocks carousel block gives you the power to create a cycling slideshow with as many slides as you like. Each slide can include whatever content you want. Use the quick settings to change the theme and control whether arrows, indicators or both show. You can even set a custom interval for each slide. = Collapsible content block = The collapsible content block works with buttons and links to show or hide content to the user. You can include any content you want inside the collapsible content block including images, videos and anything else. = List group block = List groups are a flexible and powerful component for displaying a series of content. Each list item can be styled using the theme colours, turned into hyperlinks, marked as active and marked as disabled. = Modal block = Add dialogs to your page and toggle them with links and buttons. Each modal can have a header, footer and body. Each of which can include any content you like. Control the position of the modal, whether it’s scrollable and whether the backdrop should be clickable. = Navs & tabs block = Quickly create navigations within your page using the navs & tabs block. Choose a style for your navigation from Default, Tabs and Pills. Mark each navigation item as active or disabled and specify layout options for each breakpoint. = Offcanvas block = Build hidden sidebars into your project for navigation, shopping carts, and more. Toggle offcanvas blocks with links and buttons to display whatever content you like. Choose the offcanvas placement (from top, right, bottom and left), specify whether there should be a backdrop and whether the body should be scrollable. = Progress bar block = Add progress bars directly in your page and use your own JS to control them. You can quickly style progress bars with theme colours, add labels, include stripes and even animate them. = Spinner block = Indicate the loading state of a component or page with Bootstrap spinners, built entirely with HTML, CSS, and no JavaScript. Quickly customise spinner styles, colours and sizes directly in the editor. = Toast block = Toasts are lightweight notifications designed to mimic the push notifications that have been popularised by mobile and desktop operating systems. Toggle toasts with links and buttons. Customise the header, content, colour and placement of toasts on a page. == Screenshots == 1. Automatically include Bootstrap or include your own version 2. Manage all of your Bootstrap settings in the dashboard 3. Create responsive layouts directly in the editor 4. Choose from over 20 component blocks (Carousels) 5. Choose from over 20 component blocks (Modals) 7. Choose from over 20 component blocks (Accordions) == Installation == 1. Upload the `all-bootstrap-blocks` directory into the `/wp-content/plugins/` directory 1. Activate the plugin through the `Plugins` menu in WordPress 1. Start adding blocks == Frequently Asked Questions == = Which versions of Bootstrap are supported? = All Bootstrap Blocks supports Bootstrap version 5. = Is Bootstrap included? = Bootstrap is included. However you have the ability to switch this off in your WordPress dashboard if you would like to include your own version of Bootstrap. [Read the documentation here](https://areoi.io/all-bootstrap-blocks/documentation/getting-started/settings/). = Do you want to suggest a feature or report a bug? = [Please add any feature requests or bugs within the support section.](https://wordpress.org/support/plugin/all-bootstrap-blocks/) == Changelog == = 1.0.1 = * With the option to hide the core button and column blocks, blocks from other plugins were being hidden. We have updated the functionality to only excluded the selected blocks and made sure no other plugins are impacted by our code.