[Blogger] Hướng dẫn cách rút gọn bài viết trên trang chính của blogspot [Thủ thuật Blogspot] | Bank™Tư Nhân

[Blogger] Hướng dẫn cách rút gọn bài viết trên trang chính của blogspot [Thủ thuật Blogspot]

Giải quyết khó khăn tài chính mùa Covid!

[Blogger] Hướng dẫn cách rút gọn bài viết trên trang chính của blogspot [Thủ thuật Blogspot]

    Trên blogspot có một chức năng để tóm tắt hay rút gọn bài viết [Read more…] / [Xem thêm…] nhưng nó sẽ không có hình ảnh giống như khi các trang tạp chí, tóm tắt có kèm theo ảnh, hay giống như của http://kiem-tien-online-tai-nha.blogspot.com/  các bạn có thể xem ảnh minh họa bên dưới. Sau khi chèn code rút gọn cho bài viết chính trên blog thì các bạn không cần phải chền thêm code more nữa, và hình ảnh sẽ được tự động đưa lên cùng nội dung tóm tắt.

Thực hiện theo các bước sau:


Bước 1.
Đăng nhập vào tài khoản blogspot

Bước 2. Vào thiết kế (Design) chọn chỉnh sửa HTML (Edit HTML)

Bước 3. Chọn mở rộng tiện ích

Bước 4. Chèn code bên dưới vào trước thẻ ]]></b:skin>

.readmore {
float:right;
margin:1px 10px 5px 0px;
padding:3px;}
.readmore a{
color:#fff;
padding:3px 5px 3px 5px;
background:#0000ff;
}
.readmore a:hover{
color:#0000ff;
background:#ddd;}
.sumpost {
color:#000;
font-family:arial;
font-weight:bold;
font-size:12px;}
.img-post {
float:left;
margin-right:5px;
border:1px solid #fff;
height:96px;
padding:1px;}

Bước 5. Tiếp đến bạn chèn code bên dưới vào sau thẻ <head>

<script type=’text/javascript’>
var thumbnail_mode = &quot;no-float&quot; ;
summary_noimg = 230; //số ký tự bài viết hiển thị khi không có ảnh
summary_img = 500; //số ký tự bài viết hiển thị khi có ảnh
img_thumb_height = 90; //chiều cao của ảnh thumb
img_thumb_width = 100; //độ rộng của ảnh thumb
</script>
<script src=’http://traidatmui-tips.googlecode.com/files/auto_sumpost.js’ type=’text/javascript’/>

Bạn dựa vào hướng dẫn trong code để tùy chỉnh cho phù hợp với blog của mình

Bước 6. Bây giờ bạn tìm đến đoạn code như bên dưới

<data:post.body/>

Bước 7. Thay đoạn code vừa tìm được ở trên thành code bên dưới

<b:if cond=’data:blog.pageType == “item”‘>
<data:post.body/>
<b:else/>
<div expr:id=’”summary” + data:post.id’>
<p><data:post.body/></p>
</div>
<script type=’text/javascript’>
createSummaryAndThumb(“summary<data:post.id/>”);
</script>
<div class=’readmore’><a expr:href=’data:post.url’>Read more…</a></div>
</b:if>

Bước 8. Cuối cùng save template

>>> Xem hướng dẫn tạo Blogspot tại đây



Chúc các bạn thành công!

[theo huongdan360]

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *