ThemeShaper Forums » Thematic

Themeshaper's Menu/Nav Style

(12 posts)
  • Started 4 years ago by Queequeg
  • Latest reply from Queequeg
  • This topic is resolved
  1. Queequeg
    Member

    Hi Ian!

    I really would like my menu to be the same as the one you're using on Themeshaper.com, but i'd like different colours. I'm working with your Feature Site theme.

    I've been messing with the CSS all night, but i admit, i'm not that great at it and i just can't quite get it right.

    Could you perhaps give me some help or an example of what the CSS changes should look like (or which parts i need to change?) to recreate a menu with the same look? Thanks!

    Posted 4 years ago #
  2. amygail
    Member

    Queequeg,
    Did you take a peek at Themeshaper.com's css?
    It's well commented - just look for 'menu'.

    Posted 4 years ago #
  3. Queequeg
    Member

    Thanks! I used Firebug to do just that, but it hasn't turned out the same. I must have missed something, because on mine:

    1. Each menu 'button' or 'page title' is still white until you hover over it, not that same colour as the nav background is. I don't want those borders around them that make each look seperate.

    2. Also, the 'current page' is white too, i need it to be a different color that will stand out.

    3. I also can't get those sub-page titles in the menu that Ian has in blue... :/

    These are probably basic things, but i'm not that good at CSS and i haven't used WP in a few months so i'm a little rusty :(

    Posted 4 years ago #
  4. Queequeg
    Member

    Ok, so i've fixed some things. My only problems now are:

    On the sub-pages, i'd like blue headings like Ian has. Also, i have a 1px border under each item, i want that to be black so it's not visible.

    Any help appreciated!

    Posted 4 years ago #
  5. Queequeg
    Member

    Further update...

    Every time i get one aspect of the menu right i seem to mess up another. I feel ridiculously silly not being able to do this, so if someone could please show me how i could integrate that particular style of menu into the Feature Site theme, i'd be forever appreciative! Thanks.

    Posted 4 years ago #
  6. :)

    Keep in mind that the settings will be inherited. So you might need to change the next level too.

    Take a look into this thread: http://forums.themeshaper.com/topic/help-with-css-styles-for-drop-down-menus-in-thematic-09

    Chris

    Posted 4 years ago #
  7. Queequeg
    Member

    Oh thank you! That thread helped a LOT!

    The one thing i still don't know how to do, however, is get those blue titles that Ian has on Themeshaper, that are in blue. IE: 'Get Thematic' 'Get a Child Theme' etc.

    Posted 4 years ago #
  8. Store wp_page_menu with echo = FALSE to a variable and use str_replace to insert the h4 headings into the menu structure.

    Chris

    Posted 4 years ago #
  9. Queequeg
    Member

    Okay, forgive me... but... i have no idea what that means :(

    Posted 4 years ago #
  10. Looks like a classic run over :)

    Sorry for this .. I will provide an example later today.

    Chris

    Posted 4 years ago #
  11. .. and here's the example:

    // We need to remove the standard thematic access structure
    function remove_access() {
    	remove_action('thematic_header','thematic_access',9);
    }
    add_action('init', 'remove_access');
    
    // Now let's build our own structure
    function my_access() { ?>
    	<div id="access">
    		<div class="skip-link"><a href="#content" title="<?php _e('Skip navigation to the content', 'thematic'); ?>"><?php _e('Skip to content', 'thematic'); ?></a></div>
    			<?php
    			// We store the whole thing into $menu
                            // .. the important parameter is echo=0
    			$menu = wp_page_menu('sort_column=menu_order&echo=0');
    			// This is our menu item that comes right after our heading
    			$find = '<li class="page_item page-item-341"><a href="http://localhost/support/thematic/code-snippets/" title="Code Snippets">Code Snippets</a></li>';
    			// .. and this is our replacement
                            // .. the heading + the original menu item
    			$replace = '<li><h4>Get a Child Theme</h4></li>' . $find;
    			// Replace it!
    			$menu = str_replace($find, $replace, $menu);
    			// Display the new menu
    			echo $menu;
    			?>
    	</div><!-- #access -->
    	<?php
    }
    // add our own menu structure to the header
    add_action('thematic_header','my_access',9);

    Chris

    Posted 4 years ago #
  12. Queequeg
    Member

    oh thank you so much chris!! i definately would not have got that myself ;)

    the example is really great, i gave it a go and it worked!
    i really appreciate all of your help & efforts... :)

    Posted 4 years ago #

RSS feed for this topic

Reply

You must log in to post.