25 Jul 2013
Akhirnya selesai juga template kedua bulan ini dari hasil voting di fan page saya Djogzs. tema Anime kali ini adalah To Aru Kagaku no Railgun dari anime yang saat ini masih airing. Singkatnya Toaru Kagaku no Railgun adalah cerita sampingan berdasarkan cerita asli Kamachi. Bertempat di Kota Akademi, sebuah kota di mana sekitar 80% dari 230.000 penduduknya adalah pelajar. Cerita ini mengenai petualangan Misaka Mikoto sebagai pemeran utamanya, salah satu dari psikis Level 5 yang dapat mengeluarkan listrik.
Template ini menggunakan dasar warna biru agak tua, hampir sama tampilanya dengan template yang sebelum"nya,tetapi hanya saja tampilan posting pada template ini paling berbeda dari semua template yang pernah saya buat. yaitu karena penggunaan CSS3 :nth-child() Selector yang baru saja coba-coba.CSS3 :nth-child() biasanya cuma digunakan pada widget-widget tertentu,tapi saya coba terapkan pada posting maka hasilnya adalah ukuran posting,warna,atau stylenya dapat dibedakan sesuai urutan posting tersebut.Posting pertama pada template ini menggunakan ukuran full 100% dan tinggi gambar auto, posting ke 2-5 ukuran setengahnya yaitu 47,7% sehingga jadi 2 kolom posting, dan posting urutan ke 6 dan seterusnya tidak memiliki gambar alias sticky seperti tampilan posting Shiroi agar dapat sedikit hemat gambar dan lebih simple~xD
Template ini tidak menggunakan slider ataupun accordion ,tetapi ditambahkan menu kedua dibawah header dan footer dengan 3 kolom.
Screenshot
1. Pengaturan menu
Buka blogger,pilih menu template=> Edit HTML lalu cari kode html yang seperti dibawah ini.
setelah itu ganti tanda pagar '#' (tanpa tanda petik) dengan url/alamat link yang ingin dituju,dan ganti juga nama linknya.
Menu1
<div id='menujohanes'>
<ul>
<li class='selected'><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></li>
<li><a class='menu' href='#'>Download</a>
<ul>
<li><a href='#'>Naruto</a>
<ul>
<li><a href='#'>Episode 1</a></li>
<li><a href='#'>Episode 2</a></li>
<li><a href='#'>Episode 3</a></li>
</ul>
</li>
<li><a href='#'>Date A Live</a>
<ul>
<li><a href='#'>Episode 1</a></li>
<li><a href='#'>Episode 2</a></li>
<li><a href='#'>Episode 3</a></li>
</ul>
</li>
<li><a href='#'>Devil Survivor2</a>
<ul>
<li><a href='#'>Episode 1</a></li>
<li><a href='#'>Episode 2</a></li>
<li><a href='#'>Episode 3</a></li>
</ul>
</li>
</ul>
</li>
<li><a class='menu' href='#'>Contact</a>
<ul>
<li><a href='#'>Twitter</a></li>
<li><a href='#'>Facebook</a></li>
<li><a href='#'>Blogger</a></li>
<li><a href='#'>Google plus</a></li>
</ul>
</li>
<li><a class='menu' href='#'>Multi sub</a>
<ul>
<li><a href='#'>Episode 1</a>
<ul>
<li><a href='#'>Episode 2</a>
<ul>
<li><a href='#'>Episode 3</a></li>
<li><a href='#'>Episode 4</a></li>
</ul>
</li>
<li><a href='#'>Episode 5</a></li>
</ul>
</li>
<li><a href='#'>Episode 6</a></li>
<li><a href='#'>Episode 7</a></li>
</ul>
</li>
<li><a class='menu' href='#'>Clients</a></li>
<li><a class='menu' href='#'>Email</a></li>
</ul>
Menu2
<div id='menujohanes'>
<ul>
<li><a class='menu' href='#'>Menu1</a></li>
<li><a class='menu' href='#'>Menu2</a></li>
<li><a class='menu' href='#'>Menu3</a></li>
<li><a class='menu' href='#'>Menu4</a></li>
<li><a class='menu' href='#'>Menu5</a></li>
<li><a class='menu' href='#'>Menu6</a></li>
</ul>
</div>
pengaturan lebih lanjut mengenai menu ini,silakan baca di postingan ini :
http://djogzs.blogspot.com/2013/06/css-dropdown-menu.html
2. Setting SEO/Meta tag
setting manual oleh pengguna mengenai deskripsi dan keyword blog anda.
*ganti text yang berwarna merah
<meta content='deskripsi blog kamu' name='DESCRIPTION'/>
<meta content='keyword blog kamu' name='KEYWORDS'/>
Untuk pengertian setting seo/meta tag,anda bisa cari tahu di google atau disini dan disini
3. Setting Social media : facebook, Twitter, google,Pinterest.
*ganti url linknya
<div class='jorib'>
<a href='#' target='_blank'><div class='googlejo'/></a>
<a href='#' target='_blank'><div class='twitterjo'/></a>
<a href='#' target='_blank'><div class='facebookjo'/></a>
<a href='#' target='_blank'><div class='pinterestjo'/></a>
</div>
4. Bagaimana cara mengatasi undefined?
Buka setting=> language and formating pada blog kamu seperti gambar dibawah ini.
Lalu ikuti format tanggal posting seperti contoh gambar dibawah ini :
Date header format:
Timestamp Format
Comment Timestamp Format
Tertarik dengan To Aru Kagaku no Railgun Blogger Template? silakan unduh template ini dan diterapkan pada blog anda,tapi ada baiknya untuk selalu membackup template anda sebelum menggunakan template ini.terima kasih.
Bonus PSD File Header To Aru Kagaku no Railgun~xDD
Semoga bermanfaat untuk semuanya ^^ ,tapi tetaplah ingat,selalu bijak menggunakan template gratis dan STOP aksi PLAGIAT ,karena itu perbuatan yang merugikan dan sungguh memalukan. Sankyuu minna-san~ :)
Note:
-Saya tidak bertanggung jawab atas kerusakan/crash karena pengeditan template yang anda lakukan.
Sebelum mencoba template ini,ada baiknya anda membaca kebijakan menggunakan template disini.
http://djogzs.blogspot.com/p/privacy-policy-kebijakan-privasi.html
Sebelum bertanya tentang pengeditan template, silakan baca Frequently asked questions terlebih dahulu dan berusaha sendiri mencari tahu apabila ada yang ingin diedit, Terima kasih.
{ 52 comments... read them below or Comment }
"Maaf komentar anda tidak akan dibalas, karena blog ini sudah tidak aktif. Terima kasih"
"Sorry your comment will not be replied, because this blog has been inactive. Thank you"
Langganan:
Posting Komentar (Atom)
Translate
Eaa, pertama kah?? >^<
BalasHapusapakah halaman static-nya juga udah di setting ??
BalasHapusmasih standart
Hapushttp://toarukagaku-bt.blogspot.com/p/tes.html
wah bagus mas bagi tutor css posting nya dong ;P
BalasHapusoh ya bang, gara - gara bang jo aku jadi suka dengerin lagu vocaloid tanggung jawab dong bang kasih tahu lagu vocaloid yang bagus apa aja bang
klo itu juga ga bisa asal kasih css trus tinggal copy paste,html'a juga harus diatur .__.
Hapusyes,akhirnya kena racun vocaloid juga :v
http://djogzs.blogspot.com/p/friend-chat.html
oke deh bang ... tumben nih langsung di jawab .. oh ya bang aku mau buat blog aku ,,, terinspirasi blog bang jo dari latar background ama warna dan pengaturan widget tapi lainnya aku atur sendiri nanti di creditnya aku kasih deh bang boleh ya bang .... boleh tengok di blog aku simpelstars.blogspot.com....
Hapusmohon di preview ya bang kalau ada saran ama kritik dari abang nanti coba aku gubang lagi ...
jangan banyak ditiru lahh template k jo,, kan udah kejadian pada minta template kaya k jo,, nanti k jo marah lagi lo + pasti k jo ganti" template dan akhirnya '.......' (pasti tau jawabannya).. :P
Hapusiya aku tahu makanya aku tanya ; )
Hapuskalau bang jo ngak berkenan ama latar atau apanya nanti aku ganti biar beda gitu ... .. aku masih ngedit terus soalnya.. moga bang jo bersedia menjawab.. aku juga ngak mau sama persis ma bang jo kan kasihan bang jo dah susah mikirin bentuk template ,aku aja dah hampir 3 bulan ngak bisa mikirin bentuk template yang beda dan unik .. aku sebenarnya suka ama style pengaturan widgetnya aja terlihat rapi dan simple sesuai judul blog aku kalau background nanti bisa aku ganti kalau bang jo ngak berkenan
wah :3 posting depannya unik :3
BalasHapusPERTAMAX :D
BalasHapusThanks ya buat template nya.. :)
BalasHapusNanti w coba pake di blog,, klo sekarang lagi ngedit template blog black rock shooter pake tutorial video styling.. :D
Sekalian mau nanya,, klo cara besarin gambar post + kasih jarak gmna ya di template black rock shooter..?? soalnya di video stlying gampang, tinggal ganti nilai margin..
nihh k ss nya.. http://3.bp.blogspot.com/-QeoIcBt5H8M/UfEhOwL4k7I/AAAAAAAABM0/WxEFNrOFTQg/s1600/2.jpg
Hapushttp://z-sub.blogspot.com
yey
BalasHapuskern...,download ah..... XD
BalasHapusKeren Bang.
BalasHapusLanjutkan Kreasimu.
Visit yok.
www.sederetanime.blogspot.com
bang bisa yang buat postnya di benerin gak.?? soalnya di blog saya kalo judul postnya kepanjangan postnya gak rapi -.-
BalasHapusbisa aja sih tinggi judul postnya dibatesin tingginya biar sama semua, ditunggu aja ya,blum sempet cek lagi .__.
Hapusupdate~
Hapushttp://djogzs.blogspot.com/p/frequently-asked-questions.html
baca no 12
Bang Jo Ane ada masalah. di tata letak.
BalasHapuspas mau tambah widget gax bisa. gax ada tangan nya.???
ditunggu ya,belum sempet cek lagi .__.
Hapusok
Hapusbang jo,, boleh request template kaya www.wardhanime.net ga,, bagus tuhh tempat postingnya + ada tag nya.. tolong ya bang di buatin,, template animenya terserah bang jo,, tapi w maunya kaya postingan www.wardhanime.net.. :D
BalasHapusmaaf,saya ga pernah mau ngiutin blog orang lain.
Hapusohh gitu,, saya cuma tertarik ama tampilan postnya,, maaf ya k jo..
HapusKeren banget bang Templatenya ^_^
BalasHapusSaya izin download ya mau koleksi dulu
BTW Bang Jo, cara agar blog muncul di search engine itu gimana sih?
Saya sudah mengisi meta content
Tapi, kok belum muncul juga ya
Saya juga sudah menambahkan URL blog saya ke Google dan Yahoo
Saya Masih Blogger Pemula
Jadi Mohon Bantuannya ^_^
ditunggu aja,memang ga secepat itu~
HapusBetul bang........
HapusBlog saya udah mulai muncul di search engine
Makasih bang......
Mas johanes cara buat widget google translate seperti di djogzs.blogspot.com gimana ya (yang melayang di pinggir kanan atas) saya menggunakan template metrominimalis buatanya mas johanes,dan yang mau saya tanyakan lagi, saya ingin menambah tombol share g+ di widget minishare yang ada di template metrominimalist, caranya gimana ya
BalasHapusThanks
tinggal buat widget biasa,trus di edit html tambahin css
Hapus#Translate1 {
position: fixed;
top: 0px;
right: 0px;
}
klo tombolkan,tinggal ganti gambar icon google+ sama url linknya.
Thanks om Johanes :D
HapusBang kalu mau melebarkan halaman posting nya bisa nggak ya?
BalasHapusSebelum nya terima kasih :D
http://djogzs.blogspot.com/2013/07/video-styling-post-blogger-template.html
Hapushttp://djogzs.blogspot.com/2013/07/video-styling-post-blogger-template.html
Hapusk jo,, klo cara mindahin menu horizontal dari atas ke bawah gmna..??
BalasHapushttp://1.bp.blogspot.com/-6CnoGkPf-EE/UfVhfIDViWI/AAAAAAAABNU/F2Vos7-t5bI/s1600/menu.jpg
sekalian mau minta menu horizontal dari hatsune miku,, tolong ya k jo di balas,, klo comment saya yang diatas ga dibls juga gpp,, please ya yg ini di bls soalnya udh klop ama templatenya,.. TY.. :)
http://z-sub.blogspot.com/
pindahin html menunya ke bawah html header.
Hapuscontoh
div id='header'
...
...
...
/div
disini
aduhh k,, ko malah jadi berantakan ya,, jadi harus ulang dari awal.. T_T
Hapustolong ka di coba ama kk,, tapi pake menu yang hatsune miku,, klo ga berantakan saya minta scrip nya ya.. :)
ohh iya mau tanya lagi,, klo di template robotic notes ko ga keluar statistiknya,, cara biar keliatan angkanya gmna..??
Kakk Jo Template Ini Ada Responsive nya gk Kak JO ..
BalasHapusada kq,dicoba aja kecilin browser;a:)
HapusCara Pakenya Gimana Senpai...... Ane Masih Nubi......... Plz blz Cepet, Saya Tunggu.........
BalasHapushttp://djogzs{dot}blogspot.com/p/frequently-asked-questions.html
HapusSipp bang jo... Langsung Coba...
BalasHapusLain kalo share PSDnya di pack (zip/rar/7z) dulu aja biar hemat sedikit... Hehehe....
Bang, search.nya kalo masuk post/page ngilang... bisa dibetulkan g?
Hapussementara aku kyk gni... (^.^)
http://subonly.blogspot.com/
ilang gimana?
Hapusaku cek disini
http://subonly.blogspot.com/p/staff.html
msh ada kq search'a .__.
oh iya,baru sadar,kotak seachbarnya memang ga muncul di halaman statik .__.
Hapuscari ini:
Hapus<form action='/search' id='search' method='get'>
<input name='q' placeholder='Search Somethings..' size='40' type='text'/></form></b:if></b:if>
ganti jadi begini
</b:if></b:if>
<form action='/search' id='search' method='get'>
<input name='q' placeholder='Search Somethings..' size='40' type='text'/></form>
Komentar ini telah dihapus oleh pengarang.
BalasHapusKK tolong donk minta covernya yang belum ada animenya please...
BalasHapusBang mau nanya, di blog aku postnya kenapa ngga bisa jd banyak ya? pdhl sudah diset 6 post tp yg keluar cuma 2, itu gimana cara perbaikannya?
BalasHapuscoba dilihat di blogku kyk gini
kazuechanworld.blogspot.com
arigatou!
ya.. kok mati link downloadnya :(
BalasHapusINFO: Buat Anda yg lagi mengalami Suatu masalah,
BalasHapus1.Masalah Ekonomi
2.Terlilit Hutang
3.Masalah Rumah Tangga Dlln.
Maaf sebelumnya jika lewat Tempat ini saya menceritakan kisah hidup saya niat saya hanyalah semata ingin berbagi tapi semua tergantung Anda percaya atau tidaknya
Syukur alhamdulillah kini saya bisa menghirup udara segar di indonesia karnah sudah sekian lama saya ingin pulang ke kampung halaman namun tak bisa sebab,saya harus bekerja di negri orang karna ada hutang yang harus saya bayar di majikan yaitu 257 juta untuk uang indo,Namun berkat bantuan KI BARON Kami terbebas dari hutang ini
SRDIKIT BOCORAN BANTUAN DARI
KI BARONG No TLPN 0852 8895 8775
1.PESUGIHAN
2.TOGEL
3. DANAH GHAIB
4.PENGGANDAAN UANG
5.UANG BALIK
6.PELET/PEMIKAT
7.PENGLARIS BISNIS (Jualan,Tokoh,warung)
8.PERLANJAR DALAM BERBAGAI HAL
Jadi buat yang pengen seperti saya silahkan hubungi KI BARONG di nomor 0852 8895 8775 Anda tidak usah ragu akan adanya penipuan atau hal semacamnya sebab saya dan yg lainnya sudah membuktikan keampuhan bantuan beliau kini giliran Anda trimahkasi
mas kalau mengubah gambarnya itu bisa gak?
BalasHapuskalu bisa bagaimana caranya?
Agen Winenlose || Agen Judi Winenlose || Agen judi Online Winenlose
BalasHapusWinenlose
Bonus Winenlose
Register Winenlose
Deposit Winenlose
Withdraw Winenlose
Peraturan Winenlose
Livescore Winenlose
Panduan Winenlose
Prediksi Winenlose
PREDIKSI DENMARK VS JERMAN 07 JUNI 2017