[SOLVED] Shareholic doesn't work with this theme
I just try shareholic plugin, but it doesn't appear with the full size icon share, just 1/3, Is there any way to fix it?
I change to another and it become normal again with a full size icon, so that I think the problem is about this theme, can we fix it ? |
what is the url pointing to the issue?
Quote:
|
sr, I forgot : http://quotesaboutbeinghappy.us/prim...happy-couples/
I change to another theme and it normal again, but with monte zuma it just appear 1/3 the icon , you can see the list icon share below :" sharing is caring " |
The problem is not really with Montezuma. The problem is that Shareaholic doesn't make its CSS specific enough, so their CSS clashes with Montezuma's CSS. It's been covered in this thread as well as this thread. Both Montezuma and Shareaholic use the italics tag (<i>) for their icons. The reason why you don't see the problem with other social plugins is that they probably don't use the italics tag for their icons, or their CSS is more specific. And you don't see the problem with other themes because other themes probably don't use the italics tag for displaying icons. Is Montezuma wrong for using the italics tag in a non-standard way? I don't think you can say that, because Shareaholic is using it in the exact same way, and that's where the problem occurs.
In my opinion, it's up to plugin developers to make their CSS as specific as possible, because 1) theme developers should make their CSS simple enough for others (web developers and plugin developers) to override/customize, and 2) theme developers can't anticipate all the different ways that a plugin developer may use a particular element. All Shareaholic had to do was include the Shareaholic classes in it's CSS selectors and there wouldn't be a problem with any theme (or any other plugin), but instead they made their selectors too general. [Edited]: I tried to look at your site to see if I could give you some CSS to fix your problem, but for some reason I keep having problems loading it. [Edit2]: @truelight, I was able to finally access your site. If you follow what I did in my next post below and copy the new CSS rule to the bottom of your various.css virtual CSS file, that should fix your Shareaholic problem as well, even though you are using a different button layout than I am. |
Here's some clarification regarding Shareaholic's CSS.
I installed Shareaholic on my Montezuma test site, and here is what the icons looked like initially: http://i192.photobucket.com/albums/z...36ae3b2c21.jpg As you can see, they were very small and illegible. This is the rule for Shareaholic's icons: Code:
i.shareaholic-service-icon { This is the rule for Montezuma's icons: Code:
.hentry ul li i, .comment-text ul li i { So that's the crux of the problem: Both the theme and the plugin coincidentally use the italics tag in a somewhat non-standard way for displaying icons, and because Shareahlolic puts its buttons inside a list structure, it's going to match the Montezuma rule. So which rule comes into effect? Because the Montezuma selector of .hentry ul li i has a higher specificity than the Shareaholic selector of i.shareaholic-service-icon (13 vs. 11), the browser will use any properties which are in common from the Montezuma rule. That's why the width & height end up to be 12px square. So what can be done about it? We can create a rule for the Shareaholic icons that has a selector with an equal or higher specificity than the Montezuma selector, and reset those common properties back to their original values. Here's the original Shareaholic CSS rule that's been slightly modified: Code:
.shareaholic-canvas i.shareaholic-service-icon { After adding the new rule to the end of my various.css virtual file, here's how the Shareaholic buttons now look: http://i192.photobucket.com/albums/z...d23243b315.jpg You can also see the Shareaholic buttons at the bottom of any post on my test site. So I hope that clarifies what the problem is between Shareaholic and Montezuma. Shareaholic could have saved a lot of trouble by adding the .shareaholic-canvas class to the front of its CSS selector in the first place, since I would think that all Shareaholic buttons would be contained in that container. But there was no way for the Shareaholic developers to know that a theme (or even another plugin) would be using the italics tag for displaying icons, and the Montezuma developer could likewise not anticipate that plugin developers would use the italics tag for displaying graphical images. For those who may think that Montezuma is somehow broken and needs to be fixed, you would be equally justified in complaining on the Shareaholic support forum about why their plugin doesn't work with Montezuma when other Social plugins do. It's not a matter of one thing being broken and the other one not, but finding a way to make two pieces that do work, work together. |
1 Attachment(s)
Dear, there was some problem after I add the code to my various.css. I attached the image, The icon don't change to normal
|
did you forget to press 'SAVE' beczause that CSS is not in your css file
HTML Code:
margin-bottom: 0; |
Did you remember to click the Save Changes button? Because when I look at your CSS, I don't see the new rule in there.
[edited]: Oops, Juggledad beat me to it. ;) |
I'm so sorry , I forgot to click save, thank you everyone, I worked , I'm really like it :)
|
All times are GMT -6. The time now is 02:52 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.