BREAKING NEWS

Post Ads

Rabu, 19 Juni 2019

Cara Menciptakan Atau Mendesign Template Blog Sendiri

Hallo teman blog..
Pada kesempatan kali ini, akan membahas bagaimana cara Membuat / Mendesign template blog sendiri? niscaya ribet ya sobat!! sebenarnya template blog dengan platform Blogger sudah tersedia banyak sekali di internet. Kalau sobat tidak percaya, silahkan sobat searcing di google.

Sobat akan menemukan ribuan bahkan jutaan template blog yang tersedia dengan aneka macam variasi dan gratis. Adapun untuk yang versi premium, sobat harus mengeluarkan sedikit uang jajan sobat untuk membeli.

Sebelum kita membahas lebih dalam wacana cara menciptakan design template blog sendiri, saya ingin bercerita wacana saya sendiri.

Pada awal mengenal Blogger, saya juga hanya dapat memakai template blog buatan orang lain dan ketika ini pun saya masih memakai template mbak Arlina Design . Seiring berjalannya waktu, saya sangat bahagia melaksanakan modifikasi desain dan fitur template blog orang lain untuk memenuhi kriteria blog yang saya butuhkan.

Baiklah, tanpa basa kedaluwarsa lagi, kita eksklusif ke TKP.

Pertama-tama, sobat downlaod dulu software Notepad++, disinilah saya melaksanakan modifikasi template blog yang nantinya saya salin ke kolom edit html blogspot.

Pertama kita Membuat Struktur XML dan HTML....

Masukan aba-aba dibawah ini pada notepad++ ....


<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
</head>
<body>
</body>

</HTML>

Contoh, ibarat gambar dibawah ini:



Pada gambar diatas, saya memakai backround hitam, sobat dapat atur sendiri. Agar aba-aba yang kita masukan berwarna ibarat yang di atas, sobat harus save dulu dengan extation html.

Lanjut ke langkah selanjutnya, yakni manambahkan CSS..

Coba sobat letakkan CSS berikut pada bab head,,,


<b:skin><![CDATA[
body {background-color: #cab894;background-position: center center;}
a:link {font-family: 'PT Serif Caption', serif; font-size: 15px; color:#3094db;}
a:hover {color: #4d4544;}
a {color: #3094db;}
]]></b:skin>

Contoh ibarat gambar dibawah ini: 


Pada gambar diatas, CSS hanya disimpan di dalam memori head, belum ditampilkan. Untuk menampilkan suatu fungsi, maka fungsi tersebut harus dipanggil terlebih dahulu. Memanggil fungsi salah satunya dilakukan memakai tag b:section. 




Baik, kita lanjut lagi kelangkah selanjutnya yakni Memanggil Bagian Posting..

Contoh tag b:section untuk menampilkan bab posting sebagai berikut :

<b:section class='main' id='main'>
  <b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'></b:widget>
</b:section>

Sekarang masukkan tag b:section untuk postingan pada bab body.

Contoh sebagai berikut:



Setelah itu, semoga judul blog sobat muncul d tab browser, maka sobat harus menambahkan atau menyisipkan tag title berikut...

<title><data:blog.title/></title>

Masukkan tag title di atas ke bab head, Contoh gambar berikut ini :



Setelah itu, langkah awal menciptakan design template blog sobat sudah tamat tahap 5%.  Baik, kita coba ya...

Masuk ke akun blogspot sobat, kemudian klik tema - edit html - hapus semua aba-aba pada kolom edit html kemudian ganti dengan aba-aba yang sobat buat tadi di software notepad++ - kemuadian sobat save tema dan lihat balasannya pada view blog.

Berikut balasannya ibarat gambar dibawah ini:


Jika tampilannya ibarat gambar diatas, itu artinya sobat gres saja menuntaskan design template blog sendiri tahapan pertama 5% . Baiklah sobat, hingga disini, apakah sobat sudah siap untuk melanjutkan ke tahap selanjutnya?? Nantikan artikel selanjutnya wacana Cara design template sendiri versi ke 2 ya sobat.

Semoga artikel diatas dapat bermanfaat. Jangan lupa share artikel ini ke teman dan media umum sobat ya. Berbagi warta itu GRATIS.


Agar sobat tidak ketinggalan artikel terbaru dari , sobat dapat langganan artikel yang eksklusif di kirim ke email sobat.

Selamat mencoba..

Terima kasih.

Share this:

Posting Komentar

 
Back To Top
Copyright © 2014 Federico Blog. Shared by Themes24x7