title in topbar

  • Manasse

    #2943

    Hey all, another question…

    Yes I know, I keep you guys busy and WP keeps me busy, so i got stuck again with something else… Getting closer to having a nice site, though!

    Anyway, I’m trying to put the site title in the top bar. There’s an action hook called “graphene_top_bar”

    Here’s the function code I tried (have put it in my child’s function.php:

    <?php function tws_title_topbar () {
    ?>
    <div id="tws_title"><twoway class="title">TwoWay</twoway><spatie class="title"> </spatie><society class="title">Society</society> </div><?php
    } add_action('graphene_top_bar', 'tws_title_topbar');

    ?>

    No errors, so i must have done something wright. Accidents DO happen or I’m just getting a bit better at this 🙂

    Here’s the Style.css

    #tws_title_topbar{
    .tws_title{
    font-family: impact;
    font-size: 24px;
    font-weight: bold;
    text-shadow: 0.1em 0.1em 0.05em #333;
    text-shadow: 0.1em 0.1em 0.2em black;
    word-spacing: 12px;
    border-style: outset;
    border-color: white;
    margin: 1px 2px 3px 4px;
    padding: 1px 2px 3px 4px;
    text-align: center;
    }
    title.twoway{
    color: red;
    letter-spacing: 3px;
    }
    title.spatie{
    letter-spacing: 5 px;
    }
    title.society{
    color: white;
    letter-spacing: 3px;
    }

    There might be a lot of unnecessary styling in there. I wanted to test some in Firebug and then get the best values…

    If you look at the site twowaysociety.nl/hidden/ you see that next to the social buttons there’s two words in gray. Is the original styling overwriting my own? And, of course, how can I resolve it???

    Cheers

    Josh

    #22739

    You’re thinking about it wrong.

    When you enable an action hook via the admin area, you are essentially creating a new widget area in that part of the code. So, you then go to your widget area and drag a new text or php widget to the new area.

    So, when you enable the graphene_top_bar action hook, you are also creating a graphene_top_bar widget area. You don’t need to add anything to your child theme functions file.

    Instead, go to your widget panel, and insert a new text or php widget into the graphene_top_bar widget area. Next, open that widget and insert your code.

    Lastly, you might have to fine-tune the positioning with some custom css.

    Manasse

    #22740

    Aha! I get it. Watched the ‘advanced’ tutorial and saw you do something with social buttons, so I thought this was kinda like the same… I’ll delete the function add the html-code in the “widget”-section and tweak around witch Firebug… Sounds like fun!

    Thanks again Josh!

    Josh

    #22741

    Haha… yeah, start simple… then move to the advanced 😉

    Manasse

    #22742

    Well. That’s a bummer. It’s still grey. So I think I get the PHP part right, but messing up the style.css. Should there be a # only before functions or also before every class ID (meaning the .tws_title, etc)??

    Josh

    #22743

    Try adding the !important attribute… like this:

    title.twoway{
    color: red !important;
    letter-spacing: 3px;
    }
    title.spatie{
    letter-spacing: 5 px;
    }
    title.society{
    color: white !important;
    letter-spacing: 3px;
    }

    Manasse

    #22744

    Ok. It’s still the same, but zooming in with Firebug, i found out that the color and the font comes from this:

    < body class="home blog logged-in admin-bar custom-background three-col-center three-columns">

    How can I manipulate this without doing to much damage?

    Prasanna SP

    #22745

    Hmm.. Using the same idea in my LOL site – http://letitsnow.in/

    The text Let It Snow In Your Browser!!! is placed in a graphene_top_bar widget and styled it something like this,

    #text-3 {
    padding-left: 130px;
    }

    And the widget content is more or less,

    <br />
    <strong>
    <h2>
    <a href="http://www.letitsnow.in">Let It Snow In Your Browser!!!</a>
    </h2>
    </strong>

    Manasse

    #22746

    Ok, found out what was going wrong. I wrote this in HTML <twoway class="title"> and in css I call title.twoway that should’ve been twoway.title;

    Oh well, got it fixed. A few more things (for now) and it’ll be perfect (till I want to change things, that is)

    Anyone now how to change the pages permalinks? If you go to band it displays “band” in the Navbar (perfect) and band in the sec.menu (perfect) but it shows band in the content part as well.. the code I found with Firebug (can’t mention that too many times :D) says this:

    <a href="http://twowaysociety.nl/hidden/band/" rel="bookmark" title="Permalink to Band">Band</a> I’d like to change the tekst in to Bio

    Prasanna SP

    #22747

    but it shows band in the content part as well..

    Edit page and change it’s title! (You can still have the same URL)

Viewing 10 posts - 1 through 10 (of 14 total)

You must be logged in to reply to this topic.