[Vip4] – Templates blogspot bán tour du lịch

Giới thiêu mẫu giao diện blogspot về lĩnh vực bán tour du lịch rất đẹp và chuyên nghiệp. Giao diện này được tích hợp giao diện mobile, tối ưu seo blogspot với thẻ heading , js và css load nhanh.

[demo]http://hdbtour.blogspot.com/[/demo]

[Vip3] – Templates blogspot bán chung cư blogspot

Tiếp tục gởi đến anh chị một mẫu giao diện bất động sản cho blogspot thích hợp làm site bán chung cư cho blogspot. Templates được thiết kế đơn giản nhưng không thiếu sự chuyên nghiệp, thiết kế 3 column sang trọng thích hợp cho công ty.

bất động sản blogger templates


Những ưu điểm của mẫu bất động sản này



  • 3 column sang trọng
  • Thiết kế đơn giản thích hợp cho seo
  • Sẽ được tích hợp giao diện mobi và tối ưu thẻ heading nếu khách hàng yêu cầu
  • Được hỗ trợ cài đặt ban đầu miễn phí từ A tới Z
  • Được hỗ trợ để không bị lỗi hình ảnh khi xem bằng mạng VNPT

Để sở hữu templates này vui lòng liên hệ với chúng tôi
Mail : Admin@khamphablog.com
Hotline : 0967 84 99 34
[demo]http://chungcu-hd.blogspot.com/[/demo]

[Tips] – Làm sao để thêm facebook comments vào blogspot

Facebook là mạng xã hội lớn rất tốt cho việc seo blogspot, việc thêm facebook comments vào blogspot là rất cần thiết và tôi khuyên bạn nên thêm nó cho blog của mình. Vì người việc nam hiện nay lên đến trên 90% người dùng facebook.

facebook comments blogspot


Cách thêm comments facebook vào blogspot
Để thêm facebook comments vào blogspot thì chúng ta có 3 bước đơn giản sau
Bước 1 : Tìm đến thẻ </head> trong templates blogspot và thêm đoạn code sau trên nó

<script type=’text/javascript’>
//<![CDATA[
var purl= location.href;
var fb_href = purl.substring(0,purl.indexOf(“.html”)+5);
var fbcm ='<div class=”fb-comments” data-href=”‘+fb_href+'” data-num-posts=”5″ data-width=”560″></div>’;
//]]>
</script>

  • 560 là chiều rộng của facebook comments

Bước 2 : Chèn đoạn code sau trên thẻ </body>

<div id=’fb-root’/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;
fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

Bước 3 : Việc cuối cùng là chèn đoạn code này vào nơi cần hiển thị comments facebook

<script type=’text/javascript’>
document.write(fbcm);
</script>

Lưu mẫu (templates) lại và kiểm tra kết quả. 

[Share] – Templates blogspot chuẩn seo chia sẻ thủ thuật

Nói đến một templates blogspot chuẩn seo thì nhiều người còn không biết templates blogspot chuẩn seo là nó như nào, có cái gì trong đó mà nó chuẩn seo. Các bạn tìm đến những templates chuẩn seo trên mạng phần lớn thì họ cài link ẩn trong templates và cho đó là chuẩn seo.

Vậy như thế nào là templates blogspot chuẩn seo?

1. Templates chuẩn seo ít nhất phải thỏa mãn những điều kiện sau :

2. Chia sẻ templates blogspot chuẩn seo

Như tiêu đề thì bay giờ mình sẽ chia sẻ một templates blogspot chuẩn seo thích hợp làm site chia sẻ thủ thuật và tất nhiên là thỏa mãn những vấn đề trên mình đã nêu ra các bạn có thể kiểm tra thử và nhận xét.


Hi vọng các bạn sẽ hài lòng với templates blogspot này mọi thắc mắc comments bên dưới để được hổ trợ, share lại nhớ để lại nguồn Khám Phá Blog đừng để danh tiếng blog của bạn bị ném đá.

[Tips] – Slider Image đơn giản cho blogspot

Slider Image (slider ảnh) là một tiện ích được các blogger thường hay dùng để thêm phần chuyên nghiệp cho blog của mình hơn. Nhưng đối với các seoer làm seo blogspot thì hộ thường chọn những slider image đơn giản nhất để góp phần tối ưu seo cho blogspot của họ.

slider image cho blogspot

Thêm slider image cho blogspot
1. Thêm css
Tìm đế thẻ ]]></b:skin> trong templates blogspot và thêm đoạn code này ngay trên nó

