Panduan Cara Penggunaan Template Sporty Magazine 2

Langkah pertama, Anda harus men-download Majalah Sporty 2 file. Setelah itu, ikuti instruksi di bawah ini.

Menu Navigation Dropdown

Untuk mengatur menu ini, silakan kunjungi halaman stukrut HTML Anda (tidak perlu untuk memperluas), kemudian gulir ke bawah dan cari kode berikut: <div id='menuwrapperpic'> (Catatan: untuk pencarian cepat, tekan tombol F3, ketik kode di atas dan masukkan).Setelah kode ini, Anda akan menemukan menu navigasi dropdwon bawah ini:

<div id='menuwrapperpic'>
<div id='menuwrapper'>
<ul id='menubar'>
<li class='selected'><a href='/'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeNVUOP7hJEuFTF4AoLljbfMVbmsY9WrlZwzsnTFMZr7UqUPHoY3Xf4e72K__Op0IUgb_KkATIWEaJ6Acv2dKqVeTQ9FWlLwvknDj5OP_ZW1_iOGOQ18C68OQPD4EEDwWZoe7M5qzqeYA/s1600/home_white.png' style='padding:0px;'/></a></li>
<li class='selected'><a href='#'>About Us</a></li>
<li><a class='trigger' href='#'>Contact Us</a>
<ul>
<li><a href='#'>Herdiansyah Blog</a></li>
<li class='hr'/>
<li><a href='#'>Contact on Facebook</a></li>
<li><a href='#'>Contact on Twitter</a></li>
<li class='hr'/>
<li><a href='#'>Free Template Design</a></li>
</ul>
</li>
<li><a href='#'>Moto GP</a></li>
<li><a href='#'>Football</a></li>
<li><a href='#'>Formula 1</a></li>
<li><a href='#'>Web Design</a></li>
<li><a href='#'>Free Template</a></li>
<li><a href='#'>Videos</a></li>
<li><a href='#'>Image</a></li>
<li><a href='#'>Download</a></li>
<li><a class='trigger' href='#'>More</a>
<ul>
<li><a href='#'>Editorial</a></li>
<li class='hr'/>
<li><a href='#'>Off Topic</a></li>
</ul>
</li>
</ul>
<br class='clearit'/>
</div>
<div style='clear:both;'/>
</div>

Catatan : mengubah kode # dengan alamat url link anda, dan label nama dengan label atau kategori.

News Ticker

Langkah pertama, Anda harus mendaftarkan blog Anda ke API Google Code dan Anda akan melihat kode API Anda. Setelah itu, cari kode ini di bawah ini pada HTML tab edit:

<!-- News Ticker -->
<script src='http://www.google.com/jsapi?key=ABQIAAAA4qkT5i26SQ6NmgJd5KQemhRQ_a6zv5_Bim3H_GL4gaueIFZ15xRdt8jcAUk8ZHokIVo-TBZgYVbkzw'/>

Catatan : ganti kode biru, dengan API Key Anda.Langkah selanjutnya, Anda harus mengubah link url Anda agar berita ticker muncul dengan posting Anda terbaru. Cari kode di bawah ini pada tab edit HTML.

