My WordPress theme has a boxed layout design, that's, the page content is not full width. The main wrapper has a maximum width limit and has paddings around it.
I added the WonderPlugin slider shortcode to the page and it's not full width. How could I make it full width?
Firstly, in WonderPlugin Slider, step 3, Options tab, Slider Options, check both option "Create a responsive slider" and "Create a full width slider".
To create a full width slider, you need to add the slider to your WordPress theme. If you add the slider to the page, since the page is not full width, the slider is limited to the page.
To add the slider to your WordPress theme:
1. In your WordPress backend, goto left menu Appearance -> Editor, find the file header.php on the right list, click and edit it.
2. Find the div of your main page wrapper in the file, then add the slider PHP code above it. You can copy the slider PHP code in WonderPlugin Slider menu -> Manage Sliders.
<?php echo do_shortcode('[wonderplugin_slider id="1"]'); ?>
If you would like the slider only show up on the website home page, you can change the PHP code to following:
<?php if ( is_front_page() ) echo do_shortcode('[wonderplugin_slider id="1"]'); ?>
If you are not familiar with HTML, it may not be easy for you to find the main page wrapper in the file. You could try to move the code around and see how it looks in the final page.
When adding the code, make sure you do not add it between the existing PHP
?> tags in the template file. Nested PHP open and close tags will break the PHP.
Some WordPress themes name the id of the main page wrapper as main, some themes name it as content. So the div could look like <div id="content"> or <div id="main">. There is no rule about how to name it, it totally depends on your WordPress theme.