May 20, 2012

ZonaMagz Template Berita Elegant

Seperti yang Kang Fathur bagikan sebelumnya, kali in gak kalah menarik dengan template-template magazine yang ada. Sebab banyak fitur yang ditampilkan dalam template yang saya beri nama ZonaMagz Template.

Mungkin template ini bisa bermanfaat dan menjadikan anda pengunjung setia blog Portal Informasi Online ini puas alias gak bosen. Template magazine ini dilengkapi dengan fitur, slider otomatis berdasarkan label yang diingikan, label image yang dapat menarik pengunjung,

ZonaMagz Template Berita Elegant

Instalasi Widget

  • Slider Header
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type='text/javascript'>
	function rpthumbnt(json)
	{
	document.write('<ul class="rp_plus_img">');
	for(var i=0;
	i<numposts;
	i++)
	{
	var entry=json.feed.entry[i];
	var posttitle=entry.title.$t;
	var posturl;
	if(i==json.feed.entry.length)break;
	for(var k=0;
	k<entry.link.length;
	k++)
	{
	if(entry.link[k].rel=='alternate')
	{
	posturl=entry.link[k].href;
	break
	}
	}
	var thumburl;
	try
	{
	thumburl=entry.media$thumbnail.url
	}
	catch(error)
	{
	s=entry.content.$t;
	a=s.indexOf("<img");
	b=s.indexOf("src=\"",a);
	c=s.indexOf("\"",b+5);
	d=s.substr(b+5,c-b-5);
	if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!=""))
	{
	thumburl=d
	}
	else thumburl='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9fgfGSL1T5EpCeBUDSGF80dThhFug02HXG0hkMPdXYN5ng-mQQ-UWkyKXCFku7IhJ-IB-8GSbo4n0EaHI0lInH1234M46w-rRTC0LC4UCMbhxuAI4UlNiHdJ0IRUEI3EMEa8FTG0f_69e/d/noimagethumb.gif'
	}
	document.write('<li class="news-title clearfix">');
	document.write('<a href="'+posturl+'" target="_blank"><img src="'+thumburl+'"/></a>');
	document.write('<a href="'+posturl+'" target ="_top">'+posttitle+'</a><br>');
	if("content"in entry)
	{
	var postcontent=entry.content.$t
	}
	else if("summary"in entry)
	{
	var postcontent=entry.summary.$t
	}
	else var postcontent="";
	var re=/<\S[^>]*>/g;
	postcontent=postcontent.replace(re,"");
	if(postcontent.length<numchars)
	{
	document.write('<span class="news-text">');
	document.write(postcontent);
	document.write('</span>')
	}
	else
	{
	document.write('<span class="news-text">');
	postcontent=postcontent.substring(0,numchars);
	var quoteEnd=postcontent.lastIndexOf(" ");
	postcontent=postcontent.substring(0,quoteEnd);
	document.write(postcontent+'...');
	document.write('</span>')
	}
	document.write('</li>')
	}
	document.write('</ul>')
	}
	function rpnewsticker()
	{
	last=$('ul#rp_plus_img li:last').hide().remove();
	$('ul#rp_plus_img').prepend(last);
	$('ul#rp_plus_img li:first').slideDown("slow")
	}
</script>
<script type="text/javascript">
	var speed = 1000;
	var pause = 3500;
	$(document).ready(function(){
	rpnewsticker();
	interval = setInterval(rpnewsticker, pause);
	});
</script>
<ul id="rp_plus_img"><script>
	var numposts = 10;
	var numchars = 100;
	</script> <script src="/feeds/posts/default/-/Technology?orderby=published&amp;alt=json-in-script&amp;callback=rpthumbnt"></script>
</ul>
Ganti kode bergaris bawah Technology dengan label anda
  • Slider Post
numposts1 = 5;
label1 = "Social Media";
Pada edit HTML cari kode diatas dan ganti Social Media dengan label anda
  • Game News
<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 = 70;
</script>
<script type="text/javascript" src="/feeds/posts/default/-/Game?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
Ganti kode bergaris bawah Game dengan label anda
  • Zona Design
