Solutions For You

logo
close
Blog ini akan Saya hapus soalnya banyak masalah di Webmaster. Maklum dulunya blog gado - gado, isinya copasan haha. Mungkin nanti muncul blog baru pengganti Blog Saeful13 dan tentunya pake TLD biar terlihat professional gitu haha..

Sebentar, ente tahu TLD gak ? Kalau gak tahu TLD itu Top Level Domain :) Masih belum ngerti juga ? Ane jelasin lagi ya, TLD merupakan akhiran pada suatu nama domain yang mengindikasikan pemilik tingkatan tertinggi Domain tersebut dan jenis domain tersebut. Kayak .com, .net dan kawan - kawannya :)

#JustKiddingBro
close
menu

Sulitnya Mendesain Template Blogger

The difficulty of designing Blogger Templates - Halo sobat blogger, disini saya mau berbagi kepada sobat mengenai pengalaman saya mendesain sebuah template. Mungkin bagi seorang desainer Template seperti +Kang Ismet, +Abdul Rohman, MKR dan Maskolis, hanya membutuhkan waktu beberapa jam saja atau hingga 1 hari untuk membuat sebuah template. Namun berbeda kenyataannya dengan saya, saya membutuhkan waktu berminggu-minggu untuk mendesain sebuah template. Bahkan template  pertama hasil desain saya sendiri membutuhkan waktu 1 bulan lebih hingga jadi sebuah template responsive.

Dalam mendesain sebuah template tidak sepenuhnya merupakan karya saya sendiri. Desain template ini saja merupakan inspirasi dari para master blogger lain. Ini buktinya kalau saya menggunakan beberapa template untuk dijadikan inspirasi dalam mendesain template.
Sulitnya Mendesain Template Blogger
Template Ini saya beri nama Suntemo Blogger Template V2
Fitur :
1. Quick Search by DTE:]
2. Emoticon di Halaman Post dan Komentar script from DTE:]
3. Threadded Comment from Zikazev Template by Kang Ismet
4. Fitur Komentar ( Syntax Higlighter, Gambar, Blockquote, dll ) script from MKR and Agitanugrah
5. Responsive
6. Valid HTML5
7. Valid CSS3
8. SEO Friendly
Nama
URL
Taufik Nurrohman
Kang Ismet
Abdul Rohman
MKR-Site
Kang Kapuk
Agit Anugrah
Maskolis
Saya mohon maaf bila dalam proses pembuatan template ini saya sering memakai kode yg dipakai oleh para blogger diatas. Dalam pembuatan template ini saya tidak ada niat untuk cloning  salah satu template dari para blogger diatas. Oleh karena itu saya mohon untuk memaklumi dan memaafkan atas kesalahan-kesalahan saya. :D
Previous
Posting Lama

88 Komentar

avatar

