Một số tính năng cơ bản của template blogspot này
– Giao diện 2 cột, khá đẹp, phù hơp làm một trang blog cá nhân
– Đã được tối ưu chuẩn SEO, code sạch, tốc độ load trang nhanh
– Menu dropdown, Full responsive
– Phân trang chuẩn, bài viết liên quan
– Template blogspot được tối ưu vị trí đặt quảng cáo, rất phù hợp với những bạn chơi Adsense….
Hướng dẫn cài đặt template blogspot này
Template này khá dễ sử dụng, bạn chỉ cần tải về và up lên blog của bạn theo 2 cách.
– Cách 1: Mở bằng notepad++ và copy trực tiếp vào trong mẫu
– Cách 2: Dùng tính năng sao lưu mẫu của blogger để chọn file .xml từ chính máy tính của bạn
Đọc thêm: Cách cài đặt template blogspot
Hướng dẫn fix thẻ h1 cho template này ( cho người đã sử dụng)
Bước 1: Fix h1 cho toàn trang.
Tìm đoạn code này
<b:section class='header' id='header-logo' maxwidgets='1' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='Template blogspot doiguocmoc (Tiêu đề)' type='Header'>
...
</b:section>
Thay bằng đoạn này
<b:section class='header' id='header-logo' maxwidgets='1' showaddelement='yes'>
<b:widget id='Header1' locked='false' title='Template blogspot doiguocmoc (Tiêu đề)' type='Header'>
<b:includable id='main'>
<b:if cond='data:useImage'>
<b:if cond='data:imagePlacement == "BEHIND"'>
<!--
Show image as background to text. You can't really calculate the width
reliably in JS because margins are not taken into account by any of
clientWidth, offsetWidth or scrollWidth, so we don't force a minimum
width if the user is using shrink to fit.
This results in a margin-width's worth of pixels being cropped. If the
user is not using shrink to fit then we expand the header.
-->
<b:if cond='data:mobile'>
<div id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<b:include name='title'/>
</div>
<b:include name='description'/>
</div>
<b:else/>
<div expr:style='"background-image: url("" + data:sourceUrl + ""); " + "background-position: " + data:backgroundPositionStyleStr + "; " + data:widthStyleStr + "min-height: " + data:height + "_height: " + data:height + "background-repeat: no-repeat; "' id='header-inner'>
<div class='titlewrapper' style='background: transparent'>
<b:include name='title'/>
</div>
<b:include name='description'/>
</div>
</b:if>
<b:else/>
<!--Show the image only-->
<div id='header-inner'>
<b:if cond='data:blog.pageType == "index"'>
<h1><data:blog.title/></h1>
</b:if>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
</a>
<!--Show the description-->
<b:if cond='data:imagePlacement == "BEFORE_DESCRIPTION"'>
<b:include name='description'/>
</b:if>
</div>
</b:if>
<b:else/>
<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<b:include name='title'/>
</div>
<b:include name='description'/>
</div>
</b:if>
</b:includable>
<b:includable id='description'>
<div class='descriptionwrapper'>
<p class='description'><span><data:description/></span></p>
</div>
</b:includable>
<b:includable id='title'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<h1 class='title'>
<a expr:href='data:blog.homepageUrl' expr:title='data:blog.title' itemprop='url'>
<span itemprop='name'><data:title/></span>
</a>
</h1>
<b:else/>
<h2 class='title'>
<a expr:href='data:blog.homepageUrl' expr:title='data:blog.title' itemprop='url'>
<span itemprop='name'><data:title/></span>
</a>
</h2>
</b:if>
<b:else/>
<h2 class='title'>
<a expr:href='data:blog.homepageUrl' expr:title='data:blog.title' itemprop='url'>
<span itemprop='name'><data:title/></span>
</a>
</h2>
</b:if>
</b:includable>
</b:widget>
</b:section>
Bước 2: Fix h1 cho title bài viết.
Tìm thẻ <b:includable id=’post’ var=’post’> ngay dưới có đoạn này:
<b:if cond=’data:post.title’>
<h2 class='post-title entry-title' itemprop='name'>
<b:if cond='data:post.link or (data:post.url and data:blog.url != data:post.url)'>
<a expr:href='data:post.link ? data:post.link : data:post.url'>
<data:post.title/>
</a>
<b:else/>
<data:post.title/>
</b:if>
</h2>
</b:if>
Sửa thành
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>
<b:else/>
<h1 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h1>
</b:if>
Đọc thêm: Tối ưu template blogspot chuẩn SEO
Thay ảnh đầu tiên trong bài viết
Phần này mình sẽ hướng dẫn các bạn thay ảnh quảng cáo trong bài viết. Các bạn có thể đọc hướng dẫn cài template blogspot mình đã viết để biết được cách cài đặt và sửa template cơ bản nhất.
Một là bạn thay thành bằng ảnh bạn hoăc ads thì thay đoạn sau thẻ <div class=’post-ads’>
<a href='http://www.congnghewebblog.com/' target='_blank'>
<img alt='Kho template blogspot đẹp' height='251' id='Image1_img' original='http://lh4.googleusercontent.com/-3BjEZpAKfCU/VoX_YDBWKgI/AAAAAAAAAeY/hzI35uQORXw/s1600/template-blogspot.gif' src='http://lh4.googleusercontent.com/-3BjEZpAKfCU/VoX_YDBWKgI/AAAAAAAAAeY/hzI35uQORXw/s1600/template-blogspot.gif' width='295'/></a>
Thành link ảnh của bạn muốn để hoặc bằng đoạn ads.
Nếu bạn muốn tự động hiển thị ảnh đầu tiện của bài viết thì thay đoạn trên bằng đoạn này:
<img width="300px" height="250" class='thumbnail' expr:alt='data:post.title' expr:src= 'data:post.firstImageUrl '/>
DienDan.Edu.Vn Cám ơn bạn đã quan tâm và rất vui vì bài viết đã đem lại thông tin hữu ích cho bạn.DienDan.Edu.Vn! là một website với tiêu chí chia sẻ thông tin,... Bạn có thể nhận xét, bổ sung hay yêu cầu hướng dẫn liên quan đến bài viết. Vậy nên đề nghị các bạn cũng không quảng cáo trong comment này ngoại trừ trong chính phần tên của bạn.Cám ơn.
