Ads Nhà Tài Trợ

Xưởng SX Ván Ghép, Thớt Gỗ Các Loại - Nam Trung JSC
%
Xe đạp địa hình MTB Txed Brave Boy 20 20 inch Size XXS
Xe Đạp
MTB
%
Xe đạp địa hình MTB Pacific AQUILA 2.0 27.5 inch
Xe Đạp
MTB
%
Xe đạp địa hình MTB Pacific OVERRIDE 5.0 27.5 inch
Xe Đạp
MTB
%
Xe đạp địa hình MTB Exotic 2658 4.0 AHHD 26 inch
Xe Đạp
MTB

4 thủ thuật chỉnh sửa template coming soon kết hợp landing page làm trang Seo giới thiệu công ty, cá nhân cực kỳ bá đạo.

Thủ thuật 1 : Chia bài viết trang chủ và trang nhãn thành 2 cột cho blogspot

MỤC LỤC: Nội dung bài viết
Tìm đoạn code sau  trong chỉnh sửa mẫu cho blogger :

.post {
margin:0px 3px 5px 0px ;
padding:5px;
}
.post h3 {
font-size:160%;
font-weight:bold;
margin:3px;
padding:0px;
}
.post h3 a {
color:#0000ff;
}
.post h3 a:hover {
color:#666;
}

Thay bằng đoạn code sau :


.post {
background:none;
margin-right:0px;
padding:5px;
width:100%;}
.post h3 {
font-size:14px; /* cỡ chữ của tiêu đề bài viết*/
font-weight:bold;
margin:3px;
padding:0px;
}
.post h3 a {
color:#0000ff; /* màu chữ của tiêu đề bài viết*/
}
.post h3 a:hover {
color:#666; /* màu chữ của tiêu đề bài viết khi rê chuột*/
}


Kế tiếp thêm đoạn code sau trước thẻ </head> :


<b:if cond='data:blog.pageType == &quot;index&quot;'>
<style type='text/css'>
.post {
width:48%;
float:left;
margin:0px 3px 5px 0px ;
padding:5px;
background:#eee; /* màu nền của bài viết*/
}
</style>
</b:if>



Lưu mẫu và xem kết quả.

Xem trang demo : https://dogouma.blogspot.com/search/label/Wooden cutting board

Xem thêm :
http://blog-toantap.blogspot.com/2015/08/hien-thi-bai-viet-dang-luoi-grid-view.html
https://tuduysale.com/hien-thi-bai-viet-dang-luoi-trong-genesis-su-dung-css-grid/#ftoc-heading-2

Thủ thuật 2 : Tùy biến label cho bloger

Đầu tiên bạn vào cấu hình nhãn cần hiển thị chuyển dạng danh sách (list) sang dạng đám mây (cloud)

 Chèn đoạn code sau vào cuối đoạn code ]]></b:skin> trong chỉnh sửa mẫu template :


<style>

.label-size {
    float:left;
    margin:0 0 7px 20px;
    position:relative;
    font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size:0.75em;
    font-weight:bold;
    text-decoration:none;
    color:#996633;
    text-shadow:0px 1px 0px rgba(255,255,255,.4);
    padding:0.417em 0.417em 0.417em 0.917em;
    border-top:1px solid #d99d38;
    border-right:1px solid #d99d38;
    border-bottom:1px solid #d99d38;
    -webkit-border-radius:0 0.25em 0.25em 0;
    -moz-border-radius:0 0.25em 0.25em 0;
    border-radius:0 0.25em 0.25em 0;
    background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');
    -webkit-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    -moz-box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
    box-shadow:
        inset 0 1px 0 #faeaba,
        0 1px 1px rgba(0,0,0,.1);
 
    z-index:100;
}

.label-size:before {
    content:'';
    width:1.30em;
    height:1.39em;
    background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');
    position:absolute;
    left:-0.69em;
    top:.2em;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
    border-left:1px solid #d99d38;
    border-bottom:1px solid #d99d38;
    -webkit-border-radius:0 0 0 0.25em;
    -moz-border-radius:0 0 0 0.25em;
    border-radius:0 0 0 0.25em;
    z-index:1;
}

