How to Change Blogger Comments Display to the Latest Version - hyderabadrichest

How to Change Blogger Comments Display to the Latest Version

How to Change Blogger Comments Display to the Latest Version

Want to know how to change the appearance of blogger comments to the latest version without changing the new template? Let's take a peek at the tutorial here.

From the beginning I have a blog until now I still faithfully use templates from third parties. Previously, I was not interested in using the default blogger template because in my eyes it looks less attractive and seems old-fashioned. That's why I didn't really update about the default blogger template.

I just found out that blogger has released a new template since March 2017. Duh, where have you been? You know, I don't have to bother looking for free templates from third parties if in fact the latest templates from bloggers that exist today are no less cute.

Now the default blogger template comes with a more dynamic, minimalist, responsive, mobile friendly and SEO friendly appearance . Already support the blogger layout version 3 too.

Yes, there are many advantages of the latest version of the default blogger template. Even if you want to be seen in terms of SEO and speed, blogger default templates can be superior to free templates from third parties.

Dont worry! Because this tutorial will explain how to install a new version of the default Blogger comment box without having to completely change the template.

How To Change Blogspot Comments To The New Version

1. Look for the code  <b:skin><![CDATA[  and save the following code exactly "After/Under".
 <!-- Variable definitions -->  
<Group description="New comments Blogger (Contempo, Soho, Emporio, Notable)">
<Variable name="body.background" description="Body Background" type="background" color="#dddfe2" default="#dddfe2 none repeat scroll top left" value="#dddfe2 none repeat scroll top left"/>
<Variable name="body.font" description="Font" type="font" default="normal 400 14px Roboto, Arial, sans-serif" value="normal 400 14px Arial,sans-serif"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#1d2129" value="#1d2129"/>
<Variable name="body.text.font" description="1"
type="font"
default="$(body.font)" value="normal 400 14px Roboto,Arial,sans-serif"/>
<Variable name="posts.background.color" description="2"
type="color"
default="#fff" value="#ffffff"/>
<Variable name="body.link.color" description="3"
type="color"
default="#008c5f" value="#008c5f"/>
<Variable name="body.link.visited.color" description="4"
type="color"
default="#008c5f" value="#008c5f"/>
<Variable name="body.link.hover.color" description="5"
type="color"
default="#1d2129" value="#1d2129"/>
<Variable name="blog.title.font" description="6"
type="font"
default="$(body.text.font)" value="normal 400 14px Roboto, Arial, sans-serif"/>
<Variable name="blog.title.color" description="7"
type="color"
default="#fff" value="#ffffff"/>
<Variable name="header.icons.color" description="8"
type="color"
default="#fff" value="#ffffff"/>
<Variable name="tabs.font" description="9"
type="font"
default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
<Variable name="tabs.color" description="10"
type="color"
default="#ccc" value="#cccccc"/>
<Variable name="tabs.selected.color" description="11"
type="color"
default="#fff" value="#ffffff"/>
<Variable name="tabs.overflow.background.color" description="12"
type="color"
default="#fff" value="#ffffff"/>
<Variable name="tabs.overflow.color" description="13"
type="color"
default="$(body.text.color)" value="#1d2129"/>
<Variable name="tabs.overflow.selected.color" description="14"
type="color"
default="$(body.text.color)" value="#1d2129"/>
<Variable name="posts.title.color" description="15"
type="color"
default="$(body.text.color)" value="#1d2129"/>
<Variable name="posts.title.font" description="16"
type="font"
default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
<Variable name="posts.text.font" description="17"
type="font"
default="$(body.text.font)" value="normal 400 14px Arial,sans-serif"/>
<Variable name="posts.text.color" description="18"
type="color"
default="$(body.text.color)" value="#1d2129"/>
<Variable name="posts.icons.color" description="19"
type="color"
default="$(body.text.color)" value="#6c6f74"/>
<Variable name="labels.background.color" description="20"
type="color"
default="#008c5f" value="#008c5f"/>
</Group>
The #008c5f inner value body.link.color is the color of the link in the comment box. Change the value according to your template color.

2. Look data:post.commentFormIframeSrc for more than one. Select everything and replace it with the following new Blogger comment code:
 data:post.commentFormIframeSrc appendParams {skin: "contempo"}  

The complete code looks like this:
 <!-- Before -->  
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<!-- After -->
<a expr:href='data:post.commentFormIframeSrc appendParams {skin: "contempo"}' id='comment-editor-src'/>

3. Don't forget to save the settings with the click of a button Save Theme.

Check the appearance of your blog and see the results. Only a little arrangement, right? Yes, because the way to change the appearance of the Blogger comment form to the new version is really easy to practice. Can make the appearance cooler and not out of date. The period is still using the old version, right?

if it fails, please comment below because the code for each template may not be the same!

Okay, that's the tutorial on how to change the appearance of blogger comments to the latest version. Hopefully this post is useful. Happy practicing.

Show Comments
Hide Comments

0 Response to "How to Change Blogger Comments Display to the Latest Version"

Post a comment

Top Ad Articles

Top Ad Articles

Top Ad Articles 2

Advertise Articles