Personal

Help! I Can't Get Sociable.css To Work

Having problems with Sociable?
Having problems getting the sociable.css to behave?

The answer is taking a look at you WordPress theme source code.  Look at where Sociable is included in the HTML.  In particular look at what div’s the sociable code is in.  This fixed the formatting problems I had. This div that serves as a wrapper might be named differently depending on the Theme you are using. Also make sure you add this CSS to the style.css of your theme. If you don’t do this every sociable update the sociable.css will be changed. Go into the sociable settings and uncheck the “Use Sociable css” box if it is checked.

Here is a snippet from this blog.

<div id="content">

	<!--comment count on right-->
	<div class="comm"><span><a href="http://undiff.com/2008/12/help-i-cant-get-sociablecss-to-work/#respond" title="Comment on Help! I Can&#8217;t Get Sociable.css To Work">0</a></span></div>
	<!--post title link-->
	<h3 class="h1" id="post-73"><a href="http://undiff.com/2008/12/help-i-cant-get-sociablecss-to-work/" rel="bookmark" title="Permanent Link to Help! I Can&#8217;t Get Sociable.css To Work">Help! I Can&#8217;t Get Sociable.css To Work</a></h3>

	<!--Post Meta-->
	<div class="post-meta-top">
	<div class="auth"><span>Posted by <strong><a href="http://undiff.com/author/admin/" title="Posts by [mad]Berry">[mad]Berry</a></strong></span></div>
	<div class="date"><span> at <strong>December 21, 2008</strong></span></div>

	</div>....[snip]

The first div is this one <div id=”content”> the fix to get Sociable to behave is to change the most important lines to the following.:

#content .sociable ul {
	display: inline;
	margin: 0 !important;
	padding: 0 !important;
}
#content .sociable ul li {
	background: none;
	display: inline !important;
	list-style-type: none;
	margin: 0;
	padding: 1px;
}
#content .sociable img {
	float: none;
	width: 16px;
	height: 16px;
	border: 0;
	margin: 0;
	padding: 0;
}

Leave a Reply

Your email address will not be published. Required fields are marked *

Powered by: Wordpress