Blog Tutorial: Personalizing Your Comment Window

Don't you love it when you discover a blog that is utterly unique, dramatic, and personalized? And after a few minutes of admiring the blog.... you wish you knew how to do it. Happens all the time, right? A simple Google search can reveal all the blogging secrets if you know where to look. And sometimes, you just have to be patient and learn it on your own.

Customizing your blog can be frustrating and tricky, especially when it comes down to html. But if you know the basics and at times the not-so-basics, you can do it! Personalizing your comment window, usually found at the bottom of your post, is a great place to start. Today I'm going to share a simple (or maybe not so simple) tutorial on changing the text and skin of the comment window.

To creativity and beyond!





Tutorial #1: Customizing Your Comment Form Message

1. After logging in to your Blogger account and click on your blog from the Blogger Dashboard
2. On the left side of the screen, click "Settings", then "Posts and Comments"

SETTINGS►POSTS AND COMMENTS►COMMENT FORM MESSAGE

3.  Scroll down until you see the "Comment Form Message"
4. Type in your message and WHALLA! It's as simple as that!



Tutorial #2: Customizing Your Comment Form Skin
1. On the left side of the screen, click "Template", then "Edit HTML" (right next to the orange 'Customize' button. Make sure to check the "Extend Widget Templates" box on the top right corner.

TEMPLATE►EDIT HTML►

2. Press CTRL + F and search for this html phrase:

]]></b:skin>

3. Once you've found it, paste this code above it:

#rb-form iframe{
background:#ffffff url(ENTER YOUR BACKGROUND URL) repeat-x;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#ffffff;
width:560px; height:215px !important;
}
#rb-form a{
color:#fff;
}
4. Great! Some changes need to be made to this code before it is ready. First, change ENTER YOUR BACKGROUND URL to your image's URL (the image that you want to use as the comment window's background). Next, change :#ffffff if you want to change the color of the text "Comment as". Finally, you can change the width and height of the window by changing width:560px; height:215px.

5. Press CTRL + F again and search this: <div class='comment-form'>
6. Replace the "class" with "id". This phrase now looks like this: <div id='comment-form'>


Tutorial #3: Changing the "comments" word

1. This will be very easy compared to what you just completed. Go to "Layouts" then click on "Page Elements". Click "edit" on the Blog Posts box.

LAYOUT ► BLOG POSTS box ► EDIT

2. Under "Post Page Options", you will see a list of items that you can choose to have on your blog post. The forth item is the comments option. Click on the "comments" box next to the number 5.

3. Change the word to anything you want (ex. reactions, discussions, remarks).

Congrats! You did it! Stay tuned... we've got some more tutorials coming up soon!



Subscribe Share


10 comments:

  1. Pretty impressive...easy to read and follow with images to go along with tutorial. Nice job!

    ReplyDelete
    Replies
    1. Thanks for the comment! We really appreciate your support.

      Delete
  2. hey great tutorial. i like your blog; you have an easy to use layout. make some more of these! looks like its pretty popular haha

    ReplyDelete
    Replies
    1. Thanks for the comment! We tweak this site pretty often to keep it updated and make sure it has the look we want.

      Delete
  3. Wow, I was looking for something like this! Thanks for sharing!

    ReplyDelete
    Replies
    1. We are so glad you could stop by, John! We are so happy that you found the tutorial useful.

      Delete
  4. I do not have a blogger, google, or wordpress account yet, but I will soon. Thank you for the valuable information. The tutorial was very easy to follow and read. I will be back!
    Zack

    ReplyDelete
    Replies
    1. Hello, Zack! Thank you for taking time to check out our blog! We wish you luck on your future blog.

      Delete
  5. its really amazing and useful post. thanks a lot for sharing such an knowledgeable post with us.

    ReplyDelete
  6. i think your web very informative,.thanks for sharing information by
    Ide Bisnis Modal Kecil

    ReplyDelete

Go for it. Tell us what you think!

Contact

C O N T A C T

questions, messages, or booking? let them know.

Email:

caylaandashley@gmail.com

Work Time:

Monday - Friday from 9am to 5pm

Phone: