Mẹo vặt trong thiết kế Template Blogspot
Đối với các Blogger ưa “táy máy” thì việc “vọc” code không những là thú vui mà còn là sự đam mê, là nơi cho những ý tưởng đầy sáng tạo thỏa sức bay bổng.
Không những vậy, nó thậm chí còn có thể mang lại lợi nhuận không nhỏ một khi bạn đã trở thành một Pro Blogger Designer, bằng việc bán Template, bán back-link,…
Tuy nhiên, để trở thành một Pro Blogger Designer không phải một sớm một chiều mà được. Và trong bài viết bên dưới, iTechPlus sẽ giới thiệu đến các bạn mới gia nhập Blogspot, một số mẹo nhỏ cơ bản trong quá trình thiết kế Template cho riêng mình.
1. Xóa thanh Navbar :
Thanh Navbar là thanh chứa các công cụ như Tìm kiếm, theo dõi, chia sẻ, báo cáo lạm dụng,…xuất hiện phía trên cùng của Blog.
Cách loại bỏ : chèn dòng code bên dưới trước thẻ đóng </b:skin>
Khi click vào link nào nó trên blog, có thể bạn sẽ gặp trường hợp sẽ xuất hiện một đường bao quanh liên kết này nhìn rất không thẩm mỹ tí nào.
Cách loại bỏ : chèn dòng code sau trước thẻ đóng </b:skin>
Một số template khi rê chuột vào link bất kỳ bạn sẽ thấy xuất hiện một đường gạch chân bên dưới link đó.
Các loại bỏ : tìm trong template đoạn code bên dưới hoặc tương tự (thuộc tính a:hover) :
Việc giới hạn hoặc qui định kích thước cụ thể cho hình ảnh không những giúp trình duyệt đỡ mất thời gian tính toán kích thước thật của ảnh (sẽ làm chậm thời gian tải trang) mà còn giúp blog bạn tránh được trường hợp hình ảnh quá lớn, sẽ hiển thị tràn cả trang bài viết (Main-wrapper) hoặc bị Sidebar che mất một phần gây mất thẩm mĩ cho Blog.
Cách khắc phục : tìm trong template class “.post img” và chèn đoạn code in đậm như bên dưới :
Liên kết này nhằm giúp người đọc nhanh chóng Bookmark lại trang của bạn để xem lại sau. Tuy nhiên, với các tiện ích như Bookmark and Share Homepage hay Đưa bài viết trên Blog lên các mạng xã hội thì tính năng này không còn mấy Blogger sử dụng nữa.
Thực hiện : tìm trong template class “.feed-links” và chèn vào đoạn code in đậm như bên dưới
Status Message Bar là thanh trạng thái hiển thị phía trên bài viết khi click vào “Nhãn” hoặc “Lưu trữ”, cho biết trạng thái của trang hiện hành.
Thực hiện : chèn đoạn code sau vào trước thẻ đóng </b:skin>
Hy vọng một số thủ thuật nhỏ trên đây sẽ có lúc hữu ích đối với bạn.
Chúc các bạn thành công !
Không những vậy, nó thậm chí còn có thể mang lại lợi nhuận không nhỏ một khi bạn đã trở thành một Pro Blogger Designer, bằng việc bán Template, bán back-link,…
Tuy nhiên, để trở thành một Pro Blogger Designer không phải một sớm một chiều mà được. Và trong bài viết bên dưới, iTechPlus sẽ giới thiệu đến các bạn mới gia nhập Blogspot, một số mẹo nhỏ cơ bản trong quá trình thiết kế Template cho riêng mình.
1. Xóa thanh Navbar :
Thanh Navbar là thanh chứa các công cụ như Tìm kiếm, theo dõi, chia sẻ, báo cáo lạm dụng,…xuất hiện phía trên cùng của Blog.
#navbar{display:none !important}2. Xóa đường bao quanh liên kết :
Khi click vào link nào nó trên blog, có thể bạn sẽ gặp trường hợp sẽ xuất hiện một đường bao quanh liên kết này nhìn rất không thẩm mỹ tí nào.
a {outline:none}3. Xóa dấu gạch chân dưới liên kết :
Một số template khi rê chuột vào link bất kỳ bạn sẽ thấy xuất hiện một đường gạch chân bên dưới link đó.
a:hover {và thay thế thành :
color:$titlecolor;
text-decoration:underline;
}
a:hover {4. Giới hạn kích thước cho hình ảnh :
color:$titlecolor;
text-decoration:none;
}
Việc giới hạn hoặc qui định kích thước cụ thể cho hình ảnh không những giúp trình duyệt đỡ mất thời gian tính toán kích thước thật của ảnh (sẽ làm chậm thời gian tải trang) mà còn giúp blog bạn tránh được trường hợp hình ảnh quá lớn, sẽ hiển thị tràn cả trang bài viết (Main-wrapper) hoặc bị Sidebar che mất một phần gây mất thẩm mĩ cho Blog.
Cách khắc phục : tìm trong template class “.post img” và chèn đoạn code in đậm như bên dưới :
.post img {5. Ẩn liên kết “Đăng ký: Các Bài đăng (Atom)”
max-width:538px; // chiều rộng tối đa
max-height:468px; //chiều cao tối đa
padding:4px;
border:1px solid $bordercolor;
}
Liên kết này nhằm giúp người đọc nhanh chóng Bookmark lại trang của bạn để xem lại sau. Tuy nhiên, với các tiện ích như Bookmark and Share Homepage hay Đưa bài viết trên Blog lên các mạng xã hội thì tính năng này không còn mấy Blogger sử dụng nữa.
.feed-links {6. Ẩn Status Message Bar
clear: both;
line-height: 2.5em;
display:none;
}
Status Message Bar là thanh trạng thái hiển thị phía trên bài viết khi click vào “Nhãn” hoặc “Lưu trữ”, cho biết trạng thái của trang hiện hành.
.status-msg-wrap{display:none !important;}(Còn tiếp…)
Hy vọng một số thủ thuật nhỏ trên đây sẽ có lúc hữu ích đối với bạn.
Chúc các bạn thành công !
iTechPlus (tổng hợp)
Đăng ký:
Đăng Nhận xét (Atom)
hay đấy, thanks bạn nhiều nhé :)
Trả lờiXóaCảm ơn bạn. Những bài viết rất hay. Mong có những bài viết như thế này. Mình mới dùng nên không rành lắm. Thanks bạn!
Trả lờiXóaThật là tốt khi tìm thấy thông tin này, cám ơn bạn đã chia sẽ lyle
Trả lờiXóa