Rivai Silaban

20.03
Rivai Silaban

Rivai Silaban

free template blogspot PARBADA

Posted: 04 Mar 2014 03:43 AM PST

Free template blogspot PARBADA - free template blogspot PARBADA merupakan template blogspot categori bisnis. free template blogspot PARBADA ini memiliki fitur kolom layout yang dapat mendukung bisnis anda dalam menampilkan link link bisnis anda.

Profil free template blogspot PARBADA

  1. Nama :PARBADA
  2. Category : Bisnis Template
  3. Style : Elegan Template
  4. size : 100 KB
  5. Update : Senin 03 Maret 2014
  6. owner : Rivai Silaban
  7. Design : www.rivai.org
  8. Publish : www.ideblogspot.com
  9. Powered : Blogspot
  10. Type : Free Template
  11. Link Tipo Black:http://www.template9.ideblogspot.com/

Demo

Fitur free template blogspot NAULI

  1. Loading Fast
  2. Dynamik Title Heading
  3. Search
  4. Social media
  5. Subscribe
  6. 6 kolom layout header
  7. 1 kolom layout sidebar ( 1, 2, 1 )
  8. 1 kolom layout Blog Post ( blog1 )
  9. 5 kolom layout footer
  10. Label style
  11. Space Iklan 125 x 125
  12. Related post
  13. Popular Post
  14. Credit Link
  15. Breadcrumbs
  16. Thread Comment & Icon admin
  17. Pesan Komentar
  18. snippet home page system
  19. Vcard Author
  20. Counter Comment
  21. Blog Pager link
  22. Font Awesome CSS
  23. Box author
  24. dll

Silahkan anda lihat dan cek untuk memastikan fitur dan kemampuan free template blogspot PARBADA ini. Untuk melihat link downloadnya silahkan kunjungi halaman dibawah ini.

http://www.ideblogspot.com/2014/03/free-template-blogspot-parbada.html

http://feeds.feedburner.com/RivaiSilaban
Read More

Rivai Silaban

20.03
Rivai Silaban

Rivai Silaban

tutorial footer style ide blogspot v1

Posted: 03 Mar 2014 03:40 AM PST

Footer style ide blogspot v1 - footer style ide blogspot v1 merupakan desain footer dari Ide Blogspot untuk platform Blogspot. Tutorial cara membuat footer style ide blogspot v1 akan saya bahas dalam postingan kali ini. Untuk melihat bagaimana tampilan footer style ide blogspot v1 ini silahkan klik demo dibawah kemudian pada halaman blog PARBADA ( halaman demo ) silahkan lihat bagian footernya, nah bila anda tertarik silahkan simak tutorial dibawah ini...

Demo

Install code footer style ide blogspot v1

  1. Login ke dashboard anda
  2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
  3. Cari code ]]></b:skin> ataupun code </style> pada template blogspot anda.
  4. Kemudian Cari code yang bersangkutan dengan code CSS " Footer " kemudian hapus sampai semua code CSS Footer yang lama benar benar tidak ada lagi.
    Perlu anda pahami bahwa tutorial ini mengganti semua element ataupun tampilan footer blogspot anda, jadi hal pertama yang anda lakukan adalah menghapus semua code yang bersangkutan dengan footer blog anda sebab kita akan mengganti dengan style footer yang baru yaitu footer style ide blogspot v1
  5. Setelah semua code CSS yang bersangkutan dengan footer template anda terhapus kemudian copy code CSS footer style ide blogspot v1 dibawah ini lalu pastekan sebelum code ]]></b:skin> ataupun code </style> kemudiansave template anda.

