Posts by Toni Hambilton on Learning Movable Type tag:www.learningmovabletype.com,2008-02-25:/5 2007-12-12T21:56:13Z Tutorials and helpful tips for the Movable Type web publishing system Movable Type Pro 4.361 Favicon and Gravatar in MT4 tag:www.learningmovabletype.com,2007://5.1934 2007-11-09T09:57:20Z 2007-12-12T21:56:13Z 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... Toni Hambilton http://mt4.juneeonline.com/babble-on/ 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.

Favicon for 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.

]]> GravatarA 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">
<$MTCommentBodyPlusGravatar class="floatimgright" size="40" rating="R" default="http://mt4.juneeonline.com/avatar.gif"$>
</div>
<br style="clear: both" />

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.

]]> Create a Contact Form using MT4 tag:www.learningmovabletype.com,2007://5.1822 2007-10-09T06:27:28Z 2007-10-11T14:04:34Z I have used the contact form on previous versions of Movable Type following the instructions from Learning Movable Type and it’s always worked well. Trying to implement it in MT4 has proved more difficult because of the way the templates are set up using modules. Several templates need to be... Toni Hambilton http://mt4.juneeonline.com/babble-on/ I have used the contact form on previous versions of Movable Type following the instructions from Learning Movable Type and it’s always worked well. Trying to implement it in MT4 has proved more difficult because of the way the templates are set up using modules. Several templates need to be modified to get this to work.

]]> Before you begin, install the ReCaptcha plugin provided by Movable Type.

  1. Copy the reCaptcha folder from extras/examples/plugins to your plugins directory.
  2. Edit the reCaptcha.pl file: change system_config_template to config_template at line 20.
  3. Also in reCaptcha.pl at line 29, add your keys like so:
['recaptcha_publickey', { Default => 'YOUR-PUBLIC-KEY-HERE' }],
['recaptcha_privatekey', { Default => 'YOUR-PRIVATE-KEY-HERE' }],

Update: Editing recaptcha.pl is not necessary since the release of Movable Type 4.01. Install as per the readme in the plugin folder and it should work properly. (A good reason to update!)

You need to create a new blog. I called mine Contact.

Now go to the Movable Type dashboard in your browser, Preferences > Blog Settings > Comments. Choose “Immediately approve comments from Anyone”. Select E-mail Notification as “On”. Near the bottom is a chooser called “CAPTCHA provider.” Select reCAPTCHA and click Save Changes.

Go the Registration. De-select Require Registration. Choose Anonymous Comments and Require E-mail Address for Anonymous Comments. De-select the rest of the options.

Rebuild your site to create the index pages.

Now go to Design > Templates > Archive Templates. Click on the Entry template. 

<MTSetVar name="body_class" value="mt-archive-listing mt-entry-archive">
<MTSetVar name="sidebar" value="0">
<MTSetVar name="module_about_context" value="0">
<MTSetVar name="body_onload" value="individualArchivesOnLoad(commenter_name)">
<MTSetVarBlock name="page_title"><$MTEntryTitle remove_html="1"$></MTSetVarBlock>

<$MTInclude module="Header"$>

<$MTInclude module="Comments"$>

<$MTInclude module="Footer"$>

Change <$MTInclude module ="Comments"$> to <$MTInclude module ="Comment Form"$>. Under “Archive Mapping” at the bottom of the page change the “Path” to “Custom”. Fill in %f in the field. Save changes.

From the sidebar, under Includes and Widgets, click on Comment Form. Change the label for Comments to “Message”, and the heading “<__trans phrase="Leave a comment">” to “Please use this form to send an email” or something similar.

In System Templates, choose the Comment Response template. Change responses to match your contact form. Here is an example template. I have included a link back to the contact page in case of submission errors, and a button to close the window.


<MTSetVar name="page_layout" value="layout-one-column">
<MTSetVar name="system_template" value="1">
<MTSetVar name="feedback_template" value="1">

<MTIf name="body_class" eq="mt-comment-pending">
<MTSetVarBlock name="page_title">Thank You</MTSetVarBlock>

<MTSetVar name="heading" value="Thank you for e-mail.">

<MTSetVarBlock name="message">
<p>Thank you for contacting me. </p>
</MTSetVarBlock>

</MTIf>

<MTIf name="body_class" eq="mt-comment-error">
<MTSetVarBlock name="page_title">Contact Submission Error</MTSetVarBlock>

<MTSetVar name="heading" value="$page_title">

<MTSetVarBlock name="message">
<p>Your contact submission failed for the following reasons:</p>
<blockquote>
<$MTErrorMessage$>
</blockquote>
</MTSetVarBlock>

</MTIf>

<MTIf name="body_class" eq="mt-comment-confirmation">
<MTSetVarBlock name="page_title">Email Posted</MTSetVarBlock>

<MTSetVar name="heading" value="Confirmation...">

<MTSetVarBlock name="message">
<p>Your email has been sent.</p>
</MTSetVarBlock>

</MTIf>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
<meta name="generator" content="<$MTProductName version="1"$>" />
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" />
<title>
<$MTBlogName encode_html="1"$>: <$MTGetVar name="page_title"$>
</title>
<script type="text/javascript" src="<$MTBlogURL$>mt-site.js"></script>
</head>
<body class="layout-one-column comment-preview" onload="individualArchivesOnLoad(commenter_name)">
<div id="container">
<div id="container-inner" class="pkg">
<div id="banner">
<div id="banner-inner" class="pkg">
<h1 id="banner-header"><a href="http://mt4.juneeonline.com/contact/contact_me.html">Contact</a></h1>
<h2 id="banner-description"><$MTBlogDescription$></h2>
</div>
</div>
<div id="pagebody">
<div id="pagebody-inner" class="pkg">
<div id="alpha">
<div id="alpha-inner" class="pkg">

<h1><$MTGetVar name="heading"$></h1>

<$MTGetVar name="message"$>
<p>Return to the <a href="http://mt4.juneeonline.com/contact/contact_me.html">contact form</a>.</p>
<input type="button" onClick="javascript: window.close();" value="Close" />

</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

Save the changes.

Open the Comment Preview template and change the heading “<__trans phrase="Previewing your Comment">” to “Previewing your submission”.

Save the changes and rebuild your site.

Create an new entry, with the title “Contact” and nothing in the entry body or extended entry. Publish the entry. View your site and open the entry by clicking on permalink. Note the URL of the contact form.

You can follow Elise’s instructions on Learning Movable Type for creating a popup window for the contact form if that’s what you want.

Click on “Preview” to see the Contact Form page. Test the form by sending yourself a test message.

The last step is to create a link on the websites for visitors to contact you.

<a href="http://www.yoursite.com/contact/contact.html" 
target="_blank" rel="nofollow">Contact</a>

Why not send me an email using the Contact Form I created if you’re having problems?

]]>