WP theme gurus inside please

[donnie]

If a theme has a left and right sidebar can you change it to show the widgets in the header, there is no header side bar available.

Thanks

[Slim]

It's code so it can be done I just have no code skills to do it though,good luck.

[Colmike7]

https://codex.wordpress.org/Widgetizing_Themes

[donnie]

https://codex.wordpress.org/Widgetizing_Themes

thanks will get on it tonight after I finish my postings

[donnie]

Colmike7 I looked and looked and looked at that link, I can not figure out how to take the widgets I have on my site and instead of displaying them on the left or right have them show up on top, any help is real appreciated.I have the widgets all there just want them showing up in the header are.
Thanks for reading and the help.

[Colmike7]

It depends on what up top means. But this should help:

To start, in functions.php you will put this code:

Code: Select all

function top_widgets_init() {
 
    register_sidebar( array(
        'name'          => 'Header Widget Area',
        'id'            => 'top-header-widget',
        'before_widget' => '<div class="whateveryouwant">',
        'after_widget'  => '</div>',
        'before_title'  => '<h2 class="whateveryouwantagain">',
        'after_title'   => '</h2>',
    ) );
 
}
add_action( 'widgets_init', 'top_widgets_init' );

Then, at this point you'll see a "Header Widget Area" in the widgets section. Add something there if you want.

Then paste this code in either header.php or wherever the header area that you want the widgets to go is:

Code: Select all

<?php
 
if ( is_active_sidebar( 'top-header-widget' ) ) : ?>
    <div id="header-widget-area" class="top-widget-area widget-area" role="complementary">
    <?php dynamic_sidebar( 'top-header-widget' ); ?>
    </div>
     
<?php endif; ?>

At this point, widgets should show up top where you pasted the code, but they won't look good yet. So, add in this CSS to start:

Code: Select all

div#header-widget-area {
    width: 100%;
    background-color: #f7f7f7;
    border-bottom:1px solid #eeeeee;
    text-align: center;
}   
h2.whateveryouwantagain {
    margin-top: 0px;
    text-align: left;
    text-transform: uppercase;
    font-size: small;
    background-color: #feffce;
    width: 130px;
    padding: 5px;
    }

(Example for a full width widget area up top.)

[BrasSmonkey]

yeah you can google all that to add widgets

[urbanlegend]

Good to know you can do this, it makes using themes much more effective when you like the theme but the side bars are not where you want them.

[blingman]

why themes do not have a left, right header and footer widget area by default is my question.

[TheButcher]

why themes do not have a left, right header and footer widget area by default is my question.

How I see it the guy or gal who designs the theme has their own idea how it would look like so they make it functional for that look.

[greatpornlinks]

It depends on what up top means. But this should help:

To start, in functions.php you will put this code:

Code: Select all

function top_widgets_init() {
 
    register_sidebar( array(
        'name'          => 'Header Widget Area',
        'id'            => 'top-header-widget',
        'before_widget' => '<div class="whateveryouwant">',
        'after_widget'  => '</div>',
        'before_title'  => '<h2 class="whateveryouwantagain">',
        'after_title'   => '</h2>',
    ) );
 
}
add_action( 'widgets_init', 'top_widgets_init' );

Then, at this point you'll see a "Header Widget Area" in the widgets section. Add something there if you want.

Then paste this code in either header.php or wherever the header area that you want the widgets to go is:

Code: Select all

<?php
 
if ( is_active_sidebar( 'top-header-widget' ) ) : ?>
    <div id="header-widget-area" class="top-widget-area widget-area" role="complementary">
    <?php dynamic_sidebar( 'top-header-widget' ); ?>
    </div>
     
<?php endif; ?>

At this point, widgets should show up top where you pasted the code, but they won't look good yet. So, add in this CSS to start:

Code: Select all

div#header-widget-area {
    width: 100%;
    background-color: #f7f7f7;
    border-bottom:1px solid #eeeeee;
    text-align: center;
}   
h2.whateveryouwantagain {
    margin-top: 0px;
    text-align: left;
    text-transform: uppercase;
    font-size: small;
    background-color: #feffce;
    width: 130px;
    padding: 5px;
    }

(Example for a full width widget area up top.)

Nice piece of tutorial

[HeidiHoe]

It's not a good idea to modify the code in your themes. When the theme gets updated your modifications get wiped out.

It's better to create a child theme and do your modifications there instead. Child themes are called before parent themes. Any code and/or files placed in the child will be added to or override the parent. This way when the theme gets updated your modifications won't be wiped out.

It's also a good practice to check the child when the parent updates to ensure none of the changes made in the parent conflict with your mods made via child.

It takes a minute to create a child theme. All it is is a folder containing a style and a functions file each with a couple lines of code. It's stupid simple and will save you headaches down the road.

Wordpress.org has easy to follow instructions on child themes. There's also plugins which I think is kind of idiotic.

[Colmike7]

It's not a good idea to modify the code in your themes. When the theme gets updated your modifications get wiped out.

It's better to create a child theme and do your modifications there instead. Child themes are called before parent themes. Any code and/or files placed in the child will be added to or override the parent. This way when the theme gets updated your modifications won't be wiped out.

It's also a good practice to check the child when the parent updates to ensure none of the changes made in the parent conflict with your mods made via child.

It takes a minute to create a child theme. All it is is a folder containing a style and a functions file each with a couple lines of code. It's stupid simple and will save you headaches down the road.

Wordpress.org has easy to follow instructions on child themes. There's also plugins which I think is kind of idiotic.

True. I've made a few themes from scratch lately and I wasn't thinking about it being a theme with updates. :p
The first time you make changes to a theme and an update wipes it out, that's usually when most people learn about child themes lol.

[minkal]

https://codex.wordpress.org/Widgetizing_Themes

Nice link appreciate you sharing it it came in handy