Tampilkan postingan dengan label html. Tampilkan semua postingan
Tampilkan postingan dengan label html. Tampilkan semua postingan
Source Code Kalender CSS Dan Java Script

Source Code Kalender CSS Dan Java Script

10 Maret Comment
Kalander adalah benda yang sangat penting. Dengan kalander kita dapat mengetahui tanggal, bulan dan tahun, sehingga apapun kegiatan kita, hal-hal yang kita rencanakan, bisa dengan baik. Begitu pentingnya fungsi kalaner ini, dapat dipastikan setiap rumah pasti memasang kalander, baik itu kalander cetak, ataupun virtual atau digital seperti kalander pada desktop pc atau notebook. 

Bahkan di jam tangan, gadget, handphone, televisi dan perlatan elektronik bervisual pasti memiliki kalaner digital.  Begitu juga pada halaman web dapat ditambahkan aplikasi penggunan kalander.

Pada kali ini akan dijelaskan bagaimana Membuat Kalender Dasar Dengan CSS Pada Halaman Web

Kalender Dasar merupakan kalender yang sederhana dan elegan dengan menampilkan hari-hari pada tiap bulannya. Dengan menggunakan CSS akan memungkinkan untuk memudahkan  dalam merubah tampilan, mulai dari dimensi kalender, warna, sampai font yang digunakan.

Berikut ini Langkah-Langkah Membuat Kalender Dasar Dengan CSS sebagai berikut :

  • Buka terlebih dahulu notepad atau sublime text atau bisa juga menggunakan yang lain.
  • Selanjutnya Tinggal mengetikan kode seperti dibawah ini.

<html>
<title> Kalender Dasar </title>
<head>
<style type="text/css">
/* CSS untuk tabel kalender*/
.main {
width:200px;
border:1px solid black;
}
/* CSS untuk tabel bulan*/
.bulan {
background-color:black;
font:bold 12px verdana;
color:white;
}
/* CSS untuk tabel minggu*/
.minggu{
background-color:gray;
font:bold 12px verdana;
color:white;
}
/* CSS untuk tabel hari*/

.hari {
font-size: 12px;
font-family:verdana;
color:black;
background-color: lightyellow;
padding: 2px;
}
/* CSS untuk tabel hari ini*/
.hari #today{
font-weight: bold;
color: red;
}
</style>
<script type="text/javascript" src="kalenderdasar.js"></script>
</head>
<body>

<script type="text/javascript">
// mendeklarasikan tanggal dan hari
var tanggalhariini=new Date()
//untuk mendapatkan bulan(1-12)
var bulan1=tanggalhariini.getMonth()+1
//menunjukkan tahun
var tahun1=tanggalhariini.getFullYear()
document.write(membuatKalender(bulan1 ,tahun1, "main", "bulan", "minggu", "hari", 1));
</script>

</body>
</html>

  • Simpan dengan nama sebagai contoh "kalender_dasar" dan simpan pada directory xampp/htdocs/kalender buat terlebih dahulu folder "kalender" pada directory htdocs dan hasilnya seperti pada gambar dibawah ini seperti.



Langkah selanjutnya adalah membuat Javascript untuk kalenderdasar.js pada script diatas. Langsung saja buat File-New pada notepad dan ketikan kode javascript dibawah ini dan berikan nama "kalenderdasar.js" 

function membuatKalender(bulan, tahun, bulan2, bulan1, hari1, hari, border){
var namabulan=['Januari','Februari','Maret','April','Mei','Juni','Juli','Agustus','September','Oktober','November','Desember'];
var angkatanggal=[31,0,31,30,31,30,31,31,30,31,30,31];
var mengkonfigurasiKalender = new Date(tahun, bulan-1, 1);
mengkonfigurasiKalender.od=mengkonfigurasiKalender.getDay()+1;
var tanggalhariini=new Date()
var tanggal=(tahun==tanggalhariini.getFullYear() && bulan==tanggalhariini.getMonth()+1)? tanggalhariini.getDate() : 0

angkatanggal[1]=(((mengkonfigurasiKalender.getFullYear()%100!=0)&&(mengkonfigurasiKalender.getFullYear()%4==0))||(mengkonfigurasiKalender.getFullYear()%400==0))?29:28;

var t='<div class="'+bulan2+'"><table class="'+bulan2+'" cols="7" cellpadding="0" border="'+border+'" cellspacing="0"><tr align="center">';
t+='<td colspan="7" align="center" class="'+bulan1+'">'+namabulan[bulan-1]+' - '+tahun+'</td></tr><tr align="center">';
for(s=0;s<7;s++)t+='<td class="'+hari1+'">'+"MSSRKJS".substr(s,1)+'</td>';
t+='</tr><tr align="center">';
for(i=1;i<=42;i++){
var x=((i-mengkonfigurasiKalender.od>=0)&&(i-mengkonfigurasiKalender.od<angkatanggal[bulan-1]))? i-mengkonfigurasiKalender.od+1 : '&nbsp;';

if (x==tanggal)

x='<span id="today">'+x+'</span>'
t+='<td class="'+hari+'">'+x+'</td>';
if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">';
}
return t+='</tr></table></div>';
}


