Center Customizr Menu

I finally resolved this problem by adding this filter to my functions.php (courtesy of Mike Sneed in a post this week):

add_filter( 'tc_navbar_wrapper_class',  'rdc_navbar_wrapper_class' );
function rdc_navbar_wrapper_class() {
     return array('navbar-wrapper', 'clearfix', 'span12');
}

Thanks, Mike!

Hound Dog, would you mind sharing the whole code (style.css and functions.php)?

I tried to use https://themesandco.com/snippet/center-header-block-items/ but it does not work.

Thanks!

Here’s style.css:

/*
Theme Name: Customizr Child
Version: 1.0
Description: A child theme of Customizr
Template: customizr
*/

/* HIDE SOCIAL ICONS */
.navbar-wrapper .navbar.resp .social-block {
display:            none;
}

/* CENTER MENU */
.navbar-wrapper .navbar.resp ul.nav.tc-hover-menu {
display:            block;
float:              none;
width:              100%;
margin:             0 10%;              /* Adjust +/- % if needed */
}

/* Variable number of floating elements */
.navbar-wrapper .navbar.resp .nav        {
float:              none;
width:              100%;
text-align:         center;
}

.navbar-wrapper .navbar.resp .nav > li {
float:              none;
display:            inline-block;
}

/* Adjust margin/padding */
.navbar-wrapper .navbar.resp .navbar-inner {
margin: 0px 0px;
padding: 0px 0px;
}

/* Remove page titles */
.page h3.entry-title {
display: none;
}

.menu-item {
text-align: left;
}

/* Adjust menu for smaller devices */
@media (max-width: 979px) {

.navbar .navbar-inner {
float: left;
    min-width: 180px
}

.navbar .btn-navbar {
    float: none;
}
.navbar-wrapper .navbar.resp .nav > li {
float:      none;
display:    block;
}
.btn.btn-navbar {
    margin-left: 40px;
}

}

And here’s functions.php:

<?php
/**
 * Enqueues child theme stylesheet, loading first the parent theme stylesheet.
 */
function themify_custom_enqueue_child_theme_styles() {
	wp_enqueue_style( 'parent-theme-css', get_template_directory_uri() . '/style.css' );
	wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'theme-style' ) );
}
add_action( 'wp_enqueue_scripts', 'themify_custom_enqueue_child_theme_styles', 11 );
add_filter('tc_credits_display', 'my_custom_credits');
function my_custom_credits(){
return '
<div class="span4 credits">
                    <p></p>        </div>';
}
add_filter('tc_content_title_tag' , 'my_title_tag');
function my_title_tag() {
    return 'h3';
}
add_filter( 'tc_navbar_wrapper_class',  'rdc_navbar_wrapper_class' );
function rdc_navbar_wrapper_class() {
     return array('navbar-wrapper', 'clearfix', 'span12');
}
add_action('wp_head','my_analytics',1,20);

function my_analytics() {
 ?>

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-56805999-1', 'auto');
  ga('send', 'pageview');

</script>

 <?php
}
?>

Thanks!

I’m using a box around the navbar. I’m hiding the social icons. So, my menu items seem closer to the top than in the (vertically) middle of the box. Is there any way to vertically center the menu within the navbar box?