QUOTE
Yang umum diyakini, membuat blog itu susah.
Apalagi menjadikannya untuk mencari uang di internet.
Tapi ketahuilah, itu hanya mitos!
Temukan inspirasi dan semangat baru di sini
terbaru

Cara Membuat Elemen Outer Wrapper Template Blog

: Sabtu, Juni 25, 2016

Cara Membuat Elemen Outer Wrapper Template Blog

Sebelumnya silahkan anda baca dulu Struktur Lengkap Template Blog untuk memahami posisi dan fungsi dari elemen Outer Wrapper ini. Setelah itu baru kembali lagi kesini dan mengikuti tutorial cara membuatnya di bawah ini.

Jika sudah, sekarang silahkan login ke dasbor Blogger anda. Setelah dasbor terbuka, lihat pada panel menu sebelah kiri. Nanti akan tampak tampilan seperti ini:

Cara Membuat Elemen Main Postingan pada Template Blog

Lalu kliklah pada bagian Template, sehingga terbuka tampilan seperti ini:



Cara Membuat Elemen Main Postingan pada Template Blog

Lalu sekarang klik pada tombol Edit HTML (sebelumnya jangan lupa, untuk berjaga-jaga backup dulu template blog anda sebelum dilanjutkan).

Cara Membuat Elemen Main Postingan pada Template Blog

Nah itulah semua kode yang terdapat pada template blog anda, sesuai template yang anda gunakan sebelumnya. Kode tersebut jumlahnya sangat banyak. Baik kode pemrograman HTML, JavaScript, PHP maupun CSS. Tapi jika anda membuat template sendiri dari awal, maka kode yang akan anda temukan tidak sebanyak itu. Tapi hanya beberapa kode dasar saja seperti template blank.

Jika template anda masih bawaan Blogger, maka tidak perlu lagi anda membuat elemen Header. Karena elemen tersebut sudah ada. Tapi jika anda membuat template sendiri dari awal, maka baru perlu anda melanjutkan panduan ini untuk membuar elemen Outer wrapper pada template. Caranya?

Anda hanya memerlukan sepasang kode sederhana ini:

<div id='outer-wrapper></div>

Yang perlu anda waspadai adalah cara menyisipkannya kedalam template blog anda. Pastikan sepotong tag pembukanya anda letakann tepat dibawah tag <body> pembuka. Dan tag penutupnya tepat diatas tag </body> penutup. Bagan lengkapnya adalah seperti ini:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML>
<head>
<b:skin><![CDATA[]]></b:skin>
<style type='text/css'></style>
</head>
<body>
<div id='outer-wrapper'>
<b:section class='main' id='main'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'></b:widget>
</b:section>
</div>
</body>
</HTML>


Kalau pada form Edit HTML template, akan tampak seperti di bawah ini:

Cara Membuat Elemen Outer Wrapper Template Blog

Yang perlu anda ingat, tag outer ini berada pada bagian paling luar di dalam area body template. Jadi kalau ada sudah ada kode lain sebelumnya, maka tag outer, tetap berada di bagian paling luar dari kode tersebut. Tapi tidak keluar dari area body (lihat panduan: Skema HTML template Blogger)

Jika sudah benar penulisan dan posisinya, maka kliklah tombol Simpan template. Nah setelah ini baru anda lanjutkan dengan menambahkan elemen Header, Sidebar dan Footer blog.

Komentar yang tidak relevan, jorok, spamming dan promosi link akan dihapus

Copyrights @ blogernas ■ Desember 2015 - Erianto Anas