How do I style horizontal menu?

  • quercus

    (@quercus)


    15 years ago

    OK, I feel like I’m going nuts. I have a basic grasp of how to do things in html and CSS, and I put together an OK website. But my whole blog (except for the stylesheet) is in php. I don’t understand how to link php together with the stylesheet that governs it.

    My blog is at https://bendingtreearts.com/blog

    I want to make a HORIZONTAL nav menu just below my blog header, to have a link to my home page, and also links to other pages (like “about”).

    Two links currently exist, in default design form, which is plain and VERTICAL. I want the links in boxes, and have them be a certain font and color and so on.

    I’m working with Thematic, and I have a child theme. I a functions.php file into my child theme, which is responsible for inserting the link to my blog home page.

    Here’s my entire functions.php file:

    <?php
    function childtheme_menu_args($args) {
    $args = array(
    ‘show_home’ => ‘Home’,
    ‘sort_column’ => ‘menu_order’,
    ‘menu_class’ => ‘menu’,
    ‘echo’ => true
    );
    return $args;
    }
    add_filter(‘wp_page_menu_args’,’childtheme_menu_args’);
    ?>

    My main question is, how do I link my stylesheet up to this php function, so that the menu is styled the way I want? I removed all the #menu portion of my stylesheet and nothing changed. The whole menu is currently styled according to some kind of default theme setting.

    I feel like there must be a really obvious answer to this question, but I’m just befuddled.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Michael

    (@alchymyth)

    have you read this yet?

    not knowing your level of html/css knowledge, here the basics:

    general, the php file/function will generate some html code with html tags ( id=”something” or class=”someother” ). you can see these html tags when you view your source in the browser.
    for instance:
    <div id="something"> outputtextblablabla </div>

    you style these id or class in your css,
    for instance:

    #something {height: 15px; }
.someother {height: 20px; }

    and so on.

    Thread Starter quercus

    (@quercus)

    alchymyth, thank you. This is the very first time anyone has ever told me that the php file generates html, or that it is possible to view the source code of my blog. Some of us are working at levels of knowledge so basic that we don’t even understand the basic tools available to us.

    I had already read the codex page you linked to, over and over, trying to understand how the html list example they show there relates to the php functions file in my child theme.

    On that codex page, they assume that you’re editing your header.php file, but if you’re using a child theme, the only files you edit are your style sheet and your functions.php file.

    In any case, I have partly fixed my problem by updating my style sheet. It had lacked the @import urls for basic image styles, and basic themes and colors. Once I added those to my style sheet, there was magically a horizontal page menu where I wanted it.

    Now I just have to figure out how to make it pretty.

    Thanks again for your help.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How do I style horizontal menu?’ is closed to new replies.