How to implement theme option to change bootstrap 4 container from .container to .container-fluid

Here is possible solution that works (theme name is “zoran”):

//1. Step (Create Customizer section, setting, control)

//In functions.php include or directly put code that goes something like this:



function zoran_customize_register( $wp_customize ) {
$wp_customize->add_section( 'zoran_sekcija', array(
    'title'          => __( 'Zoran', 'zoran' ),
    'priority'       => 35,
) );
$wp_customize->add_setting( 'zoran_postavka', array(
    'default'        => 'container',
    'type' => 'theme_mod',
    'capability' => 'edit_theme_options',
) );

$wp_customize->add_control('zoran_control', array(
    'label'   => 'Container',
    'section' => 'zoran_sekcija',
    'settings'   => 'zoran_postavka',
    'type' => 'radio',
    'choices' => array(
        'container' => 'Fluid',
        'container-fluid' => 'Fixed', 
    ),
) );


}
add_action( 'customize_register', 'zoran_customize_register' );

 //2. Step (Create javascript to manipulate class container)

 //In functions.php include or type:

function zoran_customize_js()
{
?>
     <script>
         div = document.getElementsByClassName("container");
         div[0].classList.toggle(<?php echo "'" . get_theme_mod('zoran_postavka', 'container') . "'"; ?>);


     </script>
<?php
}
add_action( 'wp_footer', 'zoran_customize_js');

I think that’s it. Please make suggestions for improvement.

preview