Djarum Black: April 2012

Kamis, 19 April 2012

Membuat Halaman 123 / Page Number Navigation Berurut di Blogspot

Baru beberapa hari lalu saya menemukan artikel yang benar-benar saya cari.
Adalah bagaimana cara membuat halaman berurut 123 /page 123 navigation untuk blog di blogger/blogspot.

Kode membuat halaman 123 di blogspot ini,saya dapat dari hasil karya besar Eko di eko tips n trick
Anda bisa mengunjungi website dan tutorial 123 page navigation ini di situsnya langsung dalam tutorialnya 'Membuat Navigasi Page Number Blogspot.

Untuk hasilnya akan seperti gambar dibawah ini:

membuat navigasi page angka/number 123 berurut blogger.

Bagaimana? Ingin membuatnya?

Langkah Cara Membuat Page Navigasi Angka / Number 123dst pada Blog.

Pertama,pergilah ke dashboard blogger anda,selanjutnya,pilih tata letak,dan pilih edit html.
Seperti biasa,contreng option expand widget templates,selanjutnya cari kode berikut:

]]></b:skin>

Setelah ketemu,letakkan persis diatasnya kode css dibawah ini:

.showpageArea a {

text-decoration:underline;

}

.showpageNum a {

text-decoration:none;

border: 1px solid #cccccc;

margin:0 3px;

padding:3px;

}

.showpageNum a:hover {

border: 1px solid #cccccc;

background-color:#cccccc;

}

.showpagePoint {

color:#333;

text-decoration:none;

border: 1px solid #cccccc;

background: #cccccc;

margin:0 3px;

padding:3px;

}

.showpageOf {

text-decoration:none;

padding:3px;

margin: 0 3px 0 0;

}

.showpage a {

text-decoration:none;

border: 1px solid #cccccc;

padding:3px;

}

.showpage a:hover {

text-decoration:none;

}

.showpageNum a:link,.showpage a:link {

text-decoration:none;

color:#333333;

}

Lalu,cari lagi kode seperti ini:

</body>

Jika sudah ketemu,tepat diatasnya letakkan script dibawah ini:

<b:if cond='data:blog.pageType != &quot;item&quot;'>

<script type='text/javascript'>

var pageCount=5;

var displayPageNum=5;

var upPageWord =&#39;Previous&#39;;

var downPageWord =&#39;Next&#39;;

</script>

<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>

</b:if>

Langkah terakhir,carilah kode berikut:

'data:label.url'

Jika sudah ketemu, ganti kode tersebut dengan kode berikut:

'data:label.url + "?&max-results=5"'

Sekarang,simpan templates anda,dan anda bisa lihat hasilnya sekarang :D

Mengenal Kode HTML

HTML adalah Hypertext Markup Language, yaitu sebuah bahasa representasi untuk halaman website. Pertama kali dikembangkan di CERN yaitu sebuah laboratorium fisika partikel yang berlokasi di Swiss.

HTML memiliki kelebihan yang mendasar yang tidak dimiliki oleh bahasa pemrograman biasa yaitu, adanya hypertext, yaitu link yang dapat menghubungkan antara dokumen satu dengan lainnya.
Justru dengan adanya perbedaan fungsi antara HTML dengan bahasa pemrograman maka keduanya dapat digabungkan untuk membuat situs web yang bagus.

Mengapa kita perlu mengenal HTML ?

Mengenal dan mengetahui kode HTML adalah salah satu usaha agar kita bisa memaksimalkan tampilan website/blog yang kita kelola. Karena, hampir semua dokumen web dibuat dengan kode-kode HTML. Adapun tag-tag yang sering muncul dalam dokumen berekstensi *htm atau *html, yang sering muncul terutama banyak digunakan dalam pembuatan template blog/website adalah sebagai berikut :

<html> …… </html>

Sebuah file HTML selalu harus ada dalam pasangan tag di atas. Informasi dalam file HTML ini dibagi dalam dua bagian yaitu :

