구글 블로그 자체에는 댓글 답글달기 기능이 없습니다.
그러나 기존 HTML 템플릿에 새로운 코드를 추가하면 답글달기 기능을 만들 수 있습니다.
1. 자신의 구글 블로그 dashboard에서 테마(구 템플릿) → HTML 편집창에 들어갑니다.
2. Ctrl +F 키를 눌러 ]]></b:skin> 를 찾습니다.
3. ]]></b:skin> 바로 윗 줄에 다음의 CSS를 추가합니다.
.comments .comment-block {
background: #F9F9F9;
color: #555;
box-shadow: 0 4px 10px #EEEEEE;
position: relative;
margin-top: 10px;
margin-left: 60px;
padding: 10px;
border: 4px solid #EEEEEE !important;
border-radius:10px;
font: 1.190em/1.2 Cambria,Georgia,sans-serif;
}
.comment-thread li .comment-block:before {
position: absolute;
display: block;
left: -26px;
color: #EEEEEE;
content: "\25C4";
font-size: 30px;
}
.comments .avatar-image-container {
width: 60px;
height: 60px;
max-height: 60px;
margin:0px 0px 0 -28px;
padding: 0px;
border: 7px solid #EEEEEE;
border-radius:60px;
}
.comments .avatar-image-container img {
overflow:hidden;
width: 60px;
height: 60px;
max-width: 60px;
border:0 !important;
border-radius:60px;
}
.comments .comment-thread.inline-thread {
background: none;
}
.comments .continue {
border-top: 0px solid transparent;
}
.comments .comments-content .datetime {
float: right;
font-size: 11px;
}
.comments .comments-content .user a{
font-size: 15px;
color: #498EC9;
}
.comments .comments-content .datetime a:hover{
color: #777;
text-decoration: none;
}
.comments .comments-content .comment:first-child {
padding-top: 0px;
}
.comments .comments-content .comment {
margin-bottom: 0px;
padding-bottom: 0px;
}
.comments .continue a {
padding: 0px;
}
.comments .comments-content .icon.blog-author {
background-image: none;
}
여기까지 완료 후 템플릿을 저장했다면 답글 기능이 추가된 것을 확인하실 수 있습니다.
만약 답글창의 배경, 색상 등을 변경하고 싶다면 아래를 변경하면 됩니다.
background: #F9F9F9; (댓글 배경색 변경)
color: #555; (댓글 색 변경)
box-shadow: 0 4px 10px #EEEEEE; (댓글 그림자색 변경)
border: 4px solid #EEEEEE !important; (순서대로 댓글 주변의 border width, style, colour 변경)
font: 1.190em (댓글 글자 크기 변경)
color: #EEEEEE; (arrow colour 변경)
60px; (avatar size, roundness 변경)
참고: Hex Colour Code Generator 추가
<center><object border="0" classid="clsid:D27CDB6E -AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="480"> <param name="movie" value="http://www.2createawebsite.com/build/color.swf"><param name="quality" value="High"><embed src="http://www.2createawebsite.com/build/color.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj1" width="485" height="485" quality="High"></embed></object></center>
위와 같은 코드를 blog post나 HTML에 추가하면 됩니다.
아래 그림처럼 취향대로 색을 만들고 Hex 박스 안의 hexadecimal colour code 6자리 #000000를 복사해서 #EEEEEE에 붙여넣어 변경하면 됩니다.
 |
Hex Colour Code Generator
|
No comments