Một bộ theme quen thuộc với người dùng blogspot, nay đã được update lại với giao diện thân thiện và nhiều chức năng tối ưu hơn,
Một vài thay đổi
- Thay đổi tổng quan giao diện trang chủ, trang con, thay đổi lại hiển thị màu sắc, font chữ, độ rộng bài đăng sao cho dễ nhìn, chuyên nghiệp.

- Tối ưu lại thẻ H1 cho trang chủ Label, và các bài đăng.

- Sửa lỗi thêm mới Widget không có background  cho Title.
- Sửa lỗi tràn nội dung ngoài trang chủ.
- Sữa lỗi bị mất hiệu ứng hộp đèn cho hình ảnh của template Congly, thêm vào hiệu ứng lightbox hoàn toàn mới.

Các chức năng được tích hợp sẳn.
Breadcrumb - 



- Tích hợp bộ nút share, Google + Facebook, Tweet, Pinterest.


Template đẹp cho blogspot

- Tích hợp sẵn Breadcrumbs.


Template đẹp cho blogspot

- Thêm bài viết liên quan, cho từng bài đăng.
Template đẹp cho blogspot

- Đặc biệt, thêm một widget trên cùng luôn trượt theo khi lăn cuộn chuột. Widget này có title là liên hệ nha, các bạn có thể thay đội nội dung tùy ý, để Hotline là hay nhất.


Template đẹp cho blogspot



Cài đặt giao diện template

  • Thay đổi logo

Vào "Mẫu" > "Chỉnh sửa HTML"
Giao diện tin tức cực đẹp cho blogspot

Ấn tổ hợp phím Ctrl F, tìm "#header .logo a" và thay thế link ảnh được hilight đỏ
#header .logo a{background:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgopnKYdn0c461t0_sUbK7D-nb4Jy7pJtkZqysS6kvayzGG7NIln05Nx4OaP_BTA-CX_ekqgIB5Dto_j55WXpuHS6k9-0tywt8h33pfAtSamyHHv1xjKqewyt8bIQqqEOoCuiUOgzMl7r2F/w177-h82-no/Apartmentforu-logo-SMALL.png) center left no-repeat;width:251px;height:90px;display:block;float:left}
  • Thay đổi lại đường dẫn của các nhãn (Label) của thanh menu

Giao diện tin tức cực đẹp cho blogspot

Ctrl F, tìm ul class='menu'
Giao diện tin tức cực đẹp cho blogspot

Như có thể thấy trong hình, mình đã để tên các label trong mẫu template là Label A, Label B... Label E; tên các chuyên mục con là: Con Label B thứ 1, Con Label B thứ 2... để các bạn dễ dàng thay thế.
  • Thay đổi lại đường dẫn của nhãn nơi hiển thị các bản tin chính

Ctrl F, tìm "Label Hiện Thị ở trang chủ" và thay thành Label mà bạn muốn xuất hiện ở vị trí này:
Giao diện tin tức cực đẹp cho blogspot

Mẹo: Khi viết bài, ngoài các label của đúng chuyên mục mà bạn đăng viết, ta thêm vào một Label chung cho tất cả các bài muốn hiện thị tại vị trí trên, Ví dụ: Muốn hiển thị các tin của 2 Label  "Giải trí" và "Pháp luật" lên bản tin chính, ta thêm 1 Label chung là "Tin tức", ta được:
document.write("<script src=\"/feeds/posts/default/-/Tin tức?max-results="+10+"

  • Thay đổi đường dẫn của các nhãn tương ứng với từng chuyên mục hiển thị ngoài trang chủ

Ctrl F, tìm class='body-home' 
Giao diện tin tức cực đẹp cho blogspot

Thay thế tất cả các nhãn tương ứng với blog của bạn tại các vị trí mà mình đã gạch chân.

Lưu ý: Mỗi chuyên mục hiển thị ngoài trang chủ tương ứng với phần được đóng khung đỏ trong hình. Vậy nên:
- Sẽ có nhiều đoạn class='body-home'  được tìm thấy, tương ứng với mỗi chuyên mục.
- Nếu muốn xóa, hay thêm một chuyên mục xuất hiện ngoài trang chủ, chỉ việc Copy hoặc Delete tất cả những gì có trong khung đỏ là được, sau đó sửa lại với tên chuyên mục tương ứng là xong.
  • Lỗi không lưu được khi di chuyển hoặc thêm mới tiện ích Widget

Lỗi này đã có từ bản gốc tới nay và vẫn chưa thể khắc phục được, nên ta đành sống chung với nó :(
Template đẹp cho blog

Lỗi này xuất hiện khi chúng ta thêm mới một tiện ích hoặc di chuyển trong phần "Bố cục". Sau khi đã thêm mới tiện ích, muốn di chuyển nó xuống hoặc lên vị trí khác, ta làm như sau:


- Xác định, id của tiện ích.

Template đẹp cho blog
Click phải chuột vào tiện ích ta muốn tìm, chọn "Kiểm tra phần tử"

- Quay trở lại "Mẫu" > "Chỉnh sửa HTML", ấn tổ hợp phím Ctrl F tìm id ta đã lấy được, như trong hình, ID là HTML6, các bạn cũng có thể tìm bằng Title của tiện ích, trong hình là "Tiện ích mới nè"


Template đẹp cho blog

- Cắt (Ctrl X) toàn bộ đoạn được bôi đen như trong hình và dán nó vào vị trí thích hợp, sau các tiện ích khác.

Tiện ích được tính từ <b:widget>, kết thúc bằng </b:widget>

Chia sẽ từ Blog Cuộc Sống Muôn Màu

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

Đăng nhận xét

 
Top