#featured {height: 1px; width: 1px; overflow: hidden;}
div.orbit {
width: 1px;
height: 1px;
position: relative;
overflow: hidden;
}
div.orbit img {
position: absolute;
top: 0;
left: 0;
}
div.orbit a img {border: none;}
div.timer {
width: 40px;
height: 40px;
overflow: hidden;
position: absolute;
top: 10px;
right:10px;
opacity: .6;
cursor: pointer;
z-index: 1001;
}
span.rotator {
display: block;
width: 40px;
height: 40px;
position: absolute;
top: 0;
left: -20px;
background: url(http://2.bp.blogspot.com/-RIbuOzbC8os/UwDPg1IgFaI/AAAAAAAAGN0/DrmP4kh7G08/s1600/timer-icon.png);
background-repeat: no-repeat;
z-index: 3;
}
span.mask {
display: block;
width: 20px;
height: 40px;
position: absolute;
top: 0;
right: 0;
z-index: 2;
overflow: hidden;
}
span.rotator.move {left: 0;}
span.mask.move {
width: 40px;
left: 0;
background: url(http://1.bp.blogspot.com/-9FdwFtBqvS4/UwDPqzE3ABI/AAAAAAAAGN8/r4xhlPpOHY4/s1600/timer-right.png);
background-repeat: repeat;
background-position: 0px 0px;
}
span.pause {
display: block;
width: 40px;
height: 40px;
position: absolute;
top: 0;
left: 0px;
background-image: url(http://2.bp.blogspot.com/-8G-L7Onwt-Y/UwDPy372vYI/AAAAAAAAGOE/4qUdsKJaK98/s1600/pause-icon.png);
background-repeat: no-repeat;
z-index: 4;
opacity: 0;
}
div.timer:hover span.pause,
span.pause.active,
div.timer:hover span.pause.active { opacity: 1; }
div.caption {
background: #000;
background: rgba(0,0,0,.6);
width: 100%;
z-index: 1000;
position: absolute;
bottom:-100px;
color: #fff;
padding: 8px 0;
text-align: center;
}
div.caption span {
padding: 0 10px;
font-size: 14px;
text-shadow: 0px 1px 0px rgba(0,0,0,.8);
margin: 0;
}
.orbit-caption { display: none; }
div.orbit:hover div.slider-nav { display: block; }
div.slider-nav { display: none; }
div.slider-nav span {
width: 33px;
height: 33px;
text-indent: -9999px;
position: absolute;
z-index: 1000;
top: 43%;
cursor: pointer;
}
div.slider-nav span.right {
background-image: url(http://1.bp.blogspot.com/-oW1NQkjT3Ws/UwDP7b7T2-I/AAAAAAAAGOM/JaeJxm9qZ60/s1600/arrow-right.png);
right: 10px;
}
div.slider-nav span.left {
background-image: url(http://3.bp.blogspot.com/-T9eMQBFvVro/UwDQBxCnpWI/AAAAAAAAGOU/L8KS7EAOqOU/s1600/arrow-left.png);
left: 10px;
}
.orbit-bullets {
position: absolute;
z-index: 1000;
list-style: none;
top: 10px;
left: 7px;
margin: 0;
padding: 0;
}
.orbit-bullets li {
float: left;
margin-left: 5px;
cursor: pointer;
color: #999;
text-indent: -9999px;
background-image: url(http://1.bp.blogspot.com/-lKQgWI4_xhQ/UwDQI0WIQmI/AAAAAAAAGOc/1e6zuurwFSg/s1600/bullets.png);
background-repeat: no-repeat;
background-position: 0 0;
width: 7px;
height: 7px;
overflow: hidden;
}
.orbit-bullets li.active { color: #222; background-position: -7px 0; }

2. Thêm scripts
Tiếp tục tìm đến thẻ </head> và thêm trên nó đoạn code này

<script src=’http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js’ type=’text/javascript’/>
<!–[if IE]>
<style type=”text/css”>
.timer { display: none !important; }
div.caption { background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);zoom: 1; }
</style>
<![endif]–>
<script type=’text/javascript’>
$(window).load(function() {
$(&#39;#featured&#39;).orbit({
advanceSpeed: 5000,
&#39;bullets&#39;: true,
&#39;timer&#39; : true,
&#39;animation&#39; : &#39;horizontal-slide&#39;
});
});
</script>
<script type=’text/javascript’>
//<![CDATA[
(function(e){e.fn.orbit=function(a){a=e.extend({animation:”fade”,animationSpeed:800,advanceSpeed:4E3,startClockOnMouseOut:true,startClockOnMouseOutAfter:3E3,directionalNav:true,captions:true,captionAnimationSpeed:800,timer:false,bullets:false},a);return this.each(function(){function m(c){function g(){f.eq(h).css({“z-index”:1});s=false}var h=b,k=c;if(h==k)return false;if(!s){s=true;if(c==”next”){b++;if(b==n)b=0}else if(c==”prev”){b–;if(b<0)b=n-1}else{b=c;if(h<b)k=”next”;else if(h>b)k=”prev”}a.bullets&&
x();if(a.animation==”fade”){f.eq(h).css({“z-index”:2});f.eq(b).css({opacity:0,”z-index”:3}).animate({opacity:1},a.animationSpeed,g);a.captions&&o()}if(a.animation==”horizontal-slide”){f.eq(h).css({“z-index”:2});k==”next”&&f.eq(b).css({left:t,”z-index”:3}).animate({left:0},a.animationSpeed,g);k==”prev”&&f.eq(b).css({left:-t,”z-index”:3}).animate({left:0},a.animationSpeed,g);a.captions&&o()}if(a.animation==”vertical-slide”){f.eq(h).css({“z-index”:2});k==”prev”&&f.eq(b).css({top:u,”z-index”:3}).animate({top:0},
a.animationSpeed,g);k==”next”&&f.eq(b).css({top:-u,”z-index”:3}).animate({top:0},a.animationSpeed,g);a.captions&&o()}}}var b=0,n=0,t,u,s,d=e(this).addClass(“orbit”),f=d.find(“img, a img”);f.each(function(){var c=e(this),g=c.width();c=c.height();d.width(g);t=d.width();d.height(c);u=d.height();n++});f.eq(b).css({“z-index”:3});if(a.timer){d.append(‘<div class=”timer”><span class=”mask”><span class=”rotator”></span></span><span class=”pause”></span></div>’);var j=e(“div.timer”),p;if(j.length!=0){var C=
a.advanceSpeed/180,v=e(“div.timer span.rotator”),y=e(“div.timer span.mask”),z=e(“div.timer span.pause”),l=0,A,w=function(){p=true;z.removeClass(“active”);A=setInterval(function(){var c=”rotate(“+l+”deg)”;l+=2;v.css({“-webkit-transform”:c,”-moz-transform”:c,”-o-transform”:c});if(l>180){v.addClass(“move”);y.addClass(“move”)}if(l>360){v.removeClass(“move”);y.removeClass(“move”);l=0;m(“next”)}},C)},q=function(){p=false;clearInterval(A);z.addClass(“active”)};w();j.click(function(){p?q():w()});if(a.startClockOnMouseOut){var B;
d.mouseleave(function(){B=setTimeout(function(){p||w()},a.startClockOnMouseOutAfter)});d.mouseenter(function(){clearTimeout(B)})}}}if(a.captions){d.append(‘<div class=”caption”><span class=”orbit-caption”></span></div>’);var r=d.children(“div.caption”).children(“span”).addClass(“orbit-caption”).show(),o=function(){var c=f.eq(b).attr(“rel”),g=e(“#”+c).html(),h=r.height()+20;r.attr(“id”,”#”+c).html(g);g?r.parent().stop().animate({bottom:0},a.captionAnimationSpeed):r.parent().stop().animate({bottom:-h},
a.captionAnimationSpeed)};o()}if(a.directionalNav){d.append(‘<div class=”slider-nav”><span class=”right”>Right</span><span class=”left”>Left</span></div>’);j=d.children(“div.slider-nav”).children(“span.left”);var D=d.children(“div.slider-nav”).children(“span.right”);j.click(function(){a.timer&&q();m(“prev”)});D.click(function(){a.timer&&q();m(“next”)})}if(a.bullets){d.append(‘<ul class=”orbit-bullets”></ul>’);var E=e(“ul.orbit-bullets”);for(i=0;i<n;i++){j=e(“<li>”+i+”</li>”);e(“ul.orbit-bullets”).append(j);
j.data(“index”,i);j.click(function(){a.timer&&q();m(e(this).data(“index”))})}var x=function(){E.children(“li”).removeClass(“active”).eq(b).addClass(“active”)};x()}})}})(jQuery);
//]]>
</script>

3. Đặt slider image
Bây giờ bạn chỉ cần chịn một vị trí thích và chèn đoạn code bên dưới vào là xong

<div id=’featured’><a href=’Link URL‘><img rel=’photo1’ src=”image URL” style=’height: 348px; width: 590px;’/></a><span class=’orbit-caption’ id=’photo1′>Ut eleifend tortor aliquet, fringilla nunc non, consectetur magna.</span><a href=”Link URL“><img rel=’photo2′ src=”image URL” style=’height: 348px; width: 590px;’/></a><span class=’orbit-caption’ id=’photo2′>This is an example of description with links: <a href=’Description Link URL’ style=’color: #09A7EA;’>Kham Pha Blog</a></span><a href=”Link URL”><img rel=’photo3′ src=”image URL” style=’height: 348px; width: 590px;’/></a><span class=’orbit-caption’ id=’photo3′ style=’text-align:center;’>Ut eleifend tortor aliquet, fringilla nunc non, consectetur magna.</span><a href=’Link URL’><img rel=’photo4′ src=”image URL” style=’height: 348px; width: 590px;’/></a><span class=’orbit-caption’ id=’photo4′>This is an example of description with links: <a href=’Description Link URL’ style=’color: #09A7EA;’>Helplogger</a></span></div>

Trong đó
  • Link url : thay bằng link bài viết khi click vào ảnh
  • Image url : là url ảnh khi muốn chạy slider
  • Có 1 đoạn text : đó là description (mô tả) của ảnh

Bây giờ lưu mẫu lại và kiểm tra thành quả thôi nào 😀