Jumat, 13 Maret 2015

Tutorial Membuat Tanggal Permanen dan Top Navigasi

Tanggal dan top navigasi
Kembali berjumpa para blogger, hari ini saya akan membagi cara-cara membuat tanggal permanen dan menu navigasi di atas header.

Dalam pembuatan tutorial ini terutama menu navigasi saya sedikit menggabungkan dengan tutorial dari blognya kang Adhy Suryadi yaitu Translate yang bisa membuat blog anda semua di terjemahkan dalam bahasa inggris.

Baik langsung saja ini langkah-langkahnya :

1. Login ke akun blogger sahabat.

2. Pilih opsi lainnya dan klik template

3. Klik edit template.

4. Cari kode ini (Ctrl+f) ]]></b:skin>

5. Copy dan letakan kode ini di atasnya :

.toppic{width:100%;margin:0 auto;border-bottom:0px solid #666;}

.topnav{background:#ffffff;width: 960px;height:32px;overflow: hidden;margin:0 auto; padding:10px 10px 0px 10px; }

.toppic{background:#ffffff;width:980px;margin:0 auto;border-bottom:1px solid #999;}

.topnav{width: 960px;height:20px;overflow: hidden;margin:0 auto; padding:0px 0px 10px 10px; }

.menupic{background:#fff;width:960px;margin:0 auto;}



6. Kemudian cari kode <body> atau <body atau biasanya ada yang lebih panjangnya lagi seperti ini <body expr:class='&quot;loading&quot; + data:blog.mobileClass'>.

7. Copy dan letakan kode ini di bawahnya :

<div class='toppic'>
<div class='topnav'>
<div style='font: 15px Arial;float:left;padding-top:3px;letter-spacing:.01em;color:#000000;'>
<script type='text/javascript'> 
 now = new Date(); 
 if (now.getTimezoneOffset() == 0) (a=now.getTime() + (7*60*60*1000)) 
 else (a=now.getTime()); 
 now.setTime(a); 
 var tahun=now.getFullYear() 
 var hari=now.getDay() 
 var bulan=now.getMonth()
 var tanggal=now.getDate()
 var hariarray=new Array
(&quot;Minggu&quot;
,&quot;Senin&quot;
,&quot;Selasa&quot;
,&quot;Rabu&quot;
,&quot;Kamis&quot;
,&quot;Jum&#39;
at&quot;
,&quot;Sabtu&quot;)
 var bulanarray=new Array
(&quot;Januari&quot;
,&quot;Februari&quot;
,&quot;Maret&quot;
,&quot;April&quot;
,&quot;Mei&quot;
,&quot;Juni&quot;
,&quot;Juli&quot;
,&quot;Agustus&quot;
,&quot;September&quot;
,&quot;Oktober&quot;
,&quot;November&quot;
,&quot;Desember&quot;)
document.write(hariarray[hari]+&quot;
&quot;+tanggal+&quot;
&quot;+bulanarray[bulan]+&quot; &quot;+tahun)
</script> </div> 
<div style='font: 15px Arial;
float:right;padding-top:3px;
letter-spacing:.01em;
color:#000000;'>
<a href='http://mohammad.rachmat-sopiandi.com' target='_blank' title='Beranda'>Beranda</a> | 
<a href='http://mohammad.rachmat-sopiandi.com/p/kontak-saya.html' target='_blank' title='Kontak'>Kontak</a> |
 <a href='http://mohammad.rachmat-sopiandi.com/p/daftar-isi.html' title='Daftar Isi'>Daftar Isi</a> | 
<a href='http://alquran.rachmat-sopiandi.com/' target='_blank' title='Al Qur&apos;an Online'>Al Qur&#39;an Online</a> |
<a class='trigger2' href='#' onclick='window.open
(&apos;http://translate.google.com/translate?u=&apos;+encodeURIComponent(location.href)+&apos;
&amp;amp;langpair=id%7cen&amp;amp;hl=en&apos;);
return false;
' rel='nofollow' target='_blank' title='English'>Translate</a>
</div>
</div>
</div>

Catatan :
  • Yang di kasih warna merah adalah url link sahabat yang mau dituju.
  • Yang di kasih warna kuning adalah nama url yang bisa dinamai sesukanya.
8. Kemudian Klik simpan template dan selesai

Demikian tutorial kali ini semoga bermanfaat.



Load disqus comments

0 komentar