Twenty Twelve – custom widget area in header –

  • Resolved carlabaldwin

    (@carlabaldwin)


    10 years, 7 months ago

    I am developing a site with Twenty Twelve child theme and have a custom widget in the header. I have the search form and the plugin “Easy Social Icons”. Everything is showing up correctly but I am having trouble getting the search form and social icons to appear on one line.

    Here is what I have in my child theme functions.php:

    <?php
/**
 * Register our sidebars and widgetized areas.
 *
 */
function arphabet_widgets_init() {

	register_sidebar( array(
		'name' => 'Home Top Widget',
		'id' => 'top-home-widget',
		'before_widget' => '<li id="%1$s">',
		'after_widget' => '</li>',
	));
}

add_action( 'widgets_init', 'arphabet_widgets_init' );
?>

    and in my header…

    <div id="top-home-widget" class="top-home-widget">
  <ul>
  <?php if ( dynamic_sidebar('Home Top Widget') ) : else : endif; ?>
  </ul>
</div>

    and my styles..

    .top-home-widget{
	float:right;
	background:transparent;
}
.top-home-widget ul{
	display:inline;
}
.top-home-widget li{
	display:inline;
	list-style:none;
}

    To see the site: http://www.musicmakers4life.com/blog
    thanks in advance!

Viewing 1 replies (of 1 total)
  • Thread Starter carlabaldwin

    (@carlabaldwin)

    10 years, 7 months ago

    Resolved…
    For some reason my display:inline was not working on the
    <li> in the functions.php code so instead I used table cells:

    [Moderator Note: Please post markup between backticks or use the code button. Your posted markup wrecked the display of this post which them has to be fixed manually.]

    function arphabet_widgets_init() {

	register_sidebar( array(
		'name' => 'Home Top Widget',
		'id' => 'top-home-widget',
		'before_widget' => '<td id="%1$s">',
		'after_widget' => '</td>',
	));
}

    and added this to the header.php

    <div id="top-home-widget" class="top-home-widget">
			<table class="vertMiddle"><tr>
			<?php if ( dynamic_sidebar('Home Top Widget') ) : else : endif; ?>
 		</tr>	</table>
 		</div>

    if anyone knows a better/cleaner way, please post.
    thank you!

Viewing 1 replies (of 1 total)
  • The topic ‘Twenty Twelve – custom widget area in header –’ is closed to new replies.