Forums

[resolved] Sliding doors CSS technique to custom menu (9 posts)

  1. Ann-Sophie
    Member
    Posted 1 year ago #

    Hi,

    I'm all new to WordPress. So maybe this is a stupid question. But I don't really know how to solve it. I want WordPress to be the CMS of my website so here it goes...
    http://www.jamandcheese.be/wordpress

    I want the sliding doors technique to work. In the regular HTML & CSS, I used a <span>-tag to each list item in the navigation. I'm using a custom menu, so I can't add the <span>-tag to the items. Please help...

  2. Ann-Sophie
    Member
    Posted 1 year ago #

  3. alchymyth
    The Sweeper
    Posted 1 year ago #

    http://codex.wordpress.org/Function_Reference/wp_nav_menu

    check the parameters

    $before
    (string) (optional) Output text before the <a> of the link
    Default: None
    $after
    (string) (optional) Output text after the <a> of the link
    Default: None
    $link_before
    (string) (optional) Output text before the link text
    Default: None
    $link_after
    (string) (optional) Output text after the link text
    Default: None

  4. Ann-Sophie
    Member
    Posted 1 year ago #

    Do you mean I need to put <span>-tag before and after?
    I'll try it...

  5. Ann-Sophie
    Member
    Posted 1 year ago #

    <ul id="navigation">
       	<?php wp_nav_menu( array(
    	'menu' => 'custom menu' ,
    	'before' => '<span>' ,
      	'after' => '</span>' ));
    ?>

    This is my code now. Is this correct? I don't know any PHP, sorry if this is ridiculous...
    I need a <span>-tag around each element to get my CSS working.

  6. alchymyth
    The Sweeper
    Posted 1 year ago #

    seems to be working:

    this is the html of one of the menu links (from the browser):

    <li id="menu-item-5" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-5"><span><a href="http://www.jamandcheese.be/wordpress/category/portfolio/">Portfolio</a></span></li>

    it shows the span around the link html.

  7. Ann-Sophie
    Member
    Posted 1 year ago #

    Oh right indeed :)
    It should be inside the <a></a> of course...

  8. alchymyth
    The Sweeper
    Posted 1 year ago #

    It should be inside the of course...

    of course - even if you haven't mentioned this so far... ;-)

    try the other parameters:

    <ul id="navigation">
       	<?php wp_nav_menu( array(
    	'menu' => 'custom menu' ,
    	'link_before' => '<span>' ,
      	'link_after' => '</span>' ));
    ?>

    http://codex.wordpress.org/Function_Reference/wp_nav_menu

  9. Ann-Sophie
    Member
    Posted 1 year ago #

    Sorry I didn't mention that, but for me, this is really a trial by error :)
    Thanks though, because this is working now! Problem solved.

Topic Closed

This topic has been closed to new replies.

About this Topic