CSS Framework

We don’t use Bootstrap or any other CSS framework in Page Builder Framework to reduce loading time. Instead we have created our own, minimalistic CSS framework. Take a look at the helper classes below to easily customize the look of your website.


Apply the themes default button styling to your links using the wpbf-button class.

CSS-class: wpbf-button

<a class="wpbf-button wpbf-button-primary" href="#">click me</a>

click me

Primary Button

Add the wpbf-button-primary class to modify the look of the default button (wpbf-button). The button will use the accent color from the WordPress customizer as a background color.

CSS-classes: wpbf-button wpbf-button-primary

<a class="wpbf-button wpbf-button-primary" href="#">click me</a>

click me

Full width images

This is handy if you’re working on your blog layout for instance. With this helper class your image will set to 100% width so they fit its parent container.

CSS-classes: wpbf-img or wpbf-image

<img class="wpbf-image" src="https://wp-pagebuilderframework.com/wp-content/uploads/2017/03/wpbf-clean-design.jpg">

Note: this post ist still under construction

Page Builder Framework

A Page Builder’s best friend.

Sign up for the Newsletter

Get notified about the latest features and updates.

Join the Community

Cookie Preference

Please select an option. You can find more information about the consequences of your choice at Help. Privacy Policy | Imprint

Select an option to continue

Your selection was saved!



To continue, you must make a cookie selection. Below is an explanation of the different options and their meaning.

  • Accept cookies:
    All cookies such as tracking and analytics cookies.
  • Reject tracking cookies:
    No cookies except for those necessary for technical reasons are set.

You can change your cookie setting here anytime: Privacy Policy. Imprint