Kembali ke masalah template . Di awal saya gabung di blogger itu sebenarnya karena saya tertarik untuk mendesain website , dimulai dengan belajar mendesain blog . Dan sebagai newbie tulen tentu hal yang dilakukan pertama kali adalah mencari tempalte dan mulai mencari tutorial tutorial dari para master untuk mengedit beberapa bagiannya , ya semua itu biar lebih keren mungkin . Dan faktanya saya banyak sekali melakukan banyak sekali kesalahan .
Setiap kali nemu tutor saya coba , dan selalu error .Semakin sering dapet dan praktekin tutorial semakin banyak juga errornya . Ya semua itu karena saya sama sekali gak tau bagian bagian pada template .
Seiring berjalannya waktu barulah saya mulai mengenal apa itu Css , HTML , JavaScript , jQuery dan Php . Dan anehnya hingga setahun ini saya baru ngerti sama Css dan HTML . Dan itu membuat saya jadi Cloner beberapa waktu kemarin haha . Malah sesat endingnya .
Soal Template Editing
Saya pikir kesalahan mengedit template yang saya alami itu tidak mutlak dialami oleh saya sendiri . Semua blogger baru pasti pernah mengalaminya , terbukti banyak sekali pertanyaan pada setiap komentar di penyedia tutorial . Dan begitupun yang dialami beberapa teman saya yang akhirnya berhenti ngeblog karena saking bingungnya sama urusan Script .
Script
Script template dan pengkodean inilah yang membuat saya bertahan dan terus berjuang ngeblog hinga saat ini . Karena itu begitu menarik buat saya . Dan saya sampai akhirnya berhenti nggambar karena menekuni dunia blogging ini yang penuh dengan script .
Banyak orang yang akhirnya berhenti ngeblog gara gara stuck dibagian script yang membingungkan . Jika gak paham dan gak mau mahamin .
Yah setidaknya saya sekarang ini sudah mulai paham tentang Css dan HTML , meskipun belum paham dengan JavaScript , mungkin kedepannya bakal memperdalam itu . Dengan pengetahuan yagn baru sekedar itu tapi saya malah yakin bisa bikin template sendiri . haha gaya , cuman masih malas karena gak punya program dan juga gakpunya banyak waktu . meskipun pada awalnya memang saya minat untuk mendesain .
Mengenai Struktur Template
Sejauh ini sudah ada beberapa orang yang minta bantuan saya memecahkan masalah dalam kesalahan template dan secara kebetulan mungkin saya berhasil mengatasi Error itu .
Cara yang saya gunakan sebenarnya cara yang penuh dengan eksperimental dengan dasar anggapan bahwa saya gak bakal mati atau cedera gara-gara template rusak . Toh masih ada template original yang bisa di upload ulang .
Secara simpel mengenai Struktur Template saya menggolongkan beberapa bagian utama dan sub yang menyusun tempalte menjadi halaman Blog .
Bagian Bagian template yang saya pahami :
- body
- header
- main-wrapper
- wrapper-inner
- casing
- content
- sidebar
- footer
Setiap template itu berbeda penamaan setiap elementnya tergantung dari Mood para pembuat template ( mungkin ) . Tapi aslinya sama saja .
Itu bagian paling mendasar menurut saya , entahlah gimana menurut para master template .
Saya jabarkan sedikit untuk para newbie mengenai bagian bagian diatas .
BODY
Body merupakan halaman keseluruhan website . Ini adalah background yang letaknya paling belakang . semua bagian terbungkus oleh bagian ini .
HEADER
Adalah bagian yang membungkus kepala halaman . Untuk bagian ini masing masing template berbeda , namun pada dasarnya sama , tergantung dari desain yang ingin ditampilkan .
MAIN WRAPPER
Untuk bagian satu ini , ini adalah bagian yang membungkus konten dan juga sidebar . Atau bisa dibilang background dari bagian konten blog yang berisi materi posting dan juga konten-konten lainnya .
WRAPPER INNER
Wrapper inner ini hanya penamaan saja , tidak semua template memiliki bagian ini . Fungsinya hanyalah mengatur posisi bagian konten . Untuk template wordpress biasanya menggunakan nama Container .
CASING
Casing dan WRAPPER INNER ini sama saja , hanya beda nama dan beda cerita tapi maksudnya sama saja . Hanya saja dengan penamaan Casing untuk INNER WRAPPER menurut saya lebih memudahkan pengenalan dan pemahaman template .
CONTENT
Content ini adalah bagia utama yang berisi segala materi yang akandisajikan , mulai dari post hingga komentar . Di dalam Content ini kita akan menemukan banyak sekali script di dalam template yang membingungkan . Tapi kalau dipahami , sepertinya tidak terlalu membingungkan .
SIDEBAR
Sidebar adalah bagian sisi dari sebauh halaman blog yang bsia berisi materi materi pendukung misal popular post , artikel terbaru , lebel ataupun banner . Yang ada di bagian ini hanyalah widget yang bisa di customisasi melalui halaman edit tata letak ( Layout ) atau bisa juga melalui mode Edit HTML template .
FOOTER
Footer adalah bagian kaki dari halaman Blog yang bisa di isi dengan konten apapun semau kita .
Pada umumnya di bagia footer ini ada beberapa widget , lumrahnya ada 4 kolom widget yang bisa diisi dengan berbagai konten . Dan dibagian paling bawah ada link Credit yang berisi keterangn si pembuat Template .
Dengan mengetahui bagian bagian paling mendasar penyusun halaman web ini kita jadi lebih mudah untuk menemukan hal apa yang akan kita edit di masing masing bagian tersebut .
Misal jika kita ingin mengedit bagian atas di halaman blog , maka bagian Header yang harus kita urus .
Mulai dari Css , HTML hingga ke bagian JavaSriptnya . Untuk mengedit konten yang terdapat pada bagian post maka bagian CONTENT yang perlu kita ubek ubek .
ELEMEN FEATURED
Biasanya dibeberapa template blog dilengkapi dengan berbagai macam fitur , dan paling sering ditemui adalah fitur Slider . Sering sekali saya menemukan orang kebingungan untuk mengedit bagian ini pada template , karena bingung dimana letaknya dan apa namanya serta apa yang harus diedit .
Sebenarnya ini mudah saja . Hal yang perlu diperhatikan adalah pada bagian WRAPPER . Letaknya ada dibawah Header dan diatas Casing .
Cara Mudah Mengedit Template
Sering orang kerepotan untuk menemukan bagian yang harus di edit karena tidak memiliki pengetahuan tentang HTML dan struktur template yang digunakan . Tapi disini saya ingin memberitahukan untuk anda yang benar benar baru dalam dunia Blogger untuk lebih mudah mengedit template .
Masih bicara soal Featured Content yang biasanya berupa Slider image dibawah header .
Untuk mengedit bagian ini yang perlu kita lakukan itu sebenarnya sederhana sekali .
Lihat pada halaman blog , lihat kalimat yang tertulis di halaman tersebut , dalam hal ini yang terdapat di bagian Slider .
Contoh liaht gambar :
Yang perlu kita lakukan adalah mencari kata kata tersebut di dalam Edit HTML area dengan mengetikan kata tersebut . Maka nanti akan ketemu semuanya seperti gambar dibawah ini
Lalu edit saja bagian yang ingin di ganti .
Hal ini tidak hanya berlaku untuk Slider saja , melainkan semua konten yang tampil di halaman blog kita . Hal inisebenarnya cara yang paling simpel tapi jarang yang memakainya dan malah dilupakan begitu saja .
Banyak kasus orang kerepotan dalam pengeditan mudah ini dan malah milih buat bermumet ria .
Css Editing
Untuk mengedit warna , bentuk dan ukuran maka yang harus kita lakukan adalah dengan mengedit bagian Css nya . Tapi tidak jarang juga yang kerepotan untuk menemukan kode Css yang mana yang harus diedit .
Sebenarnya cara ini juga sangatlah mudah untuk ukuran saya yang masih Newbie dan otodidak .
langkah yang kita lakukan adalah dengan cara yang sama seperti tadi . yaitu dengan mencari kata yang tampil di bagian template .
Misal kita ingin mengedit menu pada blog kita .
Pada template hasil download yang sudah terdapat Menu , umumnya menu itu sudah bernama , maka cari saja kata itu di template Edit HTML .
Maka kita akan menemukan misalnya begini
Pola nya begini :
<div class='menu'>
<a href='/publishers'>Publishers & Advertisers</a>
<a href='/networks'>Ad Networks & Agencies</a>
<a href='/features_overview'>Solutions</a>
<a href='/services'>Services</a>
</div>
Bagaiaman menemukan Css nya ?Perlu diperhatikan 2 hal . Di dalam
Css
dan HTML
ada yang menggunakan pola Id
misal <div id='menu'>
dan ada juga yang mengunakan class
<div class='menu'>
.Nah bedanya disini adalah terletak pada Css nya . Jika
Id
maka Css nya menggunakan #menu
, dan jika class
maka Css
menggunakan .menu
.Karena diatas polanya mengunakan
class
, maka yang kita cari adalah .menu
.Ketikan kata .menu pada pencarian di template . Maka kan kita temukan banyak sekali kode seperti dibawah ini :
.menu {
float: right;
}
.menu a, .menu a.active {
display: block;
color: #054b8a;
text-shadow: 1px 1px 1px #fff;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
background: #dfe3e9 url("http://wac.a164.edgecastcdn.net/80A164/static/images/buttons_sprite.png") repeat-x 0 -887px;
line-height: 22px;
font-size: 17px;
text-decoration: none;
float: left;
margin-left: 4px;
padding: 6px 19px 40px;
border-color: transparent
}
.menu a .innerBorder {
/*padding: 5px 20px 2px;*/
border-width: 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.menu a.active .innerBorder {
border-width: 1px 1px 0 1px;
border-color: #fff;
}
.menu a.active,
.menu a:hover {
background: #dfe3e9 url("http://wac.a164.edgecastcdn.net/80A164/static/images/buttons_sprite.png") repeat-x 0 -788px;
padding: 5px 18px 0;
border-width: 1px;
border-style: solid;
border-color: #BCC2CA #BCC2CA #DEE2E8 #BCC2CA;
}
.menu a.active {
-webkit-box-shadow: 0px 10px 24px -5px #fefefe;
box-shadow: 0px 10px 24px -5px #fefefe;
position: relative;
z-index: 2;
}
Dan itulah bagian bagian yang bisa kita edit untuk merubah tampilan dari menu tersebut .Dan lagi hal ini tidak hanya berlaku pada bagian menu , tapi untuk semua bagian yang tampil di halaman Blog .
Yang perlu diingat untuk mempercepat dan akurasi pencarian kode Css adalah dengan mengetahui penggunaan
id
atau class
. itu saja , dan itu simpel sekali .Itu baru beberpa bagian kecil di dalam template , tapi pada dasarnya rumus diatas bisa dugnakan untuk merubah elemen apapun yang tampil di blog kita . Dan itu rumus paling dasar .
Untuk urusan konten yang lain yang terdapat di bagian lain seperti misal Post , Header , Footer dan juga Sidebar , cara yang dilakukan tetap sama .
Template blog itu bisa kita jadikan seperti apa saja tampilannya semau kita , tinggal kita nya saja yang harus telaten untuk mengedit dan membuat bagian bagian dari blog kita .
Dan lagi , untuk melakukan pengeditan pada template kita itu harus telaten dan jangan sampai lupa untuk memback up template sebelum melakukan pengeditan . Jadi semisal ada kerusakan saat pengeditan , kita masih punya salinan edisi terbaru dengan editan terakhir yang telah kita lakukan tanpa mengulang dari Nol lagi .
Iya , mungkin itu saja Cara paling mendasar Seputar Template Editing yang mungkin sudah anda lakukan atau tengah ingin anda lakukan dengan cara yag berbeda .
Untuk yang punya pertanyaan seputar Template Editing , jangan sungkan untuk bertanya pada saya dan saya akan menjawab semampu saya .
Perlu diketahui , jika kita sudah akrab dengan Blogger , maka kemungkinan untuk berhenti dari editing template sngat kecil , karena memang itu menyenangkan . Apalagi kalau kita selalu menganggap rumput tetangga lebih hijau , maka sebisa kita kita akan membuat rumput kita lebih hijau lagi , dalam hal ini edit edit lagi .
Tapi perlu diingat bahwa Ngeblog itu bukan cuma masalah tampilan dan Template Editing , karena orang bisa mengenal kita dan blog kita adalah dari tulisan yang kita bagikan , bukan dari template yang kita edit bolak balik .
Demikian artikel ini dan semoga bermanfaat .
2 comments
makasih gan,, tambah ilmu lagi,,
masama sob
Berikan komentar anda tanpa menyisipkan tautan aktif. Terimakasih