<script language="JavaScript" src="http://feeds.feedburner.com/KangOnkDesign?format=sigpro&nItems=12&format=openLinks=new
&displayDate=true&displayExcerpts=true&displayTitle=false&excerptLength=25&dateLocation=below" type="text/javascript"></script>
Ganti kode bergaris bawah KangOnkDesign dengan nama FeedBurner anda
  • Entertainment News dan Sport News
<script type='text/javascript'>
	var numposts = 1;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/-/Entertainment?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
<script type="text/javascript">
	function recentpostslist(json) {
	document.write('<ul>');
	for (var i = 0; i < json.feed.entry.length; i++)
	{
	for (var j = 0; j < json.feed.entry[i].link.length; j++) {
	if (json.feed.entry[i].link[j].rel == 'alternate') {
	break;
	}
	}
	var entryUrl = "'" + json.feed.entry[i].link[j].href + "'";//bs
	var entryTitle = json.feed.entry[i].title.$t;
	var item = "<li>" + "<a href="+ entryUrl + '" target="_blank">' + entryTitle + "</a> </li>";
	document.write(item);
	}
	document.write('</ul>');
	}
</script>
<script src="http://zonamagz.blogspot.com/feeds/posts/summary/-/Entertainment?max-results=8&alt=json-in-script&callback=recentpostslist"></script>
<a href="http://zonamagz.blogspot.com/search/label/Entertainment" style="float:right;font:normal 10px Arial;padding:5px 0;">More Article &#187;</a>
Ganti kode bergaris bawah Entertainment dengan label anda
  • Feedburner Feature
Silkan kunjungi postingan disini untuk membuat gadget  seperti wordpress
  • Ads Sidebar
<a href="#"><img src="http://s3.buysellads.com/1261376/106032-1336544849.gif"/></a><br />
<a href="#"><img style="float:left; margin:5px 0px 0px 15px;" border="0" src="http://s3.buysellads.com/1253581/64466-1308069194.gif" /></a>
<a href="#"><img style="float:right; margin:5px 15px 0px 0px;" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVuWWKn8xC3V_s3GBxjymF4BgtqoRm6ylDQhniscc8TqMT-l7TSl6sUXQzVtZH5yFRoA6dmhyphenhyphenkdnCK5q6FJcDUzvVHCXvfk3uXbVeTX8w0vDrqTaKMhKcGs-5dbt4D9bppAhKFSm59_M24/s1600/ad2.jpg" /></a>
<a href="#"><img style="float:left; margin:10px 0px 5px 15px;" border="0" src="http://s3.buysellads.com/1260709/71777-1312827947.jpg" /></a>
<a href="#"><img style="float:right; margin:10px 15px 5px 0px;" border="0" src="http://www.jauhari.net/engine/wp-content/uploads/2011/02/125-here.png" /></a>
<a href="#"><img style="float:left; margin:10px 0px 5px 15px;" border="0" src="http://www.jauhari.net/engine/wp-content/uploads/2011/02/125-here.png" /></a>
<a href="#"><img style="float:right; margin:10px 15px 5px 0px;" border="0" src="http://www.jauhari.net/engine/wp-content/uploads/2011/02/125-here.png" /></a>
Ganti URL dan IMGAE diatas sesuai dengan keinginan kamu.

  • Random Post Feature
<script type="text/javascript">
    var randarray = new Array();var l=0;var flag;
    var numofpost=8;function randomposts(json){
    var total = parseInt(json.feed.openSearch$totalResults.$t,10);
    for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
    if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
    for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
    for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";
    document.write(item);}}
    }document.write('</ul>');}
</script>
<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

Pesan PIO

Mohon jangan dihilangkan atau diganti kredit link yang ada di bagian bawah template, terima kasihSatank MkrBerkomentar
Bagikan kepada teman!
Garis
300x250

1comments:

  1. gan saya mau hapus kode untuk slider diatas postingan dan di header yg ada di edit html, tpi sya gak tau letak kode dan seperti apa kode lengkapnya. mohon pencerahannya gan.

    ReplyDelete

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

NB: Jangan menuliskan link aktif karena akan terhapus secara otomatis.

 
TOP