HomeWP Twitip ID Light Reloaded
Now that I am a twitterer I have decided to integrate twitter into my theme. I decided to install WP-Twitip-ID which adds a form field into your comments template, stores the twitter id that is entered and then displays the corresponding twitter ID within the comments.
Why change it?
While this is an excellent script I didn’t need all of the functions. By trimming the plugin, creating the twitter ID form field manually and adding 1 simple function to my theme I have removed unnecessary code.
Download & Install Plugin
Download the plugin found here. Install it into your plugins folder in wp-content or use the admin upload tool. Activate the plugin.
Edit Comments Template
In comments.php look for a line beginning with the following. It may look slightly different.
1 2 3 4 5 6 7 8 | <input id="author" name="author" size="22" type="text" value="<?php echo $comment_author; ?>" tabindex="1" /> <label for="author"><strong>Name</strong>(Required)</label> <input id="email" name="email" size="22" type="text" value="<?php echo $comment_author_email;?>" tabindex="2" /> <label for="email"><strong>Email</strong>(Required)(Will not be published)</label> <input id="url" name="url" size="22" type="text" value="<?php echo $comment_author_url; ?>" tabindex="3" /> <label for="url"><strong>Website</strong></label> |
Now you want to enter the form field for the twitter id. I entered mine underneath the URL field keeping to the same style as the previous fields.
1 2 |
Now you want to add the function that will insert the users twitter id with their comment. Now look for the similar in your comments.php. If you cant find it in that file check functions.php as you might have custom comments.
1 2 3 4 | <?php echo get_avatar($comment,$size='75',$default='<path_to_url>' ); ?> <?php comment_author_link() ?> <?php comment_date('jS F Y') ?><?php edit_comment_link('Edit','','')?> <!--Twitter ID goes here--> |
As you can see in my comments section the twitter id is below the date, which is line 3 in the above code. Visualise where you would like your twitter id to be displayed within your theme and enter the following.
1 |
The only thing now left for you to do is style your form field using the following id within your stylesheet. You may have the form id elements #author,#email and #url already defined and styled in your stylesheet. Just add #atf_twitter_id to make them all the same.
1 2 3 4 5 | #author, #email, #url, #atf_twitter_id { height:30px; margin-bottom:15px; } |
If you want to style the @twitter id output then use the following class.
1 | .twitter{} |
I hope you have found this tutorial straightforward. Please let me know if you have any troubles
