Code chèn Author vào bài viết Blogspot mới nhất

Sau đây mình xin chia sẻ khung author blogspot cho mọi người .Author blogspot là 1 khung thông tin tác giả của blogspot đó

Tham Khảo :Thêm ảnh tác giả Author Avatar ở đầu tiêu đề cho Blogspot Blogger

Các bước thực hiện :

Bước : Vào Blog - > Mẫu -> Chỉnh sửa HTML
Thêm đoạn code dưới đây vào sau thẻ </style>

/* CSS Author Bio Box by MS Design */ .authorboxwrap{Font-family: Open Sans;background:#fff;margin:10px auto 20px;padding:20px;overflow:hidden;border:1px solid #ccc;} .avatar-container {float:left;margin-right:20px;border: 1px solid silver;padding: 3px;} .avatar-container img{width:110px;height:auto;} .author_description_container h4{font-family:Open Sans; font-weight:700;font-size:16px;display:block;margin:0;margin-bottom:2px} .author_description_container h4 a{color:#ef4824} .author_description_container h4 a:hover{color:#404040} .author_description_container p{margin:0;color:#888;font-size:95%;margin-bottom:8px;font-family: Open Sans;} .authorsocial a{display:inline-block;text-align:center;margin-right:10px} .authorsocial a i{font-family:Fontawesome;width:20px;height:20px;line-height:20px;padding:5px;display:block;opacity:1;border-radius:50%;transition:all .3s;} .authorsocial a:nth-child(1) i {background:#2d609b;color:#fff;} .authorsocial a:nth-child(2) i {background:#19bfe5;color:#fff;} .authorsocial a:nth-child(3) i {background:#eb4026;color:#fff;} .authorsocial a:hover:nth-child(1) i,.authorsocial a:hover:nth-child(2) i,.authorsocial a:hover:nth-child(3) i {opacity:0.90;}

Tiếp theo tìm đoạn <data: post.body/>.Thêm code dưới đây vào trước thẻ đó :

b:if cond='data:blog.pageType == "item"'>
<div class='authorboxwrap'>
<div class='authorboxfull'>
<div class='avatar-container'>
<a href=''>
<img class='author_avatar' expr:alt='data:post.author' expr:src='data:post.authorPhoto.url' height='110' width='110'/>
</a>
</div>
<div class='author_description_container'>
<h4>Author: <a href='#' rel='author'><data:post.author/></a></h4>
<p>
<data:post.authorAboutMe/>
</p>
<div class='authorsocial'>
<a class='img-circle1' href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
<a class='img-circle2' href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
<a class='img-circle3' href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
<div class='clr'/>
</div>
</div>
</div>
</div>
<div style='clear:both'/>
</b:if>