WordPress.org

1. carriegisaac
   Member
   Posted 2 years ago #

   Have both Facebook Share Button and TweetMeme installed on http://springsbargains.com. I would like to be able to put these two on top of each other, instead of side by side. How would I do this?

   Carrie

2. carriegisaac
   Member
   Posted 2 years ago #

   Never mind, I found a fix in the comment thread on this site: http://www.chethstudios.net/2009/09/facebook-share-count-button-blogger.html

   Use this for your wrapper style:

   bottom:-65px; float:left; left:-62px; margin-bottom:65px; margin-right:-52px; position:relative;

3. miimusic
   Member
   Posted 2 years ago #

   Hi

   Can you help me with this too? Where in the code do I paste this? I've vere edited this code (or any code) before so I doin't know where to put this bit and what to delete.

   Please???

   BTW, I thought this plug-in had a settings menu biut it doesn't seem to have one??

   Ian

4. jasicom
   Member
   Posted 1 year ago #

   On Mashable’s site, in their post pages (not the home page), there’s a floating widget to the left of the content that descends as you scroll down below the fold, but doesn’t ascend above a certain point.

   I’d love to replicate this, but their site is so clogged with code that I’m having a really hard time parsing apart the (javascript) scripting that’s controlling this.

   Thoughts or any help identifying the moving parts?

   http://csscreator.com/files/screenshot_22.jpg

5. hobbsy
   Member
   Posted 1 year ago #

   @jasicom - download the Firebug extension for Firefox, and it should enable you to narrow down the CSS rules driving their floating widget

   http://getfirebug.com/
   https://addons.mozilla.org/en-US/firefox/addon/1843

6. hickox
   Member
   Posted 1 year ago #

   For some reason I can't get the facebook share button below my tweetmeme button, even I use

   clear:left; float: left; margin-right: 10px; margin-top:10px;

   Any thoughts? Example here: http://theportlander.com/portland-business-journal-honors-40-under-40/

   I'd be fine with them side by side also, but I'd prefer Tweetmeme on the Left and Facebook on the right. Anyone know how i can do that?

7. hickox
   Member
   Posted 1 year ago #

   also noticed that in IE8, the Tweetmeme and Facebook share buttons are not at the same height.

   Suggestions?

   Forgive me, I don't do CSS or HTML so I ask annoying questions.

8. tamar
   Member
   Posted 1 year ago #

   Here's a follow-up question:

   I want to put them side by side, but I want the FB Share plugin to show up FIRST.

   With both of them fighting for "float: right; margin-left: 10px;", how can I accomplish this?

9. jasicom
   Member
   Posted 1 year ago #

   @tamar u can change margin-left: 10px; to margin-left: 50px;

10. webnme2
    Member
    Posted 1 year ago #

    Was finally able to get a nice vertical stack of these social media icons using the following CSS:

    Stacked on the left side (See example at http://blog.webnme2.com)

    Buzz

    clear: left; float: left; margin-left:-80px; margin-right: 10px; margin-top: 0px;

    TweetMeme

    bottom:-65px; float:left; left:-75px; margin-bottom:65px; margin-right:-62px; position:relative;

    Facebook

    bottom:-135px; float:left; left:-80px; width: 60px; margin-bottom:135px; margin-right:-62px; position:relative;

    Stacked on the right side (See example at http://blog.happyflier.com - site I help with)

    Buzz

    float: right; right: -10px; margin-right: 10px; margin-top: 5px; bottom: 0px; margin-bottom: 0px; postion: relative;

    TweetMeme

    bottom:-70px; float: right; right: -10px; margin-bottom:70px; margin-right: -55px; margin-top: 10; position:relative;

    Facebook

    bottom:-135px; float: right; right: -10px; margin-bottom:135px; margin-right: -50px; position:relative;

    For the first example, I also had to change the template and style.css file to get the extra white space on the right side.

    If you are doing a banner ad at the top with your template, you may also want to check it in compatibility mode in IE8. Both the banner and the social media icons did strange things when in IE8 compatibility mode until the wrapper was perfected to include the bottom and bottom-margin values.

11. jefftb
    Member
    Posted 1 year ago #

    webnme2, what Google Buzz plugin are you using?

12. webnme2
    Member
    Posted 1 year ago #

    Hey Jeff

    This is what I'm using:

    WPBuzzer Adds a button to Buzz your blog posts

    Deactivate | Edit Version 0.8.1 | By Hameedullah Khan | Visit plugin site

    http://hameedullah.com/wordpress/wpbuzzer

    Since writing the post above, I upgraded the Mystique Theme and found it was a major headache to keep the social icon buttons to the left. Much easier to place them on the right. Lots of editing of php files to do what I have for blog.webnme2.com. Yikes.

Topic Closed

This topic has been closed to new replies.