Johny Jogos - Mẫu template blogspot dành cho web game đẹp và chuyên nghiệp

Với một số bạn đã biết chơi blog lâu thì không xa lạ gì với mẫu template blogspot Johny Jogos khá đẹp và chuyên nghiệp này, template Johny Jogos được thiết kế bởi maskolis. Ở đây share123.vn chỉ xin tổng hợp và chia sẻ lại cho những bạn chưa biết và có thể là lính mới ra nhập bloger chưa biết cách cài đặt hoàn chỉnh template này.
1. Demo:
Live Demo: http://johny-jogos.blogspot.com/
Ảnh Demo:

2. Download: Tại đây ( file .xml)
Bạn nào muốn lấy data của Template này để test demo thì có thể tham khảo bài viết này : Click here

3. Hướng dẫn cài đặt:
1. Hiển thị thanh trượt ở trên đầu Blog

Để hiển thị thanh trượt này các bạn vào: Đăng nhập => Mẫu => Chỉnh sửa HTML => và tìm đến đoạn code sau ( sử dụng Ctrl+F )

<div id='slider'>
<div id='loopedSlider'>
<div class='container'>
<script>
document.write("<script src=\"/feeds/posts/default/-/hot games?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
</script>
</div>
<a class='previous' href='#'></a>
<a class='next' href='#'></a>
<ul class='pagination'>
<script>
document.write("<script src=\"/feeds/posts/default/-/hot games?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showrecentposts4\"><\/script>");
</script>
</ul>
<script type='text/javascript'>
$(function(){
$('#loopedSlider').loopedSlider();
});
</script>
</div>
</div>

Ở đây các bạn thay hot games thành nhãn mà các bạn muốn hiển thị trên thanh trượt.

2. Hiển thị  Widget Tab

Để hiển thị và sử dụng được tiện ích này đầu tiên các bạn  cần tìm đến đoạn code:

Title1="Adventure";Title2="Action";Title3="Bike Game";Title4="Dress-Up";Title5="Strategy";Title6="Sport Game"

( Thay thế các nhãn bạn muốn hiển thị vào các nhãn màu xanh)

Tiếp theo tìm đến đoạn code sau và thay tương ứng theo từng Id

<div id='tabber-wrapper'>
<ul class='tab-view'>
<li><a href='#tab1'><script>document.write(Title1);</script></a></li>
<li><a href='#tab2'><script>document.write(Title2);</script></a></li>
<li><a href='#tab3'><script>document.write(Title3);</script></a></li>
<li><a href='#tab4'><script>document.write(Title4);</script></a></li>
<li><a href='#tab5'><script>document.write(Title5);</script></a></li>
<li><a href='#tab6'><script>document.write(Title6);</script></a></li>
</ul><div class='clear'/>
<div class='tab-wrapper'>
<div class='tabber' id='tab1'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/hot games?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab2'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/play station?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab3'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/review?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab4'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/hot games?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab5'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/play station?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='tabber' id='tab6'>
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default/-/hot games?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script></div>
<div class='clear'/>
</div></div>

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

Nguồn: Share123.vn

Xem Thêm :