.label-size:after {
    content:'';
    width:0.5em;
    height:0.5em;
    background:#fff;
    -webkit-border-radius:4.167em;
    -moz-border-radius:4.167em;
    border-radius:4.167em;
    border:1px solid #d99d38;
    -webkit-box-shadow:0 1px 0 #faeaba;
    -moz-box-shadow:0 1px 0 #faeaba;
    box-shadow:0 1px 0 #faeaba;
    position:absolute;
    top:0.667em;
    left:-0.083em;
    z-index:9999;
}
.label-size:hover {
    background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');
    border-color:#e1b160;
}
 
.label-size:hover:before {
    background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');
    border-color:#e1b160;
}
#Label1 {height:210px !important;}

</style>
Lưu mẫu và xem kết quả.

Thủ thuật 3 : Thay đổi kích thước thumbnail cho blogger

Cách 1 : 

Gõ Ctrl+F tìm dòng lệnh expr:src=’data:post.thumbnail’
Thêm class=”resizethumbnail” vào 'image tag' như hình dưới.


Chèn thêm đoạn script vào cuối html :

<script type='text/javascript'>
$(document).ready(function() {$('.resizethumbnail').attr('src', function(i, src) {return src.replace( 's72-c', 's500-c' );});});
</script> 


Cách 2 :

Code tự động crop và resize thumbnail dành cho Blogger
Chèn  đoạn script sau vào trên thẻ </head>

<script type='text/javascript'>//<![CDATA[
$(document).ready(function() {
  var w = 200;
  var h = 200;
  $('id 1, class 1, id 2, class 2,...').find('img').each(function(n, image){
    var image = $(image);
    image.attr({src : image.attr('src').replace(/s\B\d{2,4}/,'s' + w + '-h' + h +'-c')});
    image.attr('width',w);
    image.attr('height',h);
  });
});
//]]></script>

Bạn có thể thay đổi kích thước resize ở w và h, còn dòng id 1, class 1 là bạn thay thuộc tính id hay class mà bạn muốn resize, ví dụ: .PopularPost hay #related-posts

Trong trường hợp bạn resize và crop ảnh bài post có class là .post , trong trường hợp này đoạn script sẽ ảnh hưởng đến ảnh trong bài viết nó sẽ đồng loạt resize và crop ảnh trong bài viết Do đó trong trường hợp này bạn cần đặt đoạn script trên vào thẻ điều kiện sau:

<b:if cond='data:blog.pageType != &quot;item&quot;'>Copy đoạn script vào đây</b:if>


Xem thêm :
http://tintucmystown.blogspot.com/2016/10/thay-oi-kich-thuoc-anh-thumbnail-trong.html
https://kslzone.blogspot.com/2014/02/tang-kich-thuoc-thumbnail-khong-giam.html
https://forum.vietdesigner.net/threads/huong-dan-tu-dong-crop-va-resize-thumbnail-danh-cho-blogger.69297/

Thủ thuật 4 : Chèn thanh menu cho blogspot

 Xem chi tiết các mẫu menu blogger theo link sau : http://www.ivietpr.com/2017/09/code-menu.html

4 thủ thuật trên áp dụng chỉnh sửa template coming soon kết hợp với template landing page làm trang Seo giới thiệu công ty, cá nhân cực kỳ bá đạo.

Tìm hiểu thêm các thủ thuật khác giúp chỉnh sửa và làm đẹp giao diện (template) blogspot :

Code ẩn hiện một phần nội dung bài viết trên blog (DÙNG ẨN DÒNG KHÔNG ĐƯỢC XÓA TRONG BLOGGER)



Chèn thêm thuộc tính vào thẻ cần ẩn nội dung : style="display: none;"

Cách xóa bỏ thuộc tính cung cấp bởi Blogger cho Blogspot (xóa bỏ “Được Tạo Bởi Blogger” cho blogger) :



Thuộc tính cung cấp bởi Blogger sẽ được gắn với id Attribution1, tìm ID này sau Thay đổi thuộc tính locked từ True sang False. Sau đó  vào mục Bố cục tìm đến Widget mặc định này và nhấn vào xóa bỏ để xóa tiện ích. Nếu như bạn không thực hiện các bước trên hoặc thực hiện sai thì nút Xóa bỏ này sẽ không xuất hiện.

Thay đổi "Hiển thị các bài đăng có nhãn" cho Blogger :
Xem tại đây :  https://kslzone.blogspot.com/2013/12/thay-doi-hien-thi-cac-bai-dang-co-nhan.html

