Adding Header Links

  • Author
    Posts
  • #1409954

    groovethink
    Member

    I would like to add in links to the right of my header (next to the header image).

    The links I want to use are currently in the footer of my website on my home page. They are under the section entitled “Connect.”

    There isn’t a header bar where I could just drop a widget in there, so I guess I’d have to change the coding (not sure though). I would like the links to be just an image that is clickable and will open a new window for the link. Plus I would also like to be able to have them listed horizontally… just across from Groove Think.

    Is this possible?

    Frederick Jones

    The blog I need help with is groovethink.com.

    #1410079

    timethief
    Member

    This thread will be moved to the CSS Forum for you. Please do not create a duplicate thread.

    #1410277

    Fredrick, give the following a try. I’ve aligned it sort of to the right of the menu. You can adjust the “top” and “right” values to move it around to where you want it.

    #linkcat-2099498 {
        position: absolute;
        right: 50px;
        top: 220px;
        width: 250px;
    }
    #linkcat-2099498 ul {
        display: inline-flex;
        list-style: none outside none;
    }
    #linkcat-2099498 h1 {
        display: none;
    }
    #1410279

    groovethink
    Member

    @thesacredpath,

    Thanks man. That worked perfectly. Great work.

    I have another question located below. Not sure if you work strictly in CSS… but this one seems to be simpler.

    https://en.forums.wordpress.com/topic/editing-my-posts-pages?replies=1#post-1408557

    #1410282

    @groovethink, you are welcome. I just noticed one alignment issue in Safari, so replace the code I had previously given with the below and it will take care of the Safari issue.

    #linkcat-2099498 {
        position: absolute;
        right: 150px;
        top: 150px;
        width: 300px;
    }
    
    #linkcat-2099498 ul {
        list-style: none;
    }
    
    #linkcat-2099498 h1 {
        display: none;
    }
    
    #linkcat-2099498 ul li {
        display: inline;
    }

    I’ll take a look at your other topic and see what I can do.

    #1410284

    groovethink
    Member

    Awesome, thanks.

    #1410286

    You are welcome.

The topic ‘Adding Header Links’ is closed to new replies.