Membuat Header Berbeda Setiap Postingan
Kembali lagi ke blog trik, setelah membahas beberapa hal mengenai error shoutmix, dan static page di blogspot, juga info mengenai perpanjangan .co.cc gratis, kini saaatnya saya memberikan trik kepada Ada, bagaimana membuat header yang berbeda untuk postingan tertentu. Seperti biasa, agar lebih mudah silahkan lihat contoh dengan klik, Forum: Lesehan Wae. Perhatikan bagian artikel forum tersebut, bagian header berubah dari header bertulisakan Mas Doyok, menjadi Lesehan Wae.
Bagaimana bisa terjadi? Mudah saja, itu memang dua gambar yang berbeda. Dan saya hanya memanggil gambar bertema Lesehan Wae untuk postingan tertentu.
Untuk membuatnya Anda ikuti tutorial berikut ini,
1. Temukan CSS Header Anda
Anda harus bisa menentukan mana yang merupakan kode css untuk header Anda. Kodenya akan mirip seperti ini:
2. Aplikasi Header Hanya Untuk Postingan TErtentu
Masukkan kode berikut ini di atas </head>
Nah, isi kode berwarna merah pertama dengan alamat postingan Anda yang akan Anda rubah headernya.
Kode merah kedua adalah kode css untuk header Anda. Jadi sekarang, Anda mempunyai dua kode css header,yang pertama untuk umum dan yang baru saja Anda tambahkan hanya bekerja untuk postingan yang Anda tentukan.
Anda bisa melakukannya untuk hal-hal lain seperti sidebar dan bagian postingan Anda. Hanya butuh penyesuaian css saja. Semoga bermanfaat.
Bagaimana bisa terjadi? Mudah saja, itu memang dua gambar yang berbeda. Dan saya hanya memanggil gambar bertema Lesehan Wae untuk postingan tertentu.
Untuk membuatnya Anda ikuti tutorial berikut ini,
1. Temukan CSS Header Anda
Anda harus bisa menentukan mana yang merupakan kode css untuk header Anda. Kodenya akan mirip seperti ini:
Namun kode di atas bukan harga mati, bisa saja Anda menggunakan template yang gambar kepala masuk dalam body seperti template saya. Intinya temukan kode untuk gambar kepala Anda.#header-wrapper{
..............................
..........................
............................
background: url (alamatgambaranda);
}
2. Aplikasi Header Hanya Untuk Postingan TErtentu
Masukkan kode berikut ini di atas </head>
<b:if cond='data:blog.url == "http://urlpostingananda.com/urlpostingananda.html"'>
<style>
#header-wrapper{
..............................
..........................
background: url (alamatgambaranda);
}
</style>
</b:if>
Nah, isi kode berwarna merah pertama dengan alamat postingan Anda yang akan Anda rubah headernya.
Kode merah kedua adalah kode css untuk header Anda. Jadi sekarang, Anda mempunyai dua kode css header,yang pertama untuk umum dan yang baru saja Anda tambahkan hanya bekerja untuk postingan yang Anda tentukan.
Anda bisa melakukannya untuk hal-hal lain seperti sidebar dan bagian postingan Anda. Hanya butuh penyesuaian css saja. Semoga bermanfaat.
Nice tips mas. Makasi. Berati klo halamannya banyak, code nya juga banyak ya?
BalasHapussepertinya sih seperti itu, kalo ada 5 model berarti buat 5 script *CMIIW* :)
Hapuspertamaksss gak yah ???
BalasHapusOK makasih mas doy . . . ini yang sedang aku cari - cari . . .
BalasHapus@1989097506370486721.0
BalasHapusAkhirnya pertamax juga. he..
mmh gitu och, baru tau,,
BalasHapushx ya mass,,
tetpa berkaya
@6475579720423406392.0
BalasHapusya mas, kalau banyak pakailabel saja kan :D
@3542278742187555657.0
BalasHapusenggak dit :D
hehehe
@745895446575620390.0
BalasHapussip mas udah ketemu jodoh tinggal lamaran berarti
@2659181195790487787.0
BalasHapusihsan
oek semoga bermanfaat utk blog barumu :D
@1073170741495992225.0
BalasHapusBener juga mas. Makasi ya.
gak ada demonya nih...kurang maknyus...wuekkekkekekek
BalasHapusmantap mas,,,
BalasHapusaku coba dulu ah,,
tp di postingan aku yg mana ya ???
wah mantap ternyata di masukkan pada body nya ya ... wkwkwkw baru tau aq mas doy wkwkwk
BalasHapusooo g bisa otomatis ya mas doy@... kalo satu2 gitu bisa menuhin n beratin blog tu sob...
BalasHapusMakasih mas infonya...
BalasHapusInfo yang bermanfaat.
GAGAL PERTAMAX!
Ehehe.. hampir sama.. dengan ini
BalasHapusMemunculkan Widget Blog Blogger Hanya di Halaman Postingan Tertentu Saja
Ehee.. :D
@3344080518015853026.0
BalasHapusiya mas
:D
sip deh
semoga bermanfaat ya :D
@3817089148002972084.0
BalasHapuskan sudah ada contohnya
http://www.masdoyok.co.cc/2010/01/kopi-tjap-cangkir-ngobrol-seputar.html
@7153066929346921634.0
BalasHapusichan ya terserah klamu
bagusnya mau dicocokin dengan yg mana :D
Wah keren mas doyok... kapan2 tak coba ahh.
BalasHapus@1314858230464346278.0
BalasHapuskalau punyakugitu lex
buat ngiritload jgua :D
sekalian hehe
@5613518350027291512.0
BalasHapuskalau ini utk tertentu
kalau mau banyak pake label mas :D
@4063388073176028362.0
BalasHapusyang penting bacanya kan riz :D
makasih sudah setia di blog ini
@8572936583996714075.0
BalasHapussedikit beda mas
ini mengganti :D
kalau itu kan keselruhuan kodewidget :D
ini cssny saja yg dibedakan widgetnya sama :D
@6079414624130319331.0
BalasHapusoke khatam silahkan
semoga jadi makin cantik blognya
wah ilmu lagi nih...terima kasih
BalasHapus@aryanto aj
BalasHapussama sama
terima kasih dukungannya mas :D
wwoow mantap jua nih perlu di coba nih agaar lebir menarik keliatan tampilan blog saya hehe thx info nya
BalasHapusberarti tinggal cari img yg pas bwt tiap postinganya ya mas.. :)
BalasHapus@1089670942945095458.0
BalasHapusoke kang udin
monggo mas :D
@4647471935401512038.0
BalasHapusiya
tapi jgn semua post jgua
karna pastinya akan tambah berat
kalausayacuma saya gunakan utk forum :D
misl bisakamu gunakan utk post gallery
atau contac us kan
saya Test dulu deh mas Doy!
BalasHapus@ROSMANA
BalasHapusoke silahkan semoga bermanfaat
Ini mas doy URL nya http://mxwan.web.id
BalasHapusOia info dan triks baru ki ?? tiap hari maen htm po mas doy
Gus Ikhwan wae kalo mau ngedit OFFLINE kalo Online takut lupa backup
Rissing Star ki Mas Doyok is Rissing Star
Amin
Sukses terus mas doy
salam sahabat
BalasHapuswah kalo dipikir n saya kaji ulang bisa mempengaruhi loading juga masDoy..siip dech my luv eh ra oleh my best Mas thnxs ya
sip kang nanti aja tapi tak coba
BalasHapuskomen dulu
@6829889298187313223.0
BalasHapusgus ikhwan kalau bisa ol YM
mau saya pasang fotonya di author
@1973285366382705069.0
BalasHapusiya memang dhana :D
bisa mempengaruhi load :D
tapi bagi yg penegn ok ok aja
@one2
BalasHapusoke monggo wan semoga iso iso
@1914461940801316113.0
BalasHapusnek ra iso takon aku mbek njenengan
@one-one
BalasHapusokelah kalo begitu wan
mas doy:.. sips..dech... postingan yang aku suka.. besok2 giliranku ya ... nice info n share because useful for us all.
BalasHapus@2924975865046033666.0
BalasHapusoke didik silahkan
semoga bermanfaat ya
Walau udah koment td diatas,
BalasHapustp koment lagi ah,,
hhahahaha
@7329337168660299188.0
BalasHapusmaksude apa kuwi
hahaha
oke deh ie chan
saking semangatnya ya
nice tutor mas,,
BalasHapusthx
Emang jitu tipsnya sob...
BalasHapus@7991218514683156188.0oke semoga bermanfaat saja ya
BalasHapus@7991218514683156188.0
BalasHapussemoga bermanfaat saja chord
@8106559343446586100.0
BalasHapussemoga berguna jitu juga
@5641908258653427528.0
BalasHapusiki contohne YOK http://ben-tools.blogspot.com
nah cuma suggestion ajah nih yok, kalo bisa jgn pakek yg random2 ato ganti2 deh....kurang good ke mbahnya tuh....trst me trust me....wekekekekkkkk
@2290173261420341800.0
BalasHapusbiar yg ini satu aja BEN
utk forum biar rada beda hehehe
wah tutorialny keren mas...
BalasHapusGus Ikhwan siapa lagi tu kang, kok baru ahu sebagai author apa dulu d hiden ya ????
BalasHapusCara bikin kotak komentar pada gus ikhwan gimana mas doy, kok ada matematikanya pada kotak komentarnya ???
Postng triksnya dong ??
Di form kotak komentar juga ada tulisan terakhir si tukag kommentarnya
Untuk header saya sama ratakan saja mas doy, karena saya pernah hack template untuk besar kecil font, ternyata malah pengaruh ke header dan title....
BalasHapus@Angga
BalasHapusuntuk wordpreess sudah berbeda lagi :D
@315134848085662111.0
BalasHapussemoga bermanfaat van :D
@499440910170581431.0
BalasHapusmungkin salah kode bbb ? :D
pengaruhnya gimana?
kalo saya ada 5 page mau di begitukan gimana mas? tadi saya udah baca di atas,katanya paki label,maksudnya gmana sih? cara pakai label gmana? wokaokwoakw...maklum udah banyak lupa struktur blogspot.. di bookmark dulu dah ni posting
BalasHapus@jopi
BalasHapusya kan kalau kamu posting bisa dikasih label
nah ke lima postingan itu diberi label yang sama
lalu di kodenya di alamt postingan diganti dengan alamt label
misal:
http://www.masdoyok.co.cc/search/label/namalabelmu
mantab infonya gan..thx
BalasHapusini co.cc licensi yaa mas?..keren abizzz
BalasHapus@1166838828822436732.0
BalasHapuslicensi gimana mas
@4540023099716485907.0
BalasHapussemoga bermanfaat saja mas
ok mas doy.. sangat bermanfaat nih...
BalasHapusMas Doy emg ok... selalu menghadirkan hal yg baru.. bravo Mas Doy...
Menarik sekali tipsnya mas...
BalasHapussaya juga baru bikin HEDAER dengan nuansa imlek mas...
http://universal.hermantan.com
mas, dikunjungi yah, sekalian kasih komen gimana headernya bagus egk..
thx sebelumnya mas...
@6289615632198562712.0
BalasHapussebenernya hal lama mas :D
cuma dibahs ulnag utk konteks berbeda
biar lebih jelas
@2042949246808948437.0
BalasHapusup date juga headernya ya mas
gak cuma beritanya
sip :D
bagus maz
BalasHapusaq dari kemaren pelajari ini masih bingung mas doy.....
BalasHapusoy ada post baru d blog aq, kalau sempat mampir mas doy
trims Mas Doyok atas ilmunya, sangat bermanfaat sekali n membantu niih... smg sukses selalu n tetap semangat
BalasHapuskeren artikelnya..mantap
BalasHapus@2441734524773821722.0
BalasHapussemoga saja bermanfaat mas :D
@7054807334210500825.0
BalasHapusoke rizky kalau gak nanti lewat YM saja
biar enak :D
@6028229134315347530.0
BalasHapusterima kasih sekali mas hartoatas dukungannya :D
@6986203511934027702.0
BalasHapusmakasih mas
semoga bermanfaat
mas doyok, tipsnya mantap banget. sangat membantu, terutama bagi kami yang masih pemula. Terima kasih
BalasHapusSukses selalu buat anda.
keren
BalasHapus@7041676977377833334.0
BalasHapusalhamdulillah
semoga bermanfaat ya bungjamil
@7463507684091623689.0
BalasHapusalhamdulillah kang :D
asik nih bisa nambah keren nih tampilan blognya ntar, thanks mas ntar bisa dicoba.
BalasHapus@tovazone
BalasHapusoke mas
semoga bermanfaat ya
Kalaau menghilangkan semua widget kayak di forum Lesehan Wae itu gimana caranya kang
BalasHapus@8782959810370501308.0
BalasHapustak posting nanti malam deh insyaAlloh
salam kenal dari saya yang baru coba membuat blog dan masih edit edit template,untuk artikel saya nantinya dan mohon kritik saran di blog saya kang,dan mohon izin mengcopy tutorialnya untuk dapat saya pakai,sekali lagi trimakasih bookgaul
BalasHapuscara mendesain header buat postingan tertentu gimana mas???? saya gak ngerti mohon penjelasannya
BalasHapusSalam kenal mas.. Saya pendatang baru di blogger, artikelnya banyak memberi mamfaat.. Apakah boleh di copas?. Kalau boleh, terimah kasih dan semoga ilmunya selelu bertambah..
BalasHapusMungkin Kapan Kapan Akan Saya Coba
BalasHapusartikel na semwa brmanfaat ..tpi msih krank ngerti..hhe
BalasHapusmksud dari kode Css tu apa mas?
bagaimana cara kita melihat kode css kita n ada dimana kode itu terletak
mohon panduannya mas.. boleh kirim ke email saya mas jawabannya di
mangazic.download@gmail.com
Mas di kode ini #Header-Wrapper enggak ada url background header blog ku mas,lantas gimana dooong?cari url dimana mas?Tolong ya dibantu ya?
BalasHapus