How to reduce font size of Menu bar in header OR reduce spacing between each Tab

Viewing 11 replies - 1 through 11 (of 11 total)
  • Sam

    (@soumendra)

    9 years, 1 month ago

    Hello,

    You can try this to your Custom CSS for achieving that:

    .navbar .nav > li > a {
font-size: 15px;
padding: 5px 10px;
}

    Thank You.

    Thread Starter SpiritualTravel

    (@spiritualtravel)

    9 years, 1 month ago

    Hi Sam,

    Thanks for the suggestion.

    I’ve added the codes to my Custom CSS but it didn’t make any changes. I’ve tried increasing and decreasing the px numbers but I cannot see any noticeable changes.

    Any other suggestions?
    Thanks.
    Karen

    Sam

    (@soumendra)

    9 years, 1 month ago

    Hello,

    Have you remove that code from your site because I cannot see that there. Please add that again and try deactivating all your plugins to see if that helps.

    Thank you.

    Sam

    (@soumendra)

    9 years, 1 month ago

    Hello,

    If that won’t help try this instead:

    .navbar .nav > li > a {
font-size: 15px !important;
padding: 5px 10px !important;
}

    Thank You.

    Thread Starter SpiritualTravel

    (@spiritualtravel)

    9 years, 1 month ago

    Hi Sam – still nothing. I’ve left the code in, so if you want to take a look. I’ve changed some of the px values to test.

    As for plugins… I don’t have much to start but they are necessary for my site, so leaving them off for this to work is not possible.

    Thanks in advance

    Sam

    (@soumendra)

    9 years, 1 month ago

    Hello,

    Try adding the above code at the top of your Custom CSS to see if that help.

    If not then you have added this in your Custom CSS:

    body,.navbar .nav>li>a {
            font-size : 18px;
            line-height : 24px;
          }

    replace this with this:

    body,.navbar .nav>li>a {
            line-height : 24px;
          }
    Rocco Aliberti

    (@d4z_c0nf)

    9 years, 1 month ago

    Hi Sam,
    she can’t replace that ’cause is added by customizr itself.
    So she has to override it.
    Your suggestion:

    .navbar .nav > li > a {
font-size: 15px !important;
padding: 5px 10px !important;
}

    thus, must work! 😉

    Thread Starter SpiritualTravel

    (@spiritualtravel)

    9 years, 1 month ago

    Hey guys,

    I tried that and still no change. Does the code need to be different that Customizr has a regular main menu and a sticky menu which I utilize??

    Rocco Aliberti

    (@d4z_c0nf)

    9 years, 1 month ago

    Hi,
    most likely this is the issue:

    <!-- Google Tag Manager -->

(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({\'gtm.start\':
new Date().getTime(),event:\'gtm.js\'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=\'dataLayer\'?\'&l=\'+l:\'\';j.async=true;j.src=
\'//www.googletagmanager.com/gtm.js?id=\'+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,\'script\',\'dataLayer\',\'GTM-M23MBG\');
<!-- End Google Tag Manager -->

.navbar .nav > li > a {
font-size: 15px !important;
padding: 1px 5px !important;
}

    you put the google tag manager inside the css box.
    You cannot do that.
    So remove it from there, and if you want put it in your child-theme functions.php following this example: http://themesandco.com/snippet/adding-google-analytics-customizr/
    It’s the same thing.

    Thread Starter SpiritualTravel

    (@spiritualtravel)

    9 years, 1 month ago

    Hi d4z_c0nf,

    Okay – so I finally got the child theme installed.

    To clarify – I’ve placed the google tag manager codes inside functions.php file
    And… placed the style change related codes in the child theme style.css file.

    I have chosen to hide the codes to the tag manager for now because I know my tags are a mess.

    But now I get this error and cannot save my functions.php file

    Parse error: syntax error, unexpected ‘<‘ in /home/content/p3pnexwpnas07_data02/16/2484816/html/wp-content/themes/srt-child-theme/functions.php on line 4

    <?php
/* Write your awesome functions below */

/*-- Google Tag Manager --

(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({\'gtm.start\':
new Date().getTime(),event:\'gtm.js\'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!=\'dataLayer\'?\'&l=\'+l:\'\';j.async=true;j.src=
\'//www.googletagmanager.com/gtm.js?id=\'+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,\'script\',\'dataLayer\',\'GTM-M23MBG\');
-- End Google Tag Manager --*/

/* Google analytics */
add_action('wp_head','my_analytics', 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-60995931-1', 'auto');
  ga('send', 'pageview');
<?php include_once("analyticstracking.php") ?>
}

</script>

    Sorry for so many questions. I’m learning this stuff from scratch.
    Thanks!

    Thread Starter SpiritualTravel

    (@spiritualtravel)

    9 years, 1 month ago

    This is getting out of control – after the installation of the child theme – the customization of the sticky menu’s logo is no longer valid. Also no changes is to be seen with the menu bar text size or spacing.

    I’ve taken 5 steps backwards… HELP please!

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘How to reduce font size of Menu bar in header OR reduce spacing between each Tab’ is closed to new replies.