WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] [Plugin: Simple Facebook Connect] is it possible to align button w/ STC button? (14 posts)

  1. derekbeck
    Member
    Posted 3 years ago #

    Hi Otto,

    is it possible to align the [Plugin: Simple Facebook Connect] to [Plugin: Simple Twitter Connect]? That is, to have them both in one line?

    Thanks,
    Derek

  2. derekbeck
    Member
    Posted 3 years ago #

    I should clarify, I want to align the buttons in the comment section, as on my site, for instance: http://www.derekbeck.com/1775/info/protests-at-funeral/

    (see the comments section)

    Thanks,
    Derek

  3. Samuel Wood (Otto)
    Tech Ninja
    Posted 3 years ago #

    You use CSS to position them, like everything else on your page.

    For example, if you wanted them to float on the right hand side, then you could use this:

    #alt-login-methods {
    float:right;
    }

    If you wanted them to be inline, you could use something like:

    #alt-login-methods p {
    float:left;
    }

    Or something similar. How you arrange things on the page is up to the theme, not the plugin.

  4. derekbeck
    Member
    Posted 3 years ago #

    Ok, thanks. I guess I didn't realize I could individually control the "p" elements within the div alt-login-methods. Thought I needed to have a different div for each button, which there isn't.

    Thanks for the answer on the rookie question!

    derek

  5. derekbeck
    Member
    Posted 3 years ago #

    Otto, I would recommend on the next release of Simple Twitter Connect that you change the images for the twitter to be 22 px high instead of the 24 you have now, so that it is the same height as the facebook image and aligns better. I did this myself in photoshop, and will email you them for your convenience, that you might replaced the ones you were using for the next update.

    if curious, you can now see it aligned as I so desired, twitter and facebook buttons, at:

    http://www.derekbeck.com/1775/info/protests-at-funeral/

  6. brendanpatrickhughes
    Member
    Posted 3 years ago #

    Hi there, sorry to be a dolt. Where in the CSS files do you put this code?

    Thanks!

  7. derekbeck
    Member
    Posted 3 years ago #

    Here's the code I used:

    [CSS moderated as per the Forum Rules. Please just post a link to your site.]

    I put it in my theme (Atahualpa), which is highly customizable and has a CSS place for custom CSS.

    But if you go to your WP Dashboard>Appearance>Editor (which will edit your theme, and if you change or maybe even upgrade themes, you'll have to do this again), you should find some kind of stylesheet, probably called style.css. You should be able to put the above code there.

    Hope that helps!

    Derek

  8. derekbeck
    Member
    Posted 3 years ago #

    Okay, I've tweaked the above a bit, as it had glitches in IE8. This appears to work fine for me now:

    [CSS moderated as per the Forum Rules. Please just post a link to your site.]

  9. coolnesscomplex
    Member
    Posted 3 years ago #

    Hey Derek, I'm trying to align the Share and Tweet buttons at the bottom of my posts at
    http://www.coolnesscomplex.com

    Can you please tell me exactly where I should place your revised code into my stylesheet? Do I need to put any characters before and after your code? Thanks!

  10. coolnesscomplex
    Member
    Posted 3 years ago #

    Duh, sorry Derek, I finally realized that your code does not apply to the two buttons I mentioned above. No wonder the code wasn't working for my buttons!!

    Can anyone out there suggest what this idiot should do to align those stupid Share/Tweet buttons...? Thanks in advance!

  11. derekbeck
    Member
    Posted 3 years ago #

    Whoever was the moderator that pulled the CSS, you really turned this useful post into a useLESS one. The nebulous rules regarding how much code is acceptable should not trump common sense. Clearly two other people have found this CSS useful, and now, with one fell swoop, you've made this post useless. What value did you provide by removing it?

  12. coolnesscomplex
    Member
    Posted 3 years ago #

    I know, right? ;)

  13. derekbeck
    Member
    Posted 3 years ago #

    Here's the CSS that was removed, compressed, no comments, to be below the arbitrary 10 lines of code limit:

    div#alt-login-methods {
    margin-bottom: 10px; display: inline; clear: both;
    }
    div#alt-login-methods p {
    clear: right; display: inline; padding-right: 10px; vertical-align: top;
    }
    div#alt-login-methods a:link, div#alt-login-methods a:visited,
    div#alt-login-methods a:hover, div#alt-login-methods a:active {
    text-decoration: none; font-style: normal;
    }

    Not sure if the above code will work unless you put each of the CSS controls onto their own lines:

    e.g.

    css{
    example:style;
    example2:style;
    }

  14. derekbeck
    Member
    Posted 3 years ago #

    Coolness: thanks for posting your website. As you figured out and noted in a private email to me, but that I'd like to post here in case some other future reader finds it useful: the Share and Tweet buttons are a different feature, not covered by this plugin or thread.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags