教学 ♥ 美化 post a comment ( Blogger Template )
22 July 2012 @ 2:03 PM



给 Angel 的教程

转帖请留言和附上链接 ♥






步骤一

Blogger Template : Design - Edit html

打勾 Expand Widgets Template .



步骤二

把 Post A Comment 换去其他字眼或图片

之前




之后




用 ctrl + f 找 :
<h4 id='comment-post-message'><data:postCommentMsg/></h4>

然后把 <data:postCommentMsg/> 换去你要写的字 .

如果要换去图片 , 就用以下代码取代 <data:postCommentMsg/> :

<img src="你的图片网址"/>


步骤三

美化 Post A Comment 字眼
 
效果图 :



Part A

用 ctrl + f 找 :
]]></b:skin>


在 ]]></b:skin> 上面加入 :
.comment-msg {
text-align:center;
color:#7b7b7b;
background-color:#FFE8E8;
border:8px double #FFFFFF;
}


粉色的 是字的位子 .
left 左 , center 中间 , right 右 .

红色的 是字体的颜色 .

橙色的 是背景的颜色 .

黄色的 是框框的粗细度 .

蓝色的 是框框的种类 .

紫色的 是框框的颜色 .


备注 :

你也可以在 .comment-msg { 下面加入其他美化代码 .


如果要字体有影子效果 请参考这篇教程 .

如果要框框有圆角效果 请参考这篇教程 .


Part B


用 ctrl + f 找 :
<h4 id='comment-post-message'>你刚刚换了的字眼</h4>

如果你没有把 <data:postCommentMsg/> 换去其他字眼 ,
那你要找的代码就是 :
<h4 id='comment-post-message'><data:postCommentMsg/></h4>

在你 换了的字眼 或 <data:postCommentMsg/> 前面加入 :
<div class='comment-msg'>

后面加入 :
</div>

例子 :
<h4 id='comment-post-message'><div class='comment-msg'>你换了的字眼</div></h4>


步骤四

保存 Save .







任何疑问请在 tagboard 留言 .

在评论箱留言请告诉我 (:







版权所有 翻印必究. ♥