Setelah itu jalankan perintah untuk memanggil program kalender_dasar.html yang barusan dibuat, dan hasilnya adalah sebagai berikut :

Untuk informasi lebih lanjut dapat dilihat pada bagian video dibawah ini :



Demikianlah sedikit informasi yang dapat saya bagikan tentang Membuat Kalender Dasar Dengan CSS Pada Halaman Web semoga informasi diatas dapat berguna dan bermanfaat bagi kita semua, sekian dan terimakasih.


Apasih Kegunaan Webmaster Tool Untuk Blog ?

Apasih Kegunaan Webmaster Tool Untuk Blog ?

07 Maret Comment
Google Webmaster adalah tools gratis yang diberikan Google untuk para webmaster. Para webmaster dapat melakukan evaluasi terhadap variabel-variabel pencarian yang melibatkan keyword yang digunakan pencarian informasi melalui Google untuk menemukan website anda.

Google Webmaster tools dibuat khsusus untuk kebutuhan analisis dari search engine Google. Semua data statistik yang ditampailkan datanya dari search engine Google. Data-data kunjungan dari sumber lainnya. Misalnya social network, search engine lain, atau sumber lainya tidak masuk ke dalam data statistic.

Manfaat Google Webmaster Tool Bagi Blog.Seperti yang sudah dijelaskan bahwa ini adalah sebuat tools, sebuah alat yang bias digunakan oleh webmaster secara gratis untuk memperbaiki hasil pencarian di dalam Google. Google Webmaster berisi data hasil pencarian yang berkaitan dengan website anda, sehingga Webmaster bias mengetahui keyword apa saja yang masuk ke dalam hasil pencarian dan penempatan website di dalam hasil pencarian.

Dengan menggunakan Google Webmaster Tools, webmaster bias melakukan perbaikan-perbaikan, sehingga website bias tampil lebih baik di dalam hasil dari pencarian. Saya sendiri secara pribadi lebih suka menggunakan Google Webmaster dari pada Google Analytics karena lebih sederhana dan lebih tertarget dengan  SEO.

Mengintegrasikan Website dengan Google Webmaster Tool

Untuk mengintegrasikan Google Webmaster ke dalam website, sangat mudah. Silahkan masuk ke dalam website resmi yaitu Google Webmaster Tool dan daftarkan website anda tersebut perlu diketahui dibutuhkan akun gmail untuk dapat terdaftar
  • Buka alamat link ini https://www.google.com/webmasters
  • Selanjutnya Login
  • Langkah selanjutnya adalah kita tinggal memasukan alamat URL Blog Anda dan lakukan verifikasi kepemilikan situs.
  • Verifikasi dengan meta tag adalah Anda memasang meta tag yang diberikan ke dalam website.
  • Verifkasi  lewat file HTML adalah Anda men-dowbkiad file HTML yang diberikan, kemudian meng-upload ke root hosting Anda.
  • Setlah melakukan verifikasi, maka tunggu beberapa hari. Webmaster Tool akan memulai hasil kunjungan ke website Anda.
  • Pastikan Anda terus meng-update website dengan artikel-artikel dan koten-konten untuk kebutughan SEO agar trafik dari website anda terus mengalami peninggkatan yang signifikan.
Demikian sedikit informasi yang saya dapat sampaikan tentang Penegertian dan Kegunaan Webmaster Tool Bagi Blog semoga informasi diatas dapat berguna dan bermanfaat untuk kita semua, sekian dan terimakasih.