Responsive Style Template Thesis For Blogspot

on 11 Jan 2013

Tutor Responsive Thesis Blogger Template ini hanyalah sekedar ujicoba untuk mengkaji Template Thesis For Blogspot ini sememangnya User Friendly. Setiap bagian dari template ini mudah dikenali dan dimodifikasi hanya dengan CSS sederhana tanpa memerlukan kemampuan khusus dalam bidang coding.

Saya telahpun mencoba untuk menjadikan template thesis ini menjadi responsive yang dapat menyesuaikan tampilan blog sesuai dengan ukuran layar browser.

DEMO : Muslim Blog


SCREENSHOT:

Muslim Blog
Standart View
Responsive Muslim Blog
Responsive View


Untuk membuat Template Thesis For Blogspot Anda menjadi Responsive, silahkan bubuhkan script CSS ini diatas ]]></b:skin>

Coding CSS ini hanyalah "UJICOBA" semata, dan masih belum sempurna. Bagi Anda yang mencoba coding ini, Kami tidak bertanggung jawab terhadap segala hal yang disebabkan oleh coding ini.

@media screen and (max-width:959px){
body{width:100%;margin:0 auto}
.headerleft{width:90%;float:none;margin:0 auto;display:block}
.headerright{width:90%;float:none;margin:0 auto;display:block}
.nav-wrap,#header-wrapper{width:100%;margin:0 auto;text-align:center}
#header-wrapper{height:150px}
#sidebar-wrapper{width:32.75%;float:right;margin:0 auto}
#main-wrapper{width:60.025%;float:left;margin:0 auto;padding-left:0}
#head,.menuhorizontal,#content-wrapper,#outer-wrapper,#footer-wrapper,#credit{width:87.25%;margin:0 auto}
.comment-form{max-width:100%}
.comments{width:100%;margin:0 auto;padding:0 auto}
.credit span{display:block;text-align:center}
.credit .cr{float:none;margin-left:0}
.credit .dev{float:none;margin-right:0}
}

@media screen and (max-width:758px) {
#main-wrapper{width:100%;float:none;margin:0 auto;border-right:none}
#sidebar-wrapper{width:100%;float:none;margin:0 auto}
#menuhorizontal li a{border:1px solid #ccc;display:inline-block;float:none;width:100%;text-align:center;padding: 10px 0;font-size:2.5em}
.iklan-kanan{display:none}
}

@media screen and (max-width:524px) {
#commentBodyField{width:94.5%}
}
5

{ 52 comments... read them below or add one }

  1. like this,,,,mantabs kk... (y)

    ReplyDelete
    Replies
    1. Gak ada garansi yo, Mas :D

      Silahkan diujicoba dulu di blog lain sebelum diterapkan di blog utama ;)

      Delete
    2. seharusnya udah bisa mas,,, tp krena blog saya udah di custom jadi letak gambar+sliderku jadi gak pas.... ^_^

      Delete
    3. Sebaiknya blog bisnis jangan di modif terlalu extreme mas :D

      Delete
  2. ya mas gie mana saya bisa download theme ini... link downloadnya sudah tidak boleh guna lagi

    ReplyDelete
    Replies
    1. Please try this link to download it, Bro:

      https://www.box.com/s/nz1mzhbcb412nth0m55g

      Delete
    2. terima kasih bro...segalanya berjalan dengan lancar... :)

      Delete
    3. Alhamdulillah. Kembali kasih. Semoga bermanfaat.

      Delete
    4. bro muslim, link downloadnya ilang :( kemarin dah download tp lupa nruh..hehehe..

      Delete
  3. Replies
    1. Alahai bro :D

      Responsive ujicoba yang saya buat ni belum 100% perfect la, ternyata masih ada scrolling bar ketika hendak berubah ke max-width:959px

      Delete
  4. mudahan ianya cepat 100% perfect..boleh coba nanti ya..

    ReplyDelete
  5. Semoga percubaan ini bisa jadi yang terbaik utk digunapakai.

    ReplyDelete
  6. Terbaik! :D

    Memang bagus templatenya.

    ReplyDelete
    Replies
    1. Terimakasih Bro Danial Abdul Rahim :)

      Delete
  7. tumpang tanya, kenapa bila pasang template nie, blog saya jadi ada iklan adsense sedangkan saya tiada akaun adsense?
    tq

    ReplyDelete
    Replies
    1. Maaf bro, itu adsense saya. saya lupa untuk menghapusnya :)

      Tetapi jangan khawatir, sebab adsense tu dah tak kan muncul lagi :)

      Delete
  8. http://www.facebook.com/pages/World-Prelaunch-Brasil/217384591734817

    ReplyDelete
  9. mas yanfidz..kalo boleh sharing templatenya dung, link diatas udah broken.. ^_^ makasiih

    ReplyDelete
  10. Replies
    1. Hahaha, master mengoreksi nih critanya?

      Delete
  11. boleh cuba nanti..dah perfect ke

    ReplyDelete
  12. templatenya keren nih.. ijin donlot ya...

    HCBN Indonesia

    ReplyDelete
  13. sip juragan, jadi hanya menambah kode itu, sya pikir template baru, tpi ak kog tidak srek bagian bawahnya ya, trima kasih

    ReplyDelete
  14. mantap kang,lebih cepat loadnya.fersinya sudah fix?.ane coba dulu aj mas

    ReplyDelete
  15. Macam mana nak buat auto readmore dgn template V.2? bleh ke ksih support? Thank's!

    ReplyDelete
  16. memang best Lah ney Template... 100% SEO

    ReplyDelete
  17. takde update template baru ke

    ReplyDelete
  18. terimakasih atas sharenya tuk
    jom mampir ke blog saya punya di cepatku terkini

    ReplyDelete
  19. bro...bila nak keluar template baru?

    dah ketagih dah ne nak template baru, v3 hehehe

    ReplyDelete
    Replies
    1. Dev nya bilang Januari 2014 baru di release. So wait je la

      Delete
  20. Terima kasih diatas templatenya.

    ReplyDelete
  21. Thanks for sahring this!!! (essaymarket co uk) I would like to see mor epost like this!

    ReplyDelete
  22. Great to read!!!! "www masterpapers com" Thanks for this!

    ReplyDelete
  23. Menghormati budaya adalah dorongan pada kecerdasan emosional Anda . secara online-essay-writer.org Anda tumbuh menjadi orang dengan moral dan etika .

    ReplyDelete
  24. Ya saya tahu tentang konferensi ini dan banyak orang terinspirasi setelah menghadiri konferensi ini , saya secara online-essay-writer.org mendengar bahwa begitu banyak hal yang informatif dan menarik diceritakan oleh pembicara dalam konferensi .

    ReplyDelete
  25. bro...bila nak keluar template baru? HTML5 plak hehe

    ReplyDelete
  26. Terima kasih diatas templatenya.

    ReplyDelete
  27. For complete guidance about THESIS including SPSS software work. Please visit:
    http://www.makethesis.blogspot.com

    ReplyDelete
  28. kalau mau download tamplate ini bagaimana ya??
    Mebel Jepara,

    ReplyDelete

Spamming will report.