Two of my favourite Movable Type plugins from versions prior to MT4 are Favicon and Gravatar. Both these plugins work fine in MT4 and it’s only a matter of knowing where to put them in the template modules.
Favicon is a plugin for Movable Type that adds favicons to comments and trackbacks.
Download and install the plugin as per the instructions on the download page. Follow the directions there for installing into MT versions prior to 4.0. The following instructions only apply to Movable Type 4.
Go to the Movable Type dashboard in your browser, Design > Templates > and click on Template Modules. Open the Comment Detail module.
Place the following code right before the <$MTCommentAuthorLink default_name="Anonymous" show_email="0"$> tag and save the changes.
<MTFaviconCommentIfAvailable>
<$MTFaviconComment full="1"$>
</MTFaviconCommentIfAvailable>
Open the Trackbacks Module and copy the following code to the footer section, placing it just before the words “Tracked on….”. Save your changes.
<MTFaviconTrackbackIfAvailable>
<$MTFaviconTrackback full="1"$>
</MTFaviconTrackbackIfAvailable>
Rebuild your entry pages to see the favicons in action.
A gravatar is a globally recognized avatar, that can be a picture of yourself or anything you like that is linked to an email address. When you leave a comment on a site that has gravatars enabled, a picture appears next to your comment. Three different versions are available for Movable Type, depending on how your blog is set up or how you want to install it. I have the MovableType CommentBodyPlusGravatar Plugin installed. When used inside the MTComments tag as a replacement for MTCommentBody, outputs the comment body and inserts the gravatar image code inside the opening <p> tag. This is important if you want to use CSS to float the image so that text will wrap around it.
Download and install the plugin, and follow the instructions for the version you’ve chosen. Open the Comment Detail module and insert the tag inside the comment content section. Here’s an example of how mine looks.
<div class="comment-content">
<div class="comment-content-inner">
<$MTCommentBodyPlusGravatar class="floatimgright" size="40" rating="G" default="http://yoursite.com/blog/images/gravatar.gif"$>
<br style="clear: both" />
</div>
</div>
Use <br style="clear: both" /> to push the next comment down so they don’t pile up on top of each other or overlap. Don’t forget to rebuild your site to see the changes.
You need to add a class to your stylesheet called floatimgright
.floatimgright { float:right; margin-top:10px; margin-left:10px; margin-bottom:10px; border: 1px solid #ddddd9; padding: 3px; }Adding the style might help.
How about a link to your site? If I can see what the problem is I might be able to fix it for you.
Sorry Michael, The code for adding a gravatar was wrong. I had the br following the div when it should have been before. I wrote this post before updating to the Mid-Century template set, but the correct code is there now. I hope you get it working.
My server does not have these modules installed：
Archive::Zip GD； Archive::Tar； IO::Uncompress::Gunzip； Digest::SHA1； IO::Compress::Gzip； Image::Magick； XML::Atom
-_-||
I don't know what should I do.Can you help me?
Here is my email address: lnzhanglei(at)gmail.com
You need to contact your server and ask them to install the modules. Otherwise, I suggest you change servers. You don't have a lot of options.
as you can see the style of the two pictures are different.... Did you do that on purpose or... I also implemented this but would like to have them both styled the same way. Do you know how to do that?
Hi Hans,
I finally figured it out and have left a comment on your site. The code was missing the mtCommentBody code for the first part of the statement. Working great now. I've been thinking about doing it for a while and decided to give your code a go, it looked much easier than the userpic codes I've seen. Thanks.
The css for floatimgright now looks like:
.floatimgright, .avatar { float:right; margin-top:10px; margin-left:10px; margin-bottom:10px; border: 1px solid #ddddd9; padding: 3px; }