Tạo Bài viết liên quan theo nhiều label cho blogspot :

Xem tại đây : http://diaoctrungtam-igooseo.blogspot.com/2014/05/bai-viet-lien-quan-theo-nhieu-label-cho.html

Thủ thuật bài viết liên quan có hình ảnh và bài viết cho Blogger
Xem tại đây : http://lambloglibertagia.blogspot.com/2014/06/related-posts-thu-thuat-bai-viet-lien.html

Các dạng “Bài viết liên quan” đẹp cho Blogger :

Xem tại đây :
https://blog.landgonow.com/2011/07/tien-ich-bai-viet-lien-quan-cho-blogger.html 
http://www.tips24h.net/2017/04/bai-viet-lien-quan-cho-blogger-blogspot.html

Giới thiệu bài viết hay  :

Hướng dẫn tạo MỤC LỤC cho bài viết Website Blogspot trở nên chuyên nghiệp 
http://www.nguyenthelinh.com/2017/12/huong-dan-tao-muc-luc-cho-bai-viet.html#phan-1

10 Plugin tạo mục lục WordPress tốt nhất năm 2019
https://timtoi.net/plugin-tao-muc-luc-wordpress-tot-nhat/
Ivietpr.com Blog Cá Nhân, Nền Tảng Blogger, Giao Diện Fletro : Xây dựng và phát triển nội dung, theo số liệu phân tích trên cấu trúc content của nhật ký trực tuyến digitalnomad.vn [ Blog Chạy Thử Nghiệm Đa Cấu Trúc ]

Bạn có thể thích những bài đăng này

  1. To insert a code use <i rel="pre">code_here</i>
  2. To insert a quote use <b rel="quote">your_qoute</b>
  3. To insert a picture use <i rel="image">url_image_here</i>





💰

Top Sản Phẩm Công Nghệ / Thiết Bị Điện Gia Dụng /,...
Về Trang Chủ
Điện Thoại Hỗ Trợ Làm Việc Từ Xa, Du Lịch, Chụp Ảnh,... Thiết bị công nghệ không thể dành cho Workcation, TELEWORK, WFH , người làm nghề MMO, KOC / Streamer và những người biên tập, sáng tạo nội dung Video, dân Viết Blog Kiếm Tiền Từ affiliate marketing , bổ sung và làm đa dạng nguồn tài chính cá nhân, kiếm thêm Thu Nhập Thụ Động,...

Xem Giá Bán

Lap Top thiết kế sang chảnh, sáng tạo kết hợp từ chiếc máy tính bảng và chiếc laptop gaming đi kèm những trang bị công nghệ tân tiến nhất, laptop Asus Gaming ROG Flow Z13 GZ301Z i7 12700H (LD110W), siêu phẩm hỗ trợ làm việc, học tập online, đem đến cho bạn những giây phút trải nghiệm giải trí cực đỉnh cùng laptop CPU thế hệ 12 mới nhất.

Xem Giá Bán

Flagship hiệu năng cực khủng, trang bị những công nghệ tiên tiến nâng chất lượng chụp ảnh lên một tầm cao mới, chiếc điện thoại thông minh không thể thiếu dành cho dân Workcation, TELEWORK, WFH,... những du mục số thời hiện đại, dân xê dịch thích kiếm tiền từ du lịch.

Xem Giá Bán

Điện Thoại Thông Minh kháng nước thế hệ mới, hiệu năng cực đỉnh, camera sắc nét cùng viên pin cực khủng bên trong, hứa hẹn mang đến trải nghiệm cực kỳ đáng giá, thiết bị công nghệ không thể thiếu dành cho dân Workcation, TELEWORK, WFH,... những du mục số thời hiện đại, dân xê dịch thích kiếm tiền từ du lịch.

Xem Giá Bán

Laptop mỏng nhẹ, kết hợp giữa chiếc máy tính bảng và máy tính xách tay tạo nên diện mạo thời thượng, năng động kết hợp hiệu năng mạnh mẽ vượt trội, người đồng hành cùng bạn trên mọi hành trình.

Xem Giá Bán

Laptop sang trọng, mỏng nhẹ, công nghệ 2 màn hình cảm ứng, thuận tiện trong công việc, thiết bị giải trí cực đỉnh, xử lý đồ họa mượt mà,....

Xem Giá Bán