Possible to make header full width in boxed layout?

[Rincon805]

Hi. I have a boxed layout on my site and I was wondering if it was possible to have a full width header override the boxed layout. If you see the screenshot, I’m tring to make the slider full-width and then have the boxed layout and sidebar begin underneath that.
Is that possible/relatively easy to accomplish?

Thanks,

Attachments:

You must be logged in to view attached files.

[Laura]

Hello, can you share your website?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[Rincon805]

Sure thing: col.thelaw.agency

[Andrei]

Sure you can do that, please note that in your edit page screen, somewhere below the content box, you have a meta box called “Header Content” which will do exactly what you want and in which you can put any shortcodes and use any sliders which provides you a shortcode. For example, to use Revolution Slider you just have to put in that Header Content box the following shortcode: “[rev_slider testslider]”

Hope this helped you out.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Rincon805]

Sweet! Does anybody have a link that will show me what shortcodes are available? Specifically a full width shortcode?

Thanks

[Andrei]

While you’re in the edit page screen, change to the “Classic Editor”, and you’ll have a “KLEO” dropdown in the content editor toolbar. From there you can find all our shortcodes, and you can use them wherever you want/need.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Rincon805]

Heya.

I appreciate the feedback, but there’s no full width shortcode option – that IS available, though, right?

Thanks,

[Andrei]

You don’t need any shortcode, the Header Content box is already full width, it will be above your sidebar as you asked. You just have to paste the shortcode of a slider there, as how i exemplified in my first reply.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Rincon805]

Gotcha. Thanks.

I don’t want a slider in there, however. I’m looking to auto-play a movie. How do I go about setting a hosted movie to autoplay?

Thanks,
-H

[Rincon805]

Ok, so I don’t think I’m explaining myself adequately. Please see attached screensnaps. I have a boxed layout. I’m wanting to have my homepage be full width, however. Right now, when I put any shortcode into the Header Box, the limits are still defined by the “box” layout. Is it at all possible to have the rest of the site be “boxed” but have the homepage be full-width? If so, how do I accomplish this?

Thanks,
-H

Attachments:

You must be logged in to view attached files.

[Rincon805]

website is now thelaw.agency

[dennis09]

Wow I was just about to make this topic lol. I need a full width homepage and boxed everything else. The revolution slider doesn’t make as big of an impact when it’s sandwiched like that.

[Andrei]

Ok, so we don’t have such an option out of the box, but here is a small hack which will help you achive what you need.
Put the following code in your functions.php file, and please update the shortcode from it.

http://pastebin.com/DNjSLjZ7

Hope this helped you both.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jnevent]

Hi! I think i have the same problem, i want the header (the menu section) and the footer to be full width in boxed mode. i tried to put the hack code in the functions.php file but it just showed an error message.

Can you help me?

Thanks.

Attachments:

You must be logged in to view attached files.

[Andrei]

With the following piece of code you can make full width header and footer while keeping boxed layout for the rest of the page, please note that you’ll have to enable your page layout as “full width”.

COPY CODE

function show_full_width_header_on_boxed_layout(){
	echo '</div>';
	echo '<div class="kleo-page page-boxed">';
}
add_action('kleo_header', 'show_full_width_header_on_boxed_layout', 9999);
function show_full_width_footer_on_boxed_layout($sidebar){
	if($sidebar == 'footer'){
		echo '</div>';
		echo '<div class="kleo-page">';
	}
}
add_action('get_sidebar', 'show_full_width_footer_on_boxed_layout', 9999);

Let me know if worked as it should.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jnevent]

Thank you! Where should i paste it? if it is in the functions.php file, is it in the kleo child function file or just kleo? And were in the file, which line?

Thanks!

[Andrei]

If you activated the kleo child theme then you should add the code to that one, inside the functions.php file.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jnevent]

I just tried the code and everything, but it still doesn’t work, probably i just missed something but i can’t figure out what..

This is what my kleo-child functions.php file looks like:

COPY CODE

<?php
/**
 * @package WordPress
 * @subpackage Kleo
 * @author SeventhQueen <themesupport@seventhqueen.com>
 * @since Kleo 1.0
 */

/**
 * Kleo Child Theme Functions
 * Add custom code below
*/

function show_full_width_header_on_boxed_layout(){
	echo '';
	echo '';
}
add_action('kleo_header',
'show_full_width_header_on_boxed_layout', 9999);
function
show_full_width_footer_on_boxed_layout($sidebar){
	if($sidebar == 'footer'){
		echo '';
		echo '';
	}
}
add_action('get_sidebar',
'show_full_width_footer_on_boxed_layout', 9999);

[Andrei]

I think the code got trimmed in here, here is what I’ve been using and it works: http://pastebin.com/qNFxP7Gz
Please note you have to set up your layout as full-width.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jnevent]

This reply has been set as private.

[Andrei]

This reply has been set as private.

[jnevent]

Now it just works with the footer, not the header…

[Andrei]

You’re doing something wrong probably, please share admin credentials and I’ll give a look.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Andrei]

You’re doing something wrong probably, please share admin credentials and I’ll give a look.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[jnevent]

This reply has been set as private.

[Andrei]

This reply has been set as private.

[jnevent]

This reply has been set as private.

[Andrei]

You’ve shared admin credentials but didn’t shared a url of your site.
Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Rincon805]

Yeah, this code snippet didn’t work for me, either. It made the footer almost full width, but the row above it grew a little bit and the header stayed the same.

Thanks for the assist, though.

[Whoweez]

Good day,

I’d appreciate it if someone could assist with this. I need the header to be full width and not boxed. please refer to attached pic.

Thanks 🙂
Whoweez

Attachments:

You must be logged in to view attached files.

[Whoweez]

Oeps, and while we at it, if someone could assist in making the footer and socket full width as well, but separately from the header…

Thanks 🙂
Whoweez

[Andrei]

Hi,

We’re already working on the full browser width menu style and should be released in the next theme update somewhere next week.

A full width footer is not possible when using the boxed layout style, at least not for now.

Please let me know if I can help you with anything else.

Cheers

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Whoweez]

Wow! Thanks Andrei!

Tell me, would the footer at least be full width with the “full width” layout?

Thanks
Whoweez

[Andrei]

The background of it yes, it will be full width, but the data inside it will be wrapped into a inner container, which with a few small tweaks can be extended to full browser width if you like.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

[Whoweez]

Yeh, I’d very much like a full width header and footer 🙂

Thanks. I guess I wait for the update next week…
Whoweez

[Author]

Posts