Header(<head> …</head> yang menyimpan informasi administratif, dan
Body (<body> …</body>) di mana terdapat informasi dokumen yang akan ditampilkan.

Struktur umum dari file HTML adalah seperti di bawah :

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html>
<head>
<title>Judul HTML</title>
</head>
<body>
<p>Ini adalah body<br>
</p>
</body>
</html>
Lebih jelasnya, coba buka template blog anda kemudian download template-nya. Lalu paste-kan di notepad. Anda akan mendapati tag html seperti yang diatas tertera pada template blog anda.

Tag lain yang umum dipakai dalam sebuah halaman web untuk menciptakan sebuah halaman yang lebih hidup adalah tag-tag yang masuk dalam format tampilan. Di bawah ini adalah contoh tag html dan fungsinya :

<b> …</b> adalah tag yang digunakan untuk membuat huruf tebal.
<u> … </u> adalah tag yang digunakan untuk membuat garis bawah.
<i> … </i> adalah tag yang digunakan untuk membuat huruf miring
<blink> … </blink> adalah tag yang digunakan untuk mengatur tulisan agar berkedip
<marquee> … </marquee> adalah tag yang digunakan untuk mengatur sebuah tulisan yang berjalan
<table> … </table> adalah tag yang digunakan untuk membuat tabel. Namun untuk penggunaannya, ia harus di dukung tag atribut lain agar bisa menampilkan sebuah kotak. Diantara tag atribut yang melekat dalam tag <table> adalah : <tr> … </tr> yang fungsinya untuk menampilkan baris dalam tabel. Dan, <td> … </td> adalah untuk menampilkan kolom dalam tabel.
<p> adalah tag untuk memisahkan paragraf
<hr> adalah tag untuk membuat garis pemisah.
<center> …</center> tag untuk membuat rata tengah.

Untuk saat ini itu dulu, kita akan lanjutkan di posting-posting berikutnya.

Sumber:
http://lulukmarjan.wordpress.com/2012/03/27/mengenal-kode-html/

Kode HTML

01<!-- --> Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner ini tidak akan terlihat pada browser

02<a href> Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut

03<a name> Membuat nama bagian yang didefinisikan pada link pada halaman yang sama

04<applet> Sebagai awal dari Java applets<!--more-->

05<area> Mendefinisikan daerah yang dapat diklik (link) pada image map

06<b> Membuat teks tebal

07<basefont> Membuat atribut teks default seperti jenis, ukuran dan warna font

08<bgsound> Memberi (suara latar) background sound pada halaman web

09<big> Memperbesar ukuran teks sebesar satu point dari defaultnya

10<blink> Membuat teks berkedip

11<body> Tag awal untuk melakukan berbagai pengaturan terhadap text, warna link & visited link

12<br> Pindah baris

13<caption> Membuat caption pada tabel

14<center> Untuk perataan tengah terhadap teks atau gambar

15<comment> Meletakkan komentar pada halaman web tidak tidak akan nampak pada browser

16<dd> Indents teks

17<div> Represents different sections of text.

18 Menambahkan sound or file avi ke halaman web

19<fn> Seperti tag <a name>

20<font> Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks

21Mendefinisikan input form

22<frame> Mendefinisikan frame

23<frameset>; Mendefinisikan attribut halaman yang akan menggunakan frame

24<h1> ... <h6> Ukuran font

25<head> Mendefinisikan head document.

26<hr> Membuat garis horizontal

27<html> Bararti dokumen html

28<i> Membuat teks miring

29<img> Image, imagemap atau an animation

30<input> Mendefinisikan input field pada form

31<li>
 Membuat bullet point atau baris baru pada list (berpasangan dengan tag 
<dir>, <menu>, <ol> and <ul> )

32<map> Mendefinisikan client-side map

33<marquee> Membuat scrolling teks (teks berjalan) - hanya pada MS IE

34<nobr> Mencegah ganti baris pada teks atau images

35<noframes> Jika browser user tidak mendukung frame

36<ol> Mendefinisikan awal dan akhir list

37<p> Ganti paragraf

38<pre> Membuat teks dengan ukuran huruf yg sama

39<script> Mendefinisikan awal script

40<table> Membuat tabel

41<td> Kolom pada tabel

42<title> Mendefinisikan title

43<tr> Baris pada tabel

44<u> Membuat teks bergaris bawah

 Sumber:

     http://irfanwineers.wordpress.com/2012/03/08/beberapa-kode-tag-html-beserta-fungsinya/

Kode Kode HTML

Dalam HTML seperti pemformatan text berupa tebal,miring,garis bawah,membuat tabel,dll,dapat di lakukan dengan kode-kode.Bagi anda yang belum begitu mengerti HTML,bisa baca disini
Di bawah ini ada beberapa kode-kode untuk mewakili pemformatan text maupun mebuat berbagai object dalam halaman anda,meskipun sekarang sudah banyak pembuatan halaman HTML dengan software instant seperti Dreamweaver dll.

Membuat Center,gunakan kode : <p align="center">Belajar</p> hasilnya seperti:

Belajar

Membuat Posisi kekanan gunakan kode : <p align="right">Belajar</p> hasilnya seperti :

Belajar

Membuat Posisi kekiri gunakan kode: <p align="left">Belajar</p> hasilnya seperti :

Belajar

Membuat Huruf Tebal gunakan kode: <b>Belajar</b> hasilnya seperti :
Belajar

Membuat Huruf Garis Bawah gunakan kode : <u>Belajar</u> hasilnya seperti :
Belajar

Membuat Huruf bercetak Miring gunakan kode : <i>Belajar</i> hasilnya seperti :
Belajar

Membuat Kombinasi huruf tebal,miring,garisbawah,gunakan kode :
<b><i><u>Belajar</u></i></b> hasilnya seperti :
Belajar

Membuat Huruf tebal strong gunakan kode : <srong>Belajar</strong> hasilnya seperti :
Belajar

Membuat Huruf Hidden gunakan kode : <span style="visibility: hidden">Belajar</span> hasilnya seperti :

Namanya juga hidden..ya..ga keliatan..

Membuat Huruf Besar semua (uppercase) gunakan kode :
<span style="text-transform: uppercase">Belajar</span> hasilnya seperti :
Belajar

Membuat Huruf Small caps gunakan kode:
<span style="font-variant: small-caps">Belajar</span> hasilnya seperti ini:
Belajar

Membuat Huruf Subscribe / kecil di bawah gunakan kode:
<p>4<sub>2</sub></p>hasilnya seperti ini:
4₂

Membuat Huruf Superscribe / pangkat gunakan kode:
<p>4<sup>2</sup></p> hasilnya seperti ini:
4²

Membuat Huruf bergaris atas gunakan kode:
<span style="text-decoration: overline">Belajar</span> hasilnya seperti ini:
Belajar mengganti huruf

Membuat Huruf bergaris tengah gunakan kode:
<strike>Belajar</strike> hasilnya seperti ini:
~~Belajar~~

Menentukan jenis huruf gunakan kode:
<p><font-family="Arial" >Belajar</font></p> hasilnya seperti ini:
Belajar

Menentukan ukuran huruf gunakan kode:
<p><font-size="3" >Belajar</font></p> hasilnya seperti ini:
Belajar

Menentukan warna huruf gunakan kode:
<p style="color: green; >Belajar</p> hasilnya seperti ini:
Belajar

Membuat bullet dot bolong gunakan kode:
<ul type="circle">
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul>
hasilnya seperti ini:

DOT 1
DOT 2
DOT 3

Membuat bullet dot kotak gunakan kode:
<ul type="square">
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul>
hasilnya seperti ini:

DOT 1
DOT 2
DOT 3

Membuat bullet dot bulat gunakan kode:
<ul>
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul>
hasilnya seperti ini:

DOT 1
DOT 2
DOT 3

Mengatur posisi bullet gunakan kode:
<blockquote>
<blockquote>
<blockquote>
<ul>
<li>DOT 1</li>
<li>DOT 2</li>
<li>DOT 3</li>
</ul>
</blockquote>
</blockquote>
</blockquote>
hasilnya seperti ini:

DOT 1

DOT 2

DOT 3

Menentukan kombinasi warna,jenis,dan ukuran huruf gunakan kode:
<p><font style="color: red; font-family: courier new; font-size: 15px;" >Belajar</font></p>
hasilnya seperti ini:

Belajar

Membuat tabel border solid gunakan kode:

hasilnya seperti :

Text

Membuat tabel border dot gunakan kode:
<table border="1" width="200"
style="border-style: dotted">
<tr>
<td border="2" style="border-style:
dotted">Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat tabel border dashed gunakan kode:
<table border="1" width="200" style="border-style: dashed">
<tr>
<td style="border-style: dashed">Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat tabel border groove gunakan kode:
<table border="1" width="200" style="border-style: groove">
<tr>
<td>Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat tabel border Ridge gunakan kode:
<table border="1" width="200" style="border-style: ridge">
<tr>
<td>Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat tabel border Insert gunakan kode:
<table border="1" width="200" style="border-style: inset">
<tr>
<td>Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat tabel border Outset gunakan kode:
<table border="1" width="200" style="border-style: outset">
<tr>
<td>Text</td>
</tr>
</table>
hasilnya seperti ini:

Text

Membuat Tabel Biasa gunakan kode :
<table border="1"width="200"><td>Text</td></table>
hasilnya seperti:

Text

Membuat Tabel berwarna gunakan kode :
<table border="1"width="200"bgcolor="green"><td>Text</td></tabel> hasilnya seperti :

Text

Membuat Tabel berwarna tak berbingkai gunakan kode :
<table border="0"width="200"bgcolor="blue"><td>Text</td></tabel> hasilnya seperti:

Text

Untuk kode-kode HTML yang lain anda bisa mengulik lewat software-software web designer atau situs-situs penyedia layanan HTML.

Minggu, 08 April 2012

Wujud pasir setelah diperbesar 110x !!

Pasir adalah sebuah bentuk seni itu sendiri. pasir tampaknya seperti segerombolan batu kecil berwarna coklat, mungkin dibumbui dengan hancuran kulit kerang. Tapi pasir memiliki cerita jauh lebih menarik untuk diceritakan.

Terdiri dari sisa-sisa ledakan gunung berapi, mengikis pegunungan, organisme mati, dan bahkan struktur buatan, pasir dapat mengungkap sejarah-baik biologi dan geologi-lingkungan lokal. Seorang ilmuwan Gary Greenberg meneliti pasir lebih dalam, ternyata pasir dapat mengungkapkan warna yg spektakuler dari segi bentuk maupun tekturnya.

Berikut ini photo2 pasir dalam bentuk 3D oleh Greenberg dgn menggunakan Mikroskop Edge 3D (pembesaran 110x), kumpulan butiran pasir dari belahan dunia.