Add Theme Support Builder Responsive Function Parameters
Examples:
1.
add_theme_support( 'builder-responsive', array('tablet-width' => '800px', 'mobile-width' => '400px' ) );
mobile-width
Example:
add_theme_support( 'builder-responsive', array( 'mobile-width' => '400px' ) );
mobile-width is used to determine what width is considered to be "mobile". In Builder's responsive feature, this width is used to cause the styling in the style-mobile.css file to take effect and is used to figure out when to add the auto-generated margins. The default value of mobile-width is 500px.
tablet-width
Example:
add_theme_support( 'builder-responsive', array( 'tablet-width' => '800px' ) );
tablet-width is used to determine what width is considered to be "tablet". In Builder's responsive feature, this width is used to cause the styling in the style-tablet.css file to take effect.
enable-breakpoints
Example:
add_theme_support( 'builder-responsive', array( 'enable-breakpoints' => false ) );
By setting enable-breakpoints to false, Builder will no longer generate the responsive breakpoints, essentially changing the design into a fluid design with a max width.
enable-auto-margins
Example:
add_theme_support( 'builder-responsive', array( 'enable-auto-margins' => false ) );
By default, Builder's responsive feature adds margins to the sides of the Layout as the browser width starts to shrink. This is to ensure that the Layout is pushed away from the edges of the device. If this isn't needed, for example, when you want to achieve an adaptive design, we can set enable-auto-margins to false in order to disable this feature.
enable-fluid-images
To prevent images and video's resizing automatically when the browser resizes, add the following parameter to the add_theme_support function in child theme's functions.php:
add_theme_support( 'builder-responsive', array( 'enable-fluid-images' => false ) );
The default value for enable-fluid-images is "true".
What it does
Essentially, this will prevent the following css being used:
img, video, .wp-caption {
box-sizing: border-box;
height: auto ! important;
max-width: 100%;
}
column-min-width
To prevent early breaking of the layout, you could add the following parameter to the add_theme_support function in child theme's functions.php:
add_theme_support( 'builder-responsive', array( 'column-min-width' => '100' ) );