sobat hny 1 bulan sy berbulan2 malah, gk ada yg sy tau hny coba2 dan tny2 ke maskolis dan tny sana-sini :), maka jadilah sprti yg skrg.., puas dgn hasil keringat sendiri.., msh bnyk Ide tuk tampilan tp gk ada kemampuan.. :(

BalasHapus
avatar

nambah mantap dah blognya mas saeful :-d :-d

BalasHapus
avatar

Oh.. jadi Mas Buat template Gabungan to mas... gabungan dari template lain.. :D

BalasHapus
avatar

Ya semua itu harus belajar mas .. :D Saya yakin dulu master-master blogger juga awal memulainya juga sama seperti mas ... dari situ baru bisa berinovasi dan mulai menghasilkan karya hasil ciptaan sendiri .. :D

BalasHapus
avatar

gan tau gak cara buat blog responsif yg sesuai blog saya bisa gk ajarin :(

BalasHapus
avatar

wah hebat, ternyata mas syaeful jago juga modif2 template. ^_^

BalasHapus
avatar

semangat,,semangat,,semangat,,semangat.......

BalasHapus
avatar

sama saya juga gan, cuman berbeda waktu pengerjaannya, yg penting bangga hasil keringat sendiri. :D

BalasHapus
avatar

Makasih, blog mas juga gk kalah keren. :-d :-d :-d

BalasHapus
avatar

Ya, kurang lebih sperti itu mas. :D

BalasHapus
avatar

Sip, terima kasih atas suppornya. :D

BalasHapus
avatar

Yups, benar mas belajar dan terus belajar. Nanti dari hasil belajar itu akan membuahkan hasil yg tak diduga-duga. :D

BalasHapus
avatar

Bisa gan dg menggunakan kode seperti @media screen and (max-width:480px) {bla..bla..}, tapi saya sering menggunakan % soalnya lebih mudah dan akurat dibandingkan dg px .


Catatan :
1.Dalam membuat template responsive diperlukan kesabaran untuk mengatur kesesuaian dg media yg digunakan.
2. Sobat juga sudah harus memahami betul struktur HTML sobat, sehingga memudahkan untuk pembuatan template responsive. :-bd :-bd :-bd

BalasHapus
avatar

Makasih mas, ini juga berkat pembelajran selama ini. :D

BalasHapus
avatar

:-d :-d :-d :-d . Makasih mas Imron. :D

BalasHapus
avatar

Rajin-rajin aja belajar gan, saya yakin nanti bisa. :D

BalasHapus
avatar

gan boleh gak saya minta css tread komentar ini?
gan kirim code nya ke email saya ya? : bmaster.aditama0 [at] gmail.com

nih gan ane coba ke blog percobaan jadinya gak ada tombol reply nya?
http://bmaster23-test.blogspot.com/2013/07/test-master.html

BalasHapus
avatar

saya juga mau nanya gimana cara mengilangkan ini dari homepage saya?
ini dia gambar nya gan : http://4.bp.blogspot.com/-cycWhS_0s8I/UhsUozIPpuI/AAAAAAAABOU/gZWagC6YOT8/s1600/2013-08-26_154412.png

BalasHapus
avatar

udah saya kirim, silakan di cek.

BalasHapus
avatar

sya liat GK ada, mungkin bisa dipindah posisi htmlnya..

BalasHapus
avatar

iya itu baru saya ilangin tadi sebelumnya liat di gambar diatas
soal tread komen ane pake ya gan?

BalasHapus
avatar

oh iya cara ganti font nama komentar sama isi komentar gimana?

BalasHapus
avatar

silakan gan,. :D. Semoga lancar dalam pemasangannya.

BalasHapus
avatar

Kalau nama komentar, tambahkan aja font-family{}. Jadinya seperti ini.
.comment_name { color:#000; font-size:105%; font-weight:bold;font-family{nama font disini}; padding:0 0 3px; text-decoration:none; margin:0; text-transform:uppercase; white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
Kalau isi komentar, tambahkan font-family{} pada
.comment_body p { font-size:95% }
.

BalasHapus
avatar

udah selesai gan :) gan kok emoticon nya jadi ada kayak kotak gitu ya? gimana cara nilangin nya?

BalasHapus
avatar

wah kurang tahu tuh, mungkin background isi komentar bisa diganti dg background #eee . Jadi kotak pada emoticonnya jadi gk kelihatan. :D

BalasHapus
avatar

atau bisa install ulang emoticonnya. :D

BalasHapus
avatar

kalau ganti tanggal komentar gan dimana?
sama kok di home page blog saya cuma 9 postingan padahal di pengaturan udah saya pasang 10 postingan?

BalasHapus
avatar

kalau tanggal tambahkan font-family{} pada .comment_date{} .

Untuk masalah itu kesini aja.
http://blog.kangismet.net/2013/06/blogger-auto-pagination-dan-solusinya.html.. :D

BalasHapus
avatar

maksudnya font-family:nama font;
.

BalasHapus
avatar

sob link sudah dipasang silakan pasang balik yah :)

BalasHapus
avatar

Untuk mengurangi loading blog + cara agar blog valid HTML5. :D

BalasHapus
avatar

gan kok font di postingan saya font nya beda-beda ya? cara agar sam gimana?

BalasHapus
avatar

masksud saya font-family:nama font;, jadi .comment_date{font-family:nama font; bla..bla...}

BalasHapus
avatar

mau ganti font isi komentar gagal melulu gk berubah2 kenapa ya?

BalasHapus
avatar

emangya pengen pake font apa ?, tinggal tambahkan font-family aja. :D

BalasHapus
avatar

Nyimpennya salah gan, bukan
.comment_body p { font-size:98% };font-family:Yanone Kaffeesatz;
tapi
.comment_body p { font-size:98%;font-family:Yanone Kaffeesatz; }.

BalasHapus
avatar

kalau nama komentar gan?
hehehe maaf ngerepotin

BalasHapus
avatar

Edit bagian ini..
.comment_name { color:#000; font-size:105%; font-weight:bold; font-family:Coda; padding:0 0 3px; text-decoration:none; margin:0; text-transform:uppercase; white-space:nowrap; text-overflow:ellipsis; overflow:hidden }
Ganti Coda dg font yg diinginkan. :D

BalasHapus
avatar

gan cara ngerubah font di postingan pake kode ini ya?

.post {
box-shadow:1px 1px 5px rgba(1,1,1,.1);
background:#fff;
position:relative;
float:left;
padding:8px;
margin:0.5em auto 0.5em;
border:1px solid #fff;
}

BalasHapus
avatar

nggak ada contoh gambarnya ya mas

BalasHapus
avatar

gan boleh gak saya minta emoticon komentar nya? kirim ke email saya ya gan? makasih :D

BalasHapus
avatar

blogwalking nyari2 yg baru.. *smile

BalasHapus
avatar

keren kalau bisa mendesain template sendiri, kalau saya mah cuma bisa meredesign mas agar bisa bikin tampilan sesuai dengan keinginan saya, kalau bikin sendiri saya masih belum mampu seperti mereka

BalasHapus
avatar

Sering2 aja mendesain lama2 pasti bisa :D

BalasHapus
avatar

gk ada mas, ini cuma curhatan aja. :D

BalasHapus
avatar

Di DTE:] aja gan, ini jg hasil modifikasi dari DTE:]. :D

