Move sharing buttons below post title

  • Author
    Posts
  • #1264325

    raph972
    Member

    Is it possible to move the sharing buttons below the title instead of having them at the end of the post?
    Some of my posts are very long, so it is particularly inconvenient to have the sharing buttons at the end.

    The blog I need help with is alnakhlah.org.

    #1264429

    In most themes, this is problematic, but this theme was done right. Add the following to your CSS and see what you think.

    .entry-content {
    position: relative;
    padding-top: 70px;
    }
    
    .post div.sharedaddy div.sd-sharing {
    position: absolute;
    top: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.13);
    }
    #1264430

    Also in the future if you could post CSS related questions in the CSS forum, it would help those of us who help with the CSS to answer your questions sooner. We volunteers don’t always have the time to look through the main forums in search of CSS questions and look in the CSS forum first. It will most times speed up getting a solution. Thanks.

    #1264433

    raph972
    Member

    I usually do post in the CSS forum; this time, I simply wasn’t sure if CSS was the way to do it.

    It looks great in the posts, but the archive page looks terrible (http://alnakhlah.org/category/archives/) with a big space between post titles and excerpts. Do you see a way to remedy this?

    #1264434

    Let me take a look. We might have to adjust the archives pages separately using more specific selectors.

    #1264435

    That was easy (I think). Remove what I gave originally and add this. This specifically targets the single post pages and leaves the archives, categories and tags pages alone.

    .single.entry-content {
        padding-top: 70px;
        position: relative;
    }
    
    .single.post div.sharedaddy div.sd-sharing {
        border-bottom: 1px solid rgba(0, 0, 0, 0.13);
        position: absolute;
        top: 0;
    }
    #1264437

    raph972
    Member

    Now the archive page is fine but the sharing buttons are back at the bottom of posts

    #1264439

    Well, that was a challenge. Give this a try. This seems to work.

    .single div.entry-content {
        padding-top: 70px;
        position: relative;
    }
    
    .single.post div.sharedaddy div.sd-sharing {
        border-bottom: 1px solid rgba(0, 0, 0, 0.13);
        position: absolute;
        top: 0;
    }
    #1264443

    raph972
    Member

    I cannot see a difference

    #1264445

    Sorry, Firebug and Firefox blew up on me and then there was a Firebug update. I’ve rebooted. This will do it. No, really it will!!! Why are you snickering??? :)

    .single div.entry-content {
        padding-top: 70px;
        position: relative;
    }
    .single div.post div.sharedaddy div.sd-sharing {
        border-bottom: 1px solid rgba(0, 0, 0, 0.13);
        position: absolute;
        top: 0;
    }
    #1264446

    raph972
    Member

    Well, you seemed bored so I was simply trying to challenge you!! :)

    Worked perfectly, now I can go sleep at peace. Thanks!

    #1264447

    You are welcome and sorry it too so long. Some of the newer themes are kind of challenging.

    Thanks for keeping me from getting bored. :)

The topic ‘Move sharing buttons below post title’ is closed to new replies.