The Incredibles

Cara Pembuat Template Blogspot

noreply@blogger.com (BursaMotor) — Tue, 15 Sep 2009 13:54:00 +0000

THE INCREDIBLES-Posting kali ini kita akan membahas cara pembuat template blogspot. Blogspot merupakan layanan yang sepenuhnya gratis untuk pengguna dari Google, bisa diubah tampilannya, bisa membuat banyak blog, membuat email, dan perangkat google lainnya dengan satu account. Template blogspot dapat kita ubah, sesuai dengan desain. Syaratnya, kita harus bisa membuat sebuah desain berbais xhtml css. Kemudian barus dipadukan dengan script blogspot yang xml.

Untuk merubah tampilan blogspot, kita harus tahu bagian-bagian script blogspot.
Ini adalah susunan dasar html:

[html]

[header]

[title]..... [/title]

[/header]

[body][/body]

[/html]

Ada dua bagian penting:
- header berisi elemen meta, style css, dan script

- body berisi layout dan isinya

untuk membuat template dasar, buat dulu desainnya. kalau sudah jadi rubahlah atau ganti elemen-elemen sbb:
yang di dalam head, style css. Copy paste saja style css dalam

[b:skin] lt;![cdata[ ......

isi css

......

]]></b:skin>

Sekarang masuk ke body:
Copy paste script desain yang sudah anda buat. Jangan lupa rubah dan tambahkan dengan elemen blogspot:

contoh:

script aseli:

<div id="content">

<div class="post">

</div>

</div>

Rubahlah dan tambahlah dengan elemen blogspot:

<div id="content">

<b:section class="post" id="post1" />

</div>

Kita sudah mempunyai eleemen dasar untuk blogspot. Klau mau menambah isi widget lama ke desain yang baru tinggal tambahkan kedalam section:

<b:section clas="post">

<b:widget id="" .......

</b:section>

Modifikasi Template Anda

noreply@blogger.com (BursaMotor) — Tue, 15 Sep 2009 13:39:00 +0000

THE INCREDIBLES-Anda bebas memilih dari sekian banyak template untuk blog Anda; pilih saja satu yang paling tepat dengan kebutuhan Anda. Selain itu, Anda bebas mengutak-atik desain blog dengan memanfaatkan antarmuka intuitif di mana elemen bebas diseret-dan-dijatuhkan ke manapun. Anda juga dapat menambah gadget keren seperti penayang slide, jajak pendapat, atau bahkan iklan AdSense. Mengubah font dan warna pada blog Anda juga mudah. Jika Anda ingin lebih mengontrol tata letak blog Anda, Anda juga dapat menggunakan fitur Edit HTML.

Modifikasi Kolom Template Blogger

noreply@blogger.com (BursaMotor) — Tue, 15 Sep 2009 13:17:00 +0000

THE INCREDIBLES-Posting kali ini kita akan membahas tentang modifikasi template minima blogger yang kolom sidebarnya di kanan, minima right sidebar. Tamplate minima hanya mempunyai dua kolom, di kiri atau di kanan, dengan lebar kolom 220px.

Langsung saja, dengan menambah satu buah kolom / sidebar dengan lebar 160px.

Pertama:

Buka layout --> edit html --> back up dulu script aseli blog anda.

Buatlah style css (tentu di antara [c: data ....

buat properties berikut:

#sidebar1-wrapper

{ width:160px;

float:$startSide;

margin-$startSide:10px;

word-wrap:break-word;

overflow:hidden;

}

-Keterangan: $startside nama elemen untu kiri/ left.

- word-wrap:break-word :> untuk memecah kata yang terlalu panjang (IE) sehingga tidak menggeser lebar sidebar.

-overflow:hidden:> menyembunyikan kata yang melebihi lebar sidebar (Firefox).

Selesai membuat calon sidebar.

Dengan membuat satu sidebar maka kita harus menambah ukuran lebar untuk outer-wrapper dan header-wrapper. Berapa px lebarnya? Kita sudah membuat calon kolom dengan lebar 160px di tambah margin kiri: 10px, jadi space buat kolom baru: 170px.

ini yang harus diubah:

cari: #header-wrapper { width:660px; }

lebar semula --width:660px, ganti menjadi 660 + 170 = 830px;

cari: #outer-wrapper :> sama dengan di atas.

Selesai membuat CSS nya. sekarang kita pasang pada HTML-nya.

setelah #main-wrapper dan sebelum #sidebar-wrapper tuliskan yang sudah kita buat tadi.

<div id='sidebar1-wrapper'>

<b:section class='sidebar' id='sidebar1' />

</div>

untuk memasang widget secara manual, tinggal paste code dari template sebelumnya [b:widget .... ubah susunan section menjadi:

[b:section clas="" ...]

[b:widget ......../]

[/b:section]

SELESAI. Lihat pada Page elemen. Tambahkan elemen halaman yang anda mau.