BalasHapus
avatar

Sma mas, dlu say jga gtu. Nanti jga bisa desain sendiri. :D

BalasHapus
avatar

mendesainya mungkin cukup singkat waktunya,, tapi mikirin style dan konsepnya yg lamaa.. ahahaaha... nice share broo..
sorrry baru mampir lagi.. udah lama ga buka kompi.. :D

BalasHapus
avatar

yah namanya juga masih newbie, jangankan mr saeful, saya sendiri aja malah keder sendiri kalau bikin template, belum css, layout, apalagi kalau template yang xml ini saya kurang ngarti ...!!! hehe

BalasHapus
avatar

sekedar tips, Download aja template yang responsive kemudian belajar kode-kodenya...

@media screen and (max-width:480px)

BalasHapus
avatar

Saya juga sama mas, hampir berbulan-bulan bikin template sendiri, udah gatau lagi brpa jumlah eksperimen yg dihasilkan :D tpi akhirnya puas juga dengan hasil berfikir dan keringat sendiri walaupun tidak sebagus pembuat template2 yg terkenal :D

*salam kenal mas :)

BalasHapus
avatar

hebat
mas bisa desain template

BalasHapus
avatar

Makin mateng jadi nta ya mas..buat kedepan nya..ngedesain template yg lain nya :)

BalasHapus
avatar

kalau saya dua2 mas, maklum masih newbie. haha :D

BalasHapus
avatar

haha bner mas, yg penting belajar terus. :-bd :-bd :-bd

BalasHapus
avatar

sma mas saya jg gk tahu sudah berpa template yg sya bongkar. haha

BalasHapus
avatar

makasih, tapi masih dalam tahap pembelajaran. :D

BalasHapus
avatar

iya mas, ini jg lagi nyoba buat template minimalis buat di share sma temen2 blogger. :D

BalasHapus
avatar

