Selasa, 18 November 2014

Menghapus Variable Definitions Template Blog

Menghapus Variable Definitions Template Blog - Pada artikel sebelumnya saya sudah membuat artikel tentang mengganti warna blog di Variable Definitions dan pada artikel ini yang merupakan artikel lanjutan, saya akan membahas bagaimana menghapus variable definitions template blog yang rata-rata masih digunakan untuk template-template baru atau pun terdapat pada template lama

Baca juga Cara mengganti warna blog di Variable Definitions

Menghapus Variable Definitions Template Blog

Apa itu Variable Definitions?
Pada artikel sebelumnya saya sudah menjelaskannya secara singkat yaitu, Variable Definitions adalah suatu cara yang digunakan untuk mendefinisikan jenis warna, ukuran lebar blog, jarak, atau bentuk font sesuai dengan keingininan untuk mengubah variabel-variable tersebut secara langsung didalam Dashboard Blogger tanpa harus mengganti kode CSS atau HTML didalam template blog. Variable definitions berada didalam kode template blog dengan cara membuka menu Template >> Edit HTML dan Variable Definitions berada setelah atau sebelum kode <b:skin><![CDATA[

Bolehkah Menghapus Variable Definitios Template Blog?
Boleh-boleh saja dan tidak ada yang melarang meskipun template yang digunakan adalah template premium yang penting tidak menjual ulang atau membaginya secara gratis template yang telah dirubah atau diganti kodenya tersebut dan masih mencantumkan link kredit untuk sumber pembuat template tersebut. Untuk menghapus variable definitions yang ada didalam template blog harus mengetahui tentang kode CSS karena value untuk kode yang ada di CSS berada didalam kode yang diterapkan di Variable Definitions. Jika menghapus seluruh kode Variable definitions tanpa memperbaiki atau mengganti value yang ada di kode CSS maka tampilan blog akan berantakan karena didalam kode Variable definitions berbeda dengan kode yang ada di CSS karena value untuk kode CSS sudah terpasang atau sudah ditentukan didalam kode Variable definitions

Perhatikan contoh kode berikut ini
Pada kode dibawah ini merupakan kode value dari komposisi yang ada di kode body yang terdapat didalam Variable definitions yang meliputi Background, Jenis Font, Warna Font dan Jarak Letak pada layer atau Padding

<Group description="Backgrounds" selector=".body">
<Variable name="body.background.color" description="Outer Background" type="color" default="#66bbdd" value="#ffffff"/>
<Variable name="content.background.color" description="Main Background" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="header.background.color" description="Header Background" type="color" default="transparent" value="transparent"/>
</Group>
<Variable name="body.font" description="Font" type="font"
default="normal normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 12px 'Trebuchet MS', Trebuchet, Verdana, sans-serif"/>
<Variable name="body.text.color" description="Text Color" type="color" default="#222222" value="#666666"/>
<Variable name="content.shadow.spread" description="Content Shadow Spread" type="length" default="40px" value="0"/>
<Variable name="content.shadow.spread.webkit" description="Content Shadow Spread (WebKit)" type="length" default="5px" value="0"/>
<Variable name="content.shadow.spread.ie" description="Content Shadow Spread (IE)" type="length" default="10px" value="0"/>
<Variable name="body.background.override" description="Body Background Override" type="string" default="" value=""/>


Dan dibawah ini adalah penerapan pada kode CSS untuk komposisi value pada body dengan menggunakan definisi variabel untuk value yang telah ditetapkan seperti kode diatas
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);
$(body.background.override)
}


Perhatikan pewarnaan pada masing-masing kode Variable dan Value warna yang telah saya tandai untuk Variable Definitions dan pada CSS diatas. Jika Variable definitions ingin di hapus maka harus mengganti variabel dari masing-masing value yang ada didalam CSS

body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);
$(body.background.override)
}


menjadi

body {
font: normal normal 12px 'Trebuchet MS', Trebuchet, Verdana, sans-serif;
color: #666666;
background: #ffffff;
padding: 0 0 0 0;

}