<div class='newspic'>
<div class='news'>
<div style='float:left;padding:5px 60px 5px 0;font:bold 14px Arial;color:#333;text-transform:none;'>News Update :</div>
<div style='float:left;width:800px;padding:4px 0; position:relative; overflow:hidden;'>
<script type='text/javascript'>
var cssfeed=new gfeedrssticker(&quot;example1&quot;, &quot;example1class&quot;, 4000, &quot;_new&quot;)
cssfeed.addFeed(&quot;News Update&quot;, &quot;http://sportymagazine2.blogspot.com/feeds/posts/default&quot;) //Specify &quot;label&quot; plus URL to RSS feed
cssfeed.displayoptions(&quot;date&quot;) //show the specified additional fields
cssfeed.setentrycontainer(&quot;div&quot;) //Wrap each entry with a DIV tag
cssfeed.filterfeed(10, &quot;date&quot;) //Show 10 entries, sort by date
cssfeed.entries_per_page(1)
cssfeed.init()
</script>
</div>
</div><div style='clear:both;'/>
</div>

Catatan: ganti kode merah, dengan situs / link blog url.

Featured Slideshow Content

Langkah pertama, tambahkan html/java script pada widget halaman Anda. Masukan kode ini di bawah ini:

<div id='featured'>
<ul class='ui-tabs-nav'>

<!-- 1st Small Image -->
<li class='ui-tabs-nav-item ui-tabs-selected' id='nav-fragment-1'><a href='#fragment-1'><img alt="" src="#" /><span>Post Title</span></a></li>

<!-- 2st Small Image -->
<li class='ui-tabs-nav-item' id='nav-fragment-2'><a href='#fragment-2'><img alt="" src="#" /><span>Post Title</span></a></li>

<!-- 3st Small Image -->
<li class='ui-tabs-nav-item' id='nav-fragment-3'><a href='#fragment-3'><img alt="" src="#" /><span>Post Title</span></a></li>

<!-- 4st Small Image -->
<li class='ui-tabs-nav-item' id='nav-fragment-4'><a href='#fragment-4'><img alt="" src="#" /><span>Post Title</span></a></li>
</ul>

<!-- First Content -->
<div class='ui-tabs-panel' id='fragment-1' style=''>
<img alt="" src="#" />
<div class='info'>
<h2><a href=' your-url-link '>Post Title</a></h2>
</div></div>

<!-- Second Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-2' style=''>
<img alt="" src="#" />
<div class='info'>
<h2><a href=' your-url-link '>Post Title</a></h2>
</div></div>

<!-- Third Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-3' style=''>
<img alt="" src="#" />
<div class='info'>
<h2><a href=' your-url-link '>Post Title</a></h2>
</div></div>

<!-- Fourth Content -->
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-4' style=''>
<img alt="" src="#" />
<div class='info'>
<h2><a href='your-url-link'>Post Title</a></h2>
</div></div>
</div>

Catatan: ganti kode yang berwarna merah (#) dengan link url gambar Anda, oranye kode (Post Title) dengan judul posting Anda, dan kode biru (your-url-link) dengan posting link url anda.

Featured Label Categories

Langkah Pertama, buka halaman blog Anda dan menambahkan HTML / Java Script widget. Langkah selanjutnya, masukkan kode ini di bawah ini :

<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 60;</script>

<script type="text/javascript" src="/feeds/posts/default/-/Borneo?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>

Catatan: Perubahan kode oranye (3), dengan jumlah posting akan muncul, dan merah kode (Borneo) dengan label atau kategori.

Twitter Widget (Live Updates)

Buka elemen halaman anda dan masukkan kode ini di bawah ini dengan menambahkan HTML / Java Script baru.

<div style="background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg57F-8Ha-CDuG-jXZMDZX3ylv5OhxnfBmKfcSAQY5RGEy-pQUyUaBIBbQubNE1jFDFhEYieJYv5V_1prdxHHv6Wwt0E27hH_mh6-26hjMsfFjeswPCc0CQi-Z1PeP0Hmbftyuq2pymbtY/s1600/bg_twitter.gif) no-repeat;padding-top:40px;padding-left:5px">
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 10,
interval: 3000,
width: 285,
height: 118,
theme: {
shell: {
background: 'transparent',
color: '#000000'
},
tweets: {
background: 'transparent',
color: '#000000',
links: '#B45F04'
}
},
features: {
scrollbar: true,
loop: true,
live: true,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'default'
}
}).render().setUser('borneotemplates').start();
</script>
</div>

Catatan: mengubah kode oranye (borneotemplates) dengan nama pengguna twitter Anda.

Search Widget 

Buka elemen halaman anda dan masukkan kode ini di bawah ini dengan menambahkan HTML / Java Script baru.

<form name="jksearch" action="http://www.google.com/search" method="get" onsubmit="jksitesearch(this)" target="_blank">

<input id="hiddenquery" type="hidden" name="q" />
<input name="qfront" onfocus="if(this.value==this.defaultValue)this.value=&#39;&#39;;" value="Search on this site..." type="text" onblur="if(this.value==&#39;&#39;)this.value=this.defaultValue;" style="width: 240px;border:none;padding:8px 10px; font:normal 11px arial;color:#666; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjur4jykKAtlAQ9f6jy5S5sQL-CyLoEqHpsfzK7vLhXVXDo2_LrsJWJqcTEO5OORhWIiPcvv05wiGxgP4m__2KGwHelps6uhRg_b-UP84YLPYHiUohGiaNN4oObFrPmtIaOMkvCYuQsmHg/s1600/search_field.jpg) no-repeat;" /><input type="image" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjw6bvxjfUqEqziAWbYL6LiQmYwxS8dUsKZEcyjgjPRGnn4PfZ-1YnyncqFtAfna1J2gyBNPIPJ5Qh6Z_rB7THoGOMvxP5v6_zT3abJtmxl0ebIU7xduso5ytWKbzliMMCi-y6Nbn2Zjc/s1600/search_button.jpg" align="top" value="Search"/>

<div style="font: normal 11px Arial;color:#666;padding:2px 0;">
<input name="se" type="radio" checked /> Google
<input name="se" type="radio" /> Yahoo
<input name="se" type="radio" /> Msn
</div>

<script type="text/javascript">

// All-in-one Internal Site Search script- By JavaScriptKit.com (http://www.javascriptkit.com)
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// This notice must stay intact for use

//Enter domain of site to search.
var domainroot="www.borneotemplates.com"

var searchaction=[ //form action for the 3 search engines
"http://www.google.com/search",
"http://search.yahoo.com/search",
"http://search.msn.com/results.aspx"
]

var queryfieldname=["q","p","q"] //name of hidden query form for the 3 search engines

function switchaction(cur, index){
cur.form.action=searchaction[index]
document.getElementById("hiddenquery").name=queryfieldname[index]
}
function jksitesearch(curobj){
for (i=0; i< document.jksearch.se.length; i++){ //loop through radio to see which is checked
if (document.jksearch.se[i].checked==true)
switchaction(document.jksearch.se[i], i)
}
document.getElementById("hiddenquery").value="site:"+domainroot+" "+curobj.qfront.value
}
</script>
</form>

Catatan: mengubah kode oranye (www.borneotemplates.com) dengan nama pengguna twitter Anda.

Sumber: http://boqo.blogspot.com/2012/04/panduan-cara-penggunaan-sporty-magazine.html#ixzz20mPxPstG

Artikel Terkait Lainnya :