Home ❯ Thủ thuật Blogger ❯ Cách đổi giao diện Contempo, Soho cho hệ thống Comment Blogspot

Cách đổi giao diện Contempo, Soho cho hệ thống Comment Blogspot

Hiện tại, Blogger – Blogspot đã ra mắt thêm nhiều giao diện mặc định đẹp và phong cách hơn, để người dùng có nhiều sự lựa chọn hơn, kèm theo đó là hệ thống Comment – Bình Luận của nó.

Trong đó, là 2 hệ thống Comment thường dùng nhất là Contempo và Soho, 2 cái sẽ có kiểu hơi khác nhau.

Nếu như bạn muốn chuyển đổi qua lại giữa hai hệ thống Comment này, thì bạn phải hiểu code của nó, nếu không khi chuyển sẽ gặp lỗi. Nên hôm nay mình viết bài này, để hướng dẫn bạn cách chỉnh sửa để không bị lỗi nha.

Thay giao diện Contempo và Soho cho hệ thống Comment Blogspot

Bước 1: Bạn hãy kiểm tra xem ở phần thẻ <html> đã được thay đổi chưa, nếu chưa hãy thay đổi dùm mình theo code bên dưới.
Thay

<html>

Thành

<html b:css='false' b:defaultwidgetversion='2' b:layoutsVersion='3' b:responsive='true' b:templateVersion='1.3.0' expr:class='data:blog.languageDirection' expr:dir='data:blog.languageDirection' expr:lang='data:blog.localeUnderscoreDelimited' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Bước 2: Tìm cụm từ data:post.commentFormIframeSrc
– Nếu dùng skin Soho thì thay bằng code này

<a expr:href='data:post.commentFormIframeSrc + "&skin=soho"' id='comment-editor-src' rel='noopener noreferrer' title='Comment Form Link'/>

– Nếu dùng skin Contempo thì thay bằng code này

<a expr:href='data:post.commentFormIframeSrc + "&skin=contempo"' id='comment-editor-src' rel='noopener noreferrer' title='Comment Form Link'/>

Bước 3: Tìm thẻ <b:skin><![CDATA[
– Nếu dùng Soho sử dụng mã sau

/*
<Variable name="body.background" description="Background" type="background" color="$(body.background.color)" default="$(color) none repeat scroll top left"  value="#ffffff"/>
<Variable name="body.background.color" description="Background color" type="color" default="#fff"  value="#f7f7f7"/>
<Variable name="body.title.color" description="Title color" type="color" default="#000"  value="#000000"/>
<Variable name="body.action.font.large" description="Action font (large)" type="font" default="$(montserrat14)"  value="normal 14px Arial, sans-serif"/>
<Variable name="body.action.color" description="Action color" type="color" default="#bf8b38"  value="#bf8b38"/>
<Variable name="body.text.font" description="Text font" type="font" default="$(garamond20)"  value="normal 20px Arial, sans-serif"/>
<Variable name="body.text.color" description="Text color" type="color" default="#000"  value="#000000"/>
<Variable name="body.link.color" description="Link color" type="color" default="#bf8b38"  value="#e0384c"/>
*/

– Nếu dùng Contempo sử dụng mã sau

/*
<Variable name="body.text.font" description="Font" type="font" default="$(fuente)" value="15px Josefin Sans, sans-serif"/> 
<Variable name="body.text.color" description="Color" type="color" default="#444"/>
<Variable name="body.background" description="Background" type="background" default="#fff none repeat scroll top left"/>
<Variable name="posts.background.color" description="Post background color" type="color" default="#fff"/> 
<Variable name="body.link.color" description="Link color" type="color" default="#992e38"/> 
<Variable name="tabs.font" description="Fonts" type="font" default="$(fuente)"/>
<Variable name="posts.title.color" description="Post title color" type="color" default="#212121"/> 
<Variable name="posts.icons.color" description="Post icons color" type="color" default="#707070"/>
<Variable name="labels.background.color" description="Label background color" type="color" default="#f7f7f7"/>
<Variable name="posts.text.color" description="Post text color"  type="color" default="$(body.text.color)"  value="#757575"/>
<Variable name="posts.byline.color" description="Post byline color" type="color" default="rgba(0, 0, 0, 0.54)"  value="rgba(0, 0, 0, 0.54)"/>
<Variable name="blockquote.font" description="Blockquote font" type="font" default="$(robotoLightItalic15)"  value="italic 300 15px Roboto, sans-serif"/>
<Variable name="blockquote.color" description="Blockquote color" type="color" default="#444"  value="#444444"/>
*/

Bạn lưu mẫu lại là xong.

Vậy là bạn đã biết cách thay đổi giao diện Comment Contempo và Soho cho hệ thống Comment Blogspot. Thật là đơn giản và dễ phải không nào. Hãy tận dụng nó để tạo hệ thống Comment cho Website của bạn thật đẹp nhé.

152 lượt xem | 0 Bình luận

Bình luận

Chia sẻ

Tôi là Minh Khang là một tác giả trên web allfreevn.com. Tôi chuyên viết bài viết trong lĩnh vực Công nghệ thông tin và game. Tôi là một chuyên gia có kinh nghiệm và đam mê trong lĩnh vực này, với kiến thức sâu và khả năng áp dụng linh hoạt, tôi đã viết nhiều bài viết chất lượng về các khía cạnh khác nhau của công nghệ thông tin như thủ thuật, hướng dẫn cách làm thế nào... Cám ơn các bạn xem bài viết của tôi.

Đề xuất cho bạn

Tổng hợp các trang web chia sẻ miễn phí Template Blogger – Blogspot

Cách đổi giao diện Contempo, Soho cho hệ thống Comment Blogspot

Thay giao diện Contempo và Soho cho hệ thống Comment Blogspot

Bình luận gần đây