WordPress.org

Support

Support » Plugins and Hacks » [Resolved] [Plugin: Jetpack by WordPress.com] How I can move sharing button back to left side.

[Resolved] [Plugin: Jetpack by WordPress.com] How I can move sharing button back to left side.

  • I just update jetpack to 1.6 and when I reload pages again all my sharing button move away from the left side. This just ruin my web design. I try to input some Sharing label but did not help anything. I try to change css but nothing work. Could someone help me. If not, I must delete it and downgrade to 1.5 again.

    YwY

    http://wordpress.org/extend/plugins/jetpack/

Viewing 15 replies - 1 through 15 (of 30 total)
  • On your CSS add:

    .sharing {
    padding: 0 !important;
    margin: 0 !important;
    }

    If Antonio’s fix doesn’t work, try this

    Line 121 to 124 in jetpack/modules/sharedaddy/sharing.css locate this block of code

    div.sharedaddy .sd-content {
    	width: 82.125%; /* 530px / 640px */
    	float: right;
    	margin: 0;

    Change the width setting to 100%; (you can leave the rest unchanged.)

    Thank both of you so much.

    I just found about mikeotgaar post above by myself too. But wordpress did not email that to me early. So I confirm change width to 100% solve my problem. Now my website look nice again.

    Ooh, thanks! That was driving me crazy.

    Also, to get rid of that annoying grey line they added in 1.6.1 (between your content and the sharing buttons), comment it out in jetpack/modules/sharedaddy/sharing.css beginning at line 108:

    div.sharedaddy div.sd-block {
    /* border-top: 1px solid #ddd;
    border-top: 1px solid rgba(0,0,0,.13); */
    padding: 10px 0 5px;
    margin: 0;
    width: 100% !important;
    }

    This helped me a lot. Thanks everyone!

    Thanks for the tips. It still did not float right again, so I added this to the same css file:

    div.sharedaddy {
    	float: right;
    }
    jnordstrom

    @jnordstrom

    Hi All,

    I would like to remove the space for the β€œShare” text and center align the share buttons.

    I would be really appreciated if someone could give me a hand with the CSS.

    Here is a link the shows the layout issue: http://www.humanoidplatform.com

    James

    seriousleast

    @seriousleast

    @jnordstrom

    Does this close to the layout you want ?
    http://ruzzme.files.wordpress.com/2012/09/147.jpg

    If you want the layout like in the picture.

    1. Use css editor adjust width first. Default is 82.125%. You can change it more than 100% but I think it harder for align.

    2. I think you should remove print button, may be Email button too. I don’t think someone will print. Goole Plus button should be in same line now.

    3. Now adjust the margin for move button set to center. I adjust the second one (Right margin), from 0px to 20px.

    4. Play and Test πŸ˜€

    CSS File that you need is sharing.css, should be line 121.
    Hope this can help, Sorry for my english πŸ˜€

    jnordstrom

    @jnordstrom

    Perfect thank you so much for your help.

    Is there a way to make these CSS edits in my main CSS file rather than in the sharedaddy/sharing.css file? I’m concerned that I would have to re-implement them every time I update the plugin if I commit them directly to the sharing.css file.

    I basically just want to add some space between the end of the article and the sharing buttons. Should I use margins for that?

    1. I think take a note what we need to do every time when we update will be easier. I have a same problem but not too bad if we know what to do.

    2. Yes, you can use top margin. try with “div.sharedaddy div.sd-block” it work with me.

    I’ve tried the above code snippets and none of them work. Neither the alignment nor the line (which doesn’t bother me). Any idea how I can move the icons to the left and put more space between them? http://blog.stratamp.com/

    I have tried every possible combination of classes or id’s in the source code of the page. The only one that does anything is the individual anchor class name – which is numbered, so it can’t be used because it only affects one set of icons on the page.

    Plugin Author Jeremy Herve

    @jeherve

    @charles_i Try adding the following code to your custom CSS:

    div.sharedaddy .sd-content {
        float: left !important;
    }
    
    div.sharedaddy .sd-content ul li {
        margin: 0 25px 5px 0 !important;
    }

    Brilliant! Thanks. I thought I tried every combination I could but I didn’t have that second one with the ul li written like that.

    Charles

    Any idea how to put the social icons on top of the post as well as on the bottom of content ?

    Thank you

Viewing 15 replies - 1 through 15 (of 30 total)
  • The topic ‘[Resolved] [Plugin: Jetpack by WordPress.com] How I can move sharing button back to left side.’ is closed to new replies.