Untuk mengganti value pada CSS tidak harus menyesuaikan dengan value yang ada di Variable definitions tapi bisa diganti sesuai dengan keinginan Anda, namun tetap memperhatikan value pada layer (margin atau padding) yang diberikan pada masing-masing elemnent. Untuk mengganti value pada CSS agar tidak mengganti secara satu per satu, gunakan Notepad++ dan lakukan replace pada masing-masing kode value yang akan ditetapkan

Itulah cara menghapus variable definitions pada template blog, intinya hapus semua kode variable Definitions yang ada didalam template blog dan ganti masing-masing variable yang ada di CSS dengan kode value yang diinginkan. Terkahir sebagai catatan, jika Anda menghapus Variable definitions template blog kemungkinan besar code CSS template blog akan semakin bertambah. jadi pertimbangkan dahulu sebelum menghapus definisi variabel template blog ini

Menghapus Variable Definitions Template Blog Rating: 4.5 Diposkan Oleh: ana sriwahyuni

49 komentar:

  1. walahh saya gak terlalau mudeng soal ginian mbak hehe jadi saya izin Baca pelan pelan yah mbak :)

    BalasHapus
    Balasan
    1. Bila perlu pakai TOA ya Mas Ainnul+Mas Yanto biar
      Pemahaman artikel Mbak ana jadi lebih mudah hh *senyum

      Hapus
    2. heheheeee.. aja-aja ada mas-mas nich... :D :P

      Hapus
    3. baca lagi mas, kalau bisa pinjam kaca mata syahrini

      Hapus
  2. mendadak ada bintang diatas kepala nih baca kode2an mbak
    hadeuh

    BalasHapus
    Balasan
    1. Saya juga kurang paham Mas Yanto dengan kode yu sama sama belajar sama Mbak Ana

      Hapus
    2. heheheeee,, yang nulis artikel juga muncul bintang tujuh mas Yanto... :P

      Hapus
  3. jadi variable definitions yang ada di template itu ternyata udah boleh di hapus atau di modivikasi ya...saya ko' malah baru ngeh...kemana aja saya ya

    BalasHapus
    Balasan
    1. heheheee.. iya mas boleh-boleh saja di edit... saya juga tidak tahu mas, mas kemana.. heheeee

      Hapus
    2. edit boleh, tapi ngga tau saya kemana ajah..gimana sih bu...bingung saya jadinya :D

      Hapus
  4. hehehe.. biar kodenya gak terlalu banyak yaa mba ;)

    BalasHapus
    Balasan
    1. salah satunya iya mas, untuk mengurangi jumlah kode dengan syarat tidak menambah kode css lagi..

      Hapus
  5. tutorial bermanfaat.
    salam kenal :D

    BalasHapus
    Balasan
    1. salam kenal blaik mas,, terimakasih banyak.. :)

      Hapus
  6. Cara yang efektip nih Mbak Ana. saya coba langsung praktek pada template blog saya nih.. ijin ambil pengalaman di artikel ini ya Mbak Ana terima kasih sudah berbagi :)

    BalasHapus
    Balasan
    1. silahkan mas, semoga bermanfaat dan hati-hati mas jangan sampai ada kode yang error.. :)

      Hapus
  7. Kalau dilihat memang agak ringan kalau dihapus ya mba variable definisionl pada template blog, tapi kalau meleng masangnya jadi lumayan nih. He,, he, he,, :D

    BalasHapus
    Balasan
    1. iya mas tapi selama tidak ada penambahan kode css yang lain bisa membuat loading lebih cepat.. nah itu dia mas, kalau tidak hati-hati bisa bikan error.. :)

      Hapus
  8. saya pahami dulu, sebelum bertindak menghapus Variable Definitios Template Blog

    BalasHapus
  9. Ilmu baru nih mbak ana, makasih yaa udah bantu sharing nih :)

    BalasHapus
    Balasan
    1. sama-sama mbak Wida, ilmu lama tapi bari saya posting, semoga bermanfaat ya mbak :)

      Hapus
  10. ini cocok sekali buat yg hobi oprek template bawaan blogger yg biasanya pakai css Variable Definitions :)

    BalasHapus
    Balasan
    1. kira-kira siapa ya mas yang hobi oprek template.. ? :)

      Hapus
  11. mantap tutornya, berguna banget

    BalasHapus
    Balasan
    1. alhamdulilah,, terimakasih banyak mas.. :)

      Hapus
  12. blajar lagi disini ah
    pumpung fikiran lg fresh nih mbak

    BalasHapus
    Balasan
    1. heheheeee,,alhamdulilah kunang-kunangnya sudah pergi ya mas.. :)

      Hapus
  13. Balasan
    1. sama-sama mas Bagus, terimakasih kembali...

      Hapus
    2. smoga bermanfaat ya mas... hehehe

      Hapus
  14. Salut nih sama mbak ana
    Familiar banget sama masalah kode2an :)

    BalasHapus
    Balasan
    1. heheheee.. biasa saja mbak, saya masih tahap belajar untuk kode template,,, :)

      Hapus
    2. betul ya mbak susi...mbak ana memang cerdas dan pandai sekali soal beginian... :)

      Hapus
  15. Salam Malam Mbak Ana kunjungan Rutin sambil Ronda malam
    KEMBALI SIMAK DAN BACA POST Caa menghapus variable
    Definition template, sangat bermanfaat sekali tutorialnya nih Mbak Ana :)

    BalasHapus
  16. Mengapa di hapus Bu variable definitions template nya ?. Kalau menurut saya sich sebaiknya tidak perlu dihapus, karena ini memudahkan kita setting background, jenis, ukuran, dan warna font, dan masih banyak lagi yang lainnya tanpa perlu masuk ke HTML Template blogger. Cukup masuk ke layout dan pilih kata Template Desaigner atau Desiner Template di sebelah kanan atas tampilan layout blogger. Di situ kita bisa atur sesukanya semua yang sudah disediakan oleh team blogger.

    Kalau variable definitions template nya di hapus di CSS, maka kita tidak bisa atur lewat cara yang sudah di sediakan team blogger tersebut.

    Jika hubungannya dengan kecepatan loading blog kita, saya rasa tidak terlalu berpengaruh Bu sebelum kita menghapus variable definition dan setelah kita menghapus nya. Karena variable definition bukan termasuk isu minor, medium atau pun major dalam google speed insights.

    Tapi by the way ini juga salah satu artikel unik dan berkualitas dari Bu Ana. Saya cek artikel ini nangkring di posisi teratas search result google untuk cara menghapus variable definition. Great job Bu Ana.

    BalasHapus
  17. perlu banget nich..apalagi tidak perlu mengkotak katik css ..tutorialnya sederhana namun mudah dipahami....keep happy blogging always..salam dari Makassar :-)

    BalasHapus
  18. saya pelototi dan saya renungi dulu mbak...saya harus memudengkan otak saya dulu kalau urusan kode-kode begini...hehe

    BalasHapus
  19. di blog saya tidak ada mbak variable-variable yang ribet seperti itu mbak... lebih ke CSS saja mbak biar lebih mudah lagi...

    BalasHapus
  20. mbak ini kode kode diapain yah.. pake sambal ya, pinter deh mba ini..

    BalasHapus
  21. sekarang mah udah tak mudah tergoda untuk edit-edit daleman HTML deh saya mah...sebabnya kalau udah di mulai suka merembet kemana-mana...apalagi kalau kudu menghapus variable definitions template..hu...cape deh..:D

    BalasHapus
  22. wah saya kebetulan nggak begitu paham sama kode template buk, jadi izinkan saya belajar dulu ya biar bisa menerapkan tutorial ini :)

    BalasHapus
    Balasan
    1. Blogku masih bawaan blogger. hampir separuhnya aku rubah variabelnya. biar tampil beda dan tidak ada yang nyamain. pokoknya sangat asek deh, otak-atik template, walau rambut ikut rontok tetap terasa hepi.

      Hapus

Demi kenyamanan bersama, tidak boleh memasang link dalam bentuk apapun, komentar yang berisi link tidak akan diterbitkan
Terimakasih

Direktori

direktori weblogger
Direktori WeBlog Indonesia