/**************************
Name : footer style ide blogspot v1
Update : Senin 03 Maret 2014
Design : Rivai Silaban
Site : www.rivai.org
Publish : www.ideblogspot.com
**************************/
#footer-wrapper {width: 100%;clear: both;margin: 0px;padding: 0px;background: none repeat scroll 0% 0% rgb(27, 41, 65);}
#footer-wrapper h3, #footer-wrapper h4 {border-bottom: 2px dotted #666;font-family: Georgia;font-size: 13px;color: rgb(153, 153, 153);font-style: normal;font-weight: bold;text-shadow: 1px 2px 2px rgb(0, 0, 0);line-height: normal;margin: 10px 0 0 5px;padding-bottom: 10px;text-transform: none;text-align: left;}
#footer-wrapper .credit-link {font-size: 10px;font-family: Verdana;color: #999;text-align: center;line-height: 25px;background: none repeat scroll 0% 0% rgb(13, 20, 32);}
#footer-wrapper .credit-link a{color: rgb(153, 153, 153);text-decoration: none;}
#footer-wrapper .credit-link a:hover{color: #f7f7f7;}
#footer1, #footer2, #footer3 {width: 30%;padding: 5px;float: left;margin: 5px 12px;}
.footer {margin: 0px;padding: 0px;}
.footer ul {margin: 0px 13px;padding: 0px;width: 30%;float: left;}
.footer ul li {margin: 0px;padding: 8px 0;list-style: none;border-bottom: solid 1px #444;}
.footer li {font-size: 12px;font-family: arial;color: #999;}
.footer li a {font-size : 12px;font-family : arial;text-decoration : none;color :rgb(153, 153, 153);margin-bottom : 5px;}
.footer li a:hover {color : #f7f7f7;}
.ide-blogspot {width: 100%;margin:0;padding:0;}
#footer-wrapper .widget {color: #999;font-family: Arial;font-size: 12px;padding: 5px 15px;line-height: normal;}
.bagian {width: 95%;padding: 0px;margin: 0px auto;}
.bagian .idekiri {width: 68%;padding:0;margin:0;float: left;}
.bagian .idekanan {width: 30%;padding:0;margin:0;float: right;}
.tombol a {float: right;margin: 20px 0px 0px;padding: 5px 20px;background: #249FEA;color: #fff;text-shadow: 0 0 2px #000;border-radius: 5px;font-weight: bold;}
.tombol a:hover {background: #2B5B84;color: #999;}
.contacts h5, .contacts h6 {
font-family: Georgia;
font-size: 13px;
color: rgb(153, 153, 153);
font-style: normal;
font-weight: bold;
text-shadow: 1px 2px 2px rgb(0, 0, 0);
line-height: normal;
margin: 10px 0 0 5px;
padding-bottom: 10px;
text-transform: none;
text-align: left;}
.contacts{color: #999;font-family: Arial;font-size: 12px;padding: 5px 15px;line-height: normal;}
.bagian {width: 95%;padding:2%;margin:0;}
.contacts ul {margin: 0px 0 5px 10px;padding : 0;width: 100%;}
.contacts ul li {margin: 0px;padding: 2px 2px;list-style: square;border-bottom: none;}
.contacts li {font-size: 12px;font-family: arial;color: #999;}
/*** footer style ide blogspot v1 end css ***/

Setelah anda memasang CSS footer style ide blogspot v1 ini pada template anda, saatnya kita menampilkan kolom layout footer style ide blogspot v1 ini dengan menggunakan kode html dibawah. Untuk memasang code html footer style ide blogspot v1 ini anda juga perlu menghapus semua code html yang bersangkutan dengan code html Footer template anda. Hapus semua code footer template anda mulai dari code footer tag pembuka seperti contoh code <div id='footer-wrapper'> s/d </div> code footer tag penutup template anda. Mungkin dibeberapa code template credit link template tidak satu element dengan footer template, jadi untuk sementara silahkan hapus juga semua code credit linknya sebab kita sudah menyertakan code credit linknya yang nantinya akan anda rubah linknya sehingga seperti semula. Setelah semua code html footer template blog anda sudah bersih atau dihapus, silahkan copy code tag html footer style ide blogspot v1 dibawah ini dan pastekan kembali ketempat semula code footer template blogspot anda yang telah anda hapus sebelumnya. Save template anda, kemudian lihat hasilnya pada bagian " Tata Letak " dasbord template anda.

<div id='footer-wrapper'>
<!-- footer style ide blogspot v1 start -->
<div class='bagian'>
<div class='idekiri'>
<!-- footer kiri ide Blogspot -->
<b:section class='footer' id='footer-kiri' showaddelement='yes'>
<b:widget id='HTML55' locked='false' title='foter kiri' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
<div class='idekanan'>
<!-- footer kanan ide Blogspot -->
<b:section class='footer' id='footer-kanan' showaddelement='yes'>
<b:widget id='HTML66' locked='false' title='footer kanan' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
</div>
</div><div style='clear:both'/>
<div class='ide-blogspot'>
<!-- footer 1 ide Blogspot -->
<b:section class='footer' id='footer1' showaddelement='yes'>
<b:widget id='HTML77' locked='false' title='footer 01' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- footer 2 ide Blogspot -->
<b:section class='footer' id='footer2' showaddelement='yes'>
<b:widget id='HTML88' locked='false' title='footer 02' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- footer 3 ide Blogspot -->
<b:section class='footer' id='footer3' showaddelement='yes'>
<b:widget id='HTML99' locked='false' title='footer 03' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h3><data:title/></h3>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:includable>
</b:widget>
</b:section>
</div><div style='clear:both'/>
<!-- Footer Credit Link ide blogspot -->
<div class='credit-link'>
Copyright &#169; 2014 <a expr:href='data:blog.homepageUrl' expr:title='data:blog.title' rel='nofollow'><data:blog.title/></a>
| Template by : <a href='http://www.ideblogspot.com' target='_blank' title='Template Owner'>
Rivai Silaban
</a>
</div><!-- footer style ide blogspot v1 start -->
</div><div style='clear:both;'/>



Untuk mendapatkan code isi dari widget footer style ide blogspot v1 dan informasi pemasangan widgetnya silahkan kunjungi link halaman dibawah ini..
Sumber : http://www.ideblogspot.com/2014/03/footer-style-ide-blogspot-v1.html

http://feeds.feedburner.com/RivaiSilaban
Read More

Rivai Silaban

20.05
Rivai Silaban

Rivai Silaban

Tutorial menampilkan post date diwaktu yang sama

Posted: 01 Mar 2014 11:05 PM PST

Tutorial menampilkan post date diwaktu yang sama, tutorial menampilkan post date diwaktu yang sama merupakan suatu trik untuk menampilkan tanggal postingan pada hari yang bersamaan pada setiap postingan blogspot. Secara devault tanggal postingan blogspot tidak akan muncul bilamana kita memposting 2 atau bahkan lebih artikel yang telah kita posting pada saat itu (waktu yang ditampilkan hanya pada salah satu postingan). Postingan kali ini terinspirasi dari seorang sahabat blogger saya yang menanyakan tentang tapilan post date pada setiap template Ide Blogspot yang telah dipublish.

Buat seorang blogger memang hal ini ( tutorial menampilkan post date diwaktu yang sama )perlu juga diketahui dimana setiap postingan tersebut memiliki tanggal Update yang muncul pada setiap postingan. Pada dasarnya Post date ini sangat diperlukan oleh data markup search engine untuk menentukan tanggal update postingan artikel yang telah kita posting. Tehnik ini juga akan membantu perayapan pada sistem mesin pencari ditambah dengan pasilitas Vcard pada postingan tersebut. Untuk menjaga post date tidak sama dengan data Update Vcard anda sebaiknya melalukan sedikit settingan di dasbord blogspot anda, dimana kita akan memisahkan, bahwa untuk post date kita akan membuat format tanggal, bulan dan tahun, sedangkan untuk Vcard kita akan membuat format waktu ( time ). Jadi kedua sistem tersebut akan saling berhubungan dimana sistem search engine akan mendeteksi waktu dan tanggal postingan itu secara bersamaan. Memang saya akui trik ini masih banyak yang belum mengetahui tapi kali ini saya menjelaskan hal tersebut agar setiap blogger lebih memahami antara fungsi post date, Vcard yang bergubungan dengan sistem Crawls pada mesin pencari. Untuk menampilkan post date diwaktu yang sama pada postingan blog anda silahkan simak pemjelasan dibawah ini, untuk melihat demonya silahkan klik icon demo dibawah ini.

Demo

  1. Login kedasbord Blogspot anda
  2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
  3. Cari code seperti dibawah ini :

    <b:if cond='data:post.dateHeader'>
    <h2 class='date-header'><data:post.dateHeader/></h2>
    </b:if>

  4. Setelah ketemu silahkan ganti code tersebut dengan code dibawah ini :

    <b:if cond='data:post.dateHeader'>
    <script>var ultimaFecha = &#39;<data:post.dateHeader/>&#39;;</script>
    <h2 class='date-header'><data:post.dateHeader/></h2>
    <b:else/>
    <h2 class='date-header'>
    <script>document.write(ultimaFecha);</script>
    </h2>
    </b:if>

  5. save template anda, dan lihat hasilnya...

Untuk mensetting tutorial menampilkan post date diwaktu yang sama dengan sistem Vcard time Update silahkan kunjungi halaman dibawah ini..
Sumber : http://www.ideblogspot.com/2014/03/menampilkan-post-date-diwaktu-yang-sama.html

http://feeds.feedburner.com/RivaiSilaban
Read More
Langganan: Komentar (Atom)