text between tagline and menu?

  • Author
    Posts
  • #92512

    courtneyamberfleming
    Member
    Original poster

    Hi – bit of a random one here, so no worries if it can’t be done.
    I’d love to add a little spot between the tagline and the menu for another bit of text? I’m trying to insert just a tag saying where I am in the world currently.
    Again, no problem if it’s not possible! Thank you!

    The blog I need help with is: (visible only to logged in users)

    #92612

    binarymoon
    Theme Author

    Hi there – do you have access to the custom CSS addon?

    If so then you can add some custom css that will do something like this.

    p.site-description:after {
        content: 'Currently in Africa';
        display: block;
        font-weight: bold;
        margin-top: 1.5rem;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    Obviously you can edit the content property to say whatever you like. Just make sure to keep the quote marks around the text. Also I can give you some css to change how it looks as well if you let me know what you want there.

    #92638

    courtneyamberfleming
    Member
    Original poster

    Hi! Thank you so much for getting back to me so quick. That’s brilliant. I’ve added it in – any chance of having a small breaker between the tagline and that text, kind of like the one between the text and the menu?
    Really appreciate the help! I’m useless with CSS. Thanks again.

    #92643

    binarymoon
    Theme Author

    You could try this – but I can’t make the border the same width as the other border unfortunately.

    p.site-description:after {
        content: 'Currently exploring: Arizona';
        display: block;
        font-weight: 700;
        margin-top: 2.5rem;
        text-transform: uppercase;
        letter-spacing: .05em;
        border-top: 2px solid rgba(0, 0, 0, 0.05);
        padding: 2.5rem 0 0 0;
    }

    If you wanted to make the borders the same width you could make the lower one wider.

    .masthead .branding:after {
    max-width:auto;
    }
    #92799

    courtneyamberfleming
    Member
    Original poster

    Thank you and sorry for the massively delayed response – I’ve been off the grid for a few days. I’ve popped both of those in, but the lower border isn’t widening up. I’m probably doing something wrong, sorry!

    #92809

    binarymoon
    Theme Author

    You did it right. I got the code a little wrong :) Try the following instead.

    .masthead .branding:after {
    max-width:100%;
    }
    #92832

    courtneyamberfleming
    Member
    Original poster

    Amazing – thank you so much! :)

The topic ‘text between tagline and menu?’ is closed to new replies.