• Resolved eloisg_

    (@eloisg_)


    Hi,

    I have an issue with centring the title on my page. I have managed to get the menu/navigation bar underneath which is what I wanted but I’m not managing to center the title. I’d also like to make the space for the title bigger, as I eventually want to put in a logo that someone is designing for me in its place.
    I have tried what feels like EVERYTHING, but I am a new user (been at this for two days) and I can’t figure it out.
    I have made a child theme and I copied the code from the colour-appropriate .css file from the original folder.

    Here is the code that I have found for the header and title, and what I’ve done so far to get the navigation bar underneath the title instead of on the same level to its right:

    @import url(“../customizr/style.css”);

    .tc-header .brand {
    float: center;
    text-align: center;
    margin: 0px;
    padding: 0px;
    /* Increase vertical padding to match navbar links */
    font-size: 16px;
    font-weight: bold;
    min-width: 250px\9;

    /* IE 8 and below */

    }
    .tc-header .brand h1 {
    font-size: 45px;
    }
    .tc-header .brand a {
    text-decoration: none;
    margin: 10px 0;
    display: block;
    }
    .tc-header .outside {
    display: none;
    }

    .navbar-wrapper.clearfix.span9 {
    width: 100%;
    margin: 0%;
    }

    .navbar-wrapper .navbar {width:100%; float:right}
    .header-spacer {
    height: 10px !important;
    }

    Hopefully someone can help me out??

    Cheers,
    Elo?se

Viewing 13 replies - 1 through 13 (of 13 total)
  • Hi Elo?se.

    Check out this snippet and lots of other at the themesandco site.

    Thread Starter eloisg_

    (@eloisg_)

    Hi, thank you. However it’s still not working! I don’t know what I’m doing wrong, I copied the whole thing and my title is still to the left of the screen, not in the center. I don’t know what I should adjust to work it out?

    Cheers

    could you provide a link to your site?

    Thread Starter eloisg_

    (@eloisg_)

    https://66.147.244.220/~jardinf0/

    I’ve also somehow deleted the text in the green buttons under the three circular photo icons under the display banner, no idea how I did that. Would be glad to know how to put it back!

    Thread Starter eloisg_

    (@eloisg_)

    Never mind about the button text thing, I figured it out ??

    Ok, you have this in your child-theme style.css:

    // START OF Center Header Block Items (Needs additional CSS code in Child Theme style.css)
    // NAVBAR WRAPPER //
    add_filter('tc_navbar_display', 'rdc_navbar_display');
    function rdc_navbar_display($output) {
    return preg_replace('|navbar-wrapper clearfix span9|', 'navbar-wrapper clearfix', $output);
    }
    
    // LOGO //
    // center the logo
    add_filter('tc_logo_text_display', 'rdc_custom_center_brand');
    add_filter('tc_logo_img_display', 'rdc_custom_center_brand');
    function rdc_custom_center_brand($output) {
    return preg_replace('|span3|', 'span12', $output);
    }
    
    // TAGLINE //
    // center the Tagline
    add_filter('tc_tagline_display', 'rdc_tagline_display');
    function rdc_tagline_display($output) {
    return preg_replace('|span7|', 'span12', $output);
    }
    
    // SOCIAL ICONS //
    // center the output of tc_social_in_header:
    add_filter('tc_social_in_header', 'rdc_social_in_header');
    function rdc_social_in_header($output) {
    return preg_replace('|span5|', 'span12', $output);
    }

    You must put php code in your child-theme functions.php not in style.css, as stated in the snippet.
    Then you need the css part, and that one must go in the child-theme style.css.
    About text in the featured pages button:
    Appearance -> Customize -> Front Page -> Featured Page Options -> Button Text
    default was: “Read more ?”

    Hope this helps.

    Thread Starter eloisg_

    (@eloisg_)

    Ok thank you, I didn’t really understand that part. However, I don’t know how to make changes to the functions.php thing…
    I just read that I needed to use the “Editor section” to change the css thing but have no idea how to access the php part?

    Sorry about all the questions, I really quite terrible at this!

    Then I suggest you to read some docs, that will reassure you ??
    https://www.themesandco.com/snippet/creating-child-theme-customizr/
    https://www.themesandco.com/customizr/how-to-customize-customizr-wordpress-theme/

    Basically you need a simple file in your child-theme named functions.php which has to be like this:

    <?php
    /* PUT YOUR PHP CODE BELOW*/

    And put that php code after that line.

    Thread Starter eloisg_

    (@eloisg_)

    IT WORKED!

    Thank you so much!
    Sadly, I have another question. I have tried to modify several more things, like trying to modify the size of the title for example. It doesn’t seem to work when I change stuff in the .css file, so do I always need to write code in the .php file too?

    Cheers

    Nope.
    Css in the css file
    php in the php file ??
    Size of the title?
    Something like this?

    .tc-header .brand h1 {
        font-size: 75px;
        line-height: 75px;
    }

    I suggest you to take a look at these resources:
    https://www.themesandco.com/snippet/firebug-best-spent-6-minutes/
    https://www.themesandco.com/customizr/guide-css-html-customizr-wordpress-theme/
    https://www.themesandco.com/customizr/css-glossary-for-the-customizr-wordpress-theme/

    Thread Starter eloisg_

    (@eloisg_)

    Thank you so much!! I feel like I’ve been banging my head against a wall for the past two days and I’m maybe finally getting it ??

    Thanks again!

    Glad you’re now on the right track.
    Could you mark this topic as resolved?
    Thank you.

    Thread Starter eloisg_

    (@eloisg_)

    Yep!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Centering the website title on Customizr’ is closed to new replies.