Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Navigation on wordpress text widget help!:D

Discussion in 'Website Design Forum:' started by analogmonkey, Jun 12, 2011.

  1. analogmonkey

    analogmonkey Member

    I'm trying to add some navigation elements to my wordpress portfolio.

    I haven't really got a clue with html and css but have been picking up bits and bobs and need some help.

    I've got the navigation elements in a text widget but can't get them to display right. I want all the text on one line and previous/next on the left hand side and main menu on the right hand side.

    I would also like to add small arrows to the text with a single right arrow at the end of the main menu and a left and right arrow on each end of the previous and next.

    This is the code I've got so far:

    <div id="project-nav">
    <p class="alignleft">
    <div class="viewall">
    <a href="mainmenuurlhere">Main Menu</a>
    </div>

    <p class="alignright">
    <a class="prev" href="prev-url">Previous</a>
    <span class="spacer">/</span>
    <a class="next" href="next-urlhere">Next</a>
    </p>
    <div style="clear: both;"></div>
    </div>
    </div>

    and this is what it looks like:

    [​IMG]

    Can anybody help?
     
  2. aibrean

    aibrean Member

    I don't know. I don't see what your CSS looks like. You are only showing HTML markup. I can tell that you have an open div tag.
     
  3. analogmonkey

    analogmonkey Member

    Done it with a bit of messing about

    <div class="viewall">
    <div class="alignright">
    <a href="http://www.thegraphicsden.co.uk/?page_id=41">Back to Menu</a>
    </div>
    <div class="alignleft">
    <a class="prev" href="prevurl">Previous</a>
    <span class="spacer">/</span>
    <a class="next" href="nexturl/">Next</a>
    </div>
    </div>

    I think it maybe a html only wordpress widget, this one:
    Text Widget Support — WordPress.com

    I wanted to add a directional triangle to each side of previous and next like the pic below, would that be possible or should I look for a html/css widget?

    [​IMG]
     

Share This Page