kalau saya gak pinter yang begituan om, strees liat kodi2nya.. rasa mual dan mau muntah hehehe..

BalasHapus
avatar

Pertama kali saya lihat juga begitu, namun karena sukanya sama desain blog perlahan demi perlahan saya mencoba belajar dan terus belajar hingga akhirnya bisa seperti ini.

Diawali dengan rasa suka rasanya sesulit apapun itu pasti bisa. :D

BalasHapus
avatar

haha benar juga, dikit2 mulai dari tahap awal dan cara pahami. namun sangat sulit mas

BalasHapus
avatar

yang penting tetap "Mencoba" mas dan juga jangan lupa mempraktekkannya ^_^

"Sesuatu akan terlihat mudah karena terbiasa"

BalasHapus
avatar

haha, walaupun sulit pasti nanti juga bisa. :D

BalasHapus
avatar

MasyaAlloh, keren banget nih template,...
Tp ngomong-ngomong, knapa link ane diikut sertain, ane khan masih tahap pemula...

BalasHapus
avatar

Kalau menurut saya gk mas, template buatan mas itu keren. Kan pembangunan template ini menggunakan beberapa dari template buatan Kang Kapuk.

BalasHapus
avatar

Bang,tempelate yang lama kalau tidak dipakai boleh gak saya pakai. . ? :D kalau boleh sih. . :) :?

BalasHapus
avatar

maaf sob saya tidak bisa membagikannya, karena template yang lama merupakan kerangka yang saya pakai sekarang :). Ke depannya saya coba buat template buat sobat semu. :D

BalasHapus
avatar

Okesip,yasudah saya berusaha sendiri aja agar bisa membuat tempelate seperti yg saya inginkan, , :D

maaf ya sob,sudah lancang. . :)

BalasHapus
avatar

mas saya tertarik dengan header punya mas ...
boleh minta kode kodenya ga ??

bisa PM ke idcasual28@gmail.com ...

BalasHapus
avatar

mas, alat2 yg dipakai untuk bikin template apa2 aja mulai dari design, ampe pengaplikasian?

BalasHapus
avatar

Saya sendiri lebih suka manual tanpa penggunaan software. Namun, saya juga sering gunakan beberapa tools dalam pembuatan template

Baca : [url="http://saeful13.blogspot.com/2013/10/alat-dan-web-untuk-modifikasi-blog.html"]Alat dan Web Untuk Modifikasi Blog[/url]

BalasHapus
avatar

maksudnya manual? memakai text editor maksudnya? :D

BalasHapus
avatar

nulis coding langsung di HTML Editor blogspot.

BalasHapus
avatar

jadi? setiap kali ngedit disave kalo kurang diedit lagi trus save? apakah tidak memakan banyak kuota mas?

BalasHapus
avatar

itu resikonya sob, tapi ada juga software buat template seperti bootstrap. Berhubung saya sendiri belum mengerti jadi pengerjaannya manual :D

BalasHapus
avatar

hahaha :D, tks sob dah nyedian waktu buat jwb ni pertanyaan. salam kenal ya sob :D

BalasHapus
avatar

sama - sama gan, salam kenal juga :)

BalasHapus

Catatan:
• Dilarang menulis link aktif!
• Dilarang ngiklan di kolom komentar!
• Untuk menyisipkan kode pendek, gunakan tag <i rel="code"> ... KODE ... </i>
• Untuk menyisipkan kode panjang, gunakan tag <i rel="pre"> ... KODE ... </i>
• Untuk menyisipkan catatan, gunakan tag <b rel="quote">.. TEKS ... </b>
• Untuk menyisipkan gambar, gunakan tag <i rel="image"> ... URL GAMBAR ... </i>

Sebelum menyisipkan kode silahkan gunakan Tool Konversi Kode terlebih dahulu untuk menampilkan kode tersebut pada kolom komentar

Konversi Kode OOT

About | Contact | Forum | Sitemap | Privacy
© Copyright 2013 Saeful13 | Asuransi Kesehatan Terbaik Indonesia - All Rights Reserved