whois Idwebhost.com

01.34
whois Idwebhost.com

whois Idwebhost.com

whois Idwebhost.com

Posted: 18 May 2014 05:23 AM PDT

Domain Name: IDWEBHOST.COMRegistry Domain ID: Registrar WHOIS Server: whois.resellercamp.comRegistrar URL: Updated Date: 24-Dec-2013Creation Date: 14-Jan-2004Registrar Registration...

[[ This is a content summary only. Visit my website for full links, other content, and more! ]]
Read More

Rivai Silaban

21.47
Rivai Silaban

Rivai Silaban

fungsi mode html pada menu entri baru blogspot

Posted: 12 May 2014 10:44 AM PDT

Fungsi mode html pada menu entri baru blogspot - atau kinerja fungsi mode html pada menu entri baru blogspot merupakan bagian penting yang harus diketahui para blogger mania. fungsi mode html pada menu entri baru blogspot pada kinerjanya berfungsi untuk menempatkan sebuah code dalam sebuah postingan agar lebih bekerja secara maksimal dan dapat diterjemahkan oleh pengkodean HTML dengan sempurnah. Secara devault bila kita menginginkan pemasangan suatu code berbasis HTML ataupun Javascript dan lain lain, kita akan memerlukan fungsi mode html pada menu entri baru blogspot ini agar code dapat dengan maksimal diterjemahkan.

Buat seorang blogger mode ini sangat membantu dalam menangani soal pengkodean pada sebuah postingan. Untuk menggunakan mode ini dalam platform Blogspot adalah :

  1. Login ke dasbor
  2. Klik " Entri Baru "
  3. Pada halaman " Entri Baru " silahkan pilih mode " HTML " pada bagian sebelah kiri halaman
  4. Pastekan code HTML, script atau sejenisnya dan save kemudian lihat hasilnya...

fungsi mode html pada menu entri baru blogspot berbeda dengan mode " Compose " Pada halaman Entri Baru Blogspot, bila dalam mode compose hanya fungsi text maka didalam mode HTML kita dapat memanfaatkan code HTML untuk diterjemahkan lebih maksimal, dibawah ini ada beberapa contoh penulisan atau fungsi mode html pada menu entri baru blogspot tersebut.

Contoh tulisan yang berfungsi dan hanya berupa text

" Ini adalah sebuah artikel postingan "

Contoh penulisan kalimat diatas pada fungsi mode html akan diterjemahkan dengan baik , dan tulisan tersebut hanya sebatas text biasa tanpa memiliki style HTML.

Contoh tulisan dan code yang berfungsi untuk diterjemahkan kedalam bentuk text dengan memakai style CSS pada HTML

" <div style="float:right"> Ini adalah sebuah artikel postingan </div> "

Contoh penulisan diatas bila diterjemahkan dalam HTML adalah bahwa postingan kalimat diatas akan berada di sebelah kanan halaman karena diakibatkan oleh fungsi " style="float:right" " ( baca fungsi float pada HTML ) dan code diatas tidak akan muncul , melainkan fungsi atau perintah code tersebut akan dilaksanakan atau diterjemahkan sehingga tulisan kalimat tersebut akan berada di sisi bagian kanan halaman.

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

Rivai Silaban

21.56
Rivai Silaban

Rivai Silaban

fungsi compose pada menu entri baru blogspot

Posted: 09 May 2014 09:36 PM PDT

Fungsi compose pada menu entri baru blogspot atau kinerja dan fungsi compose pada menu entri baru blogspot wajib dipahami seorang blogger mania. fungsi compose pada menu entri baru blogspot pada prakteknya adalah tempat untuk membuat suatu postingan blogspot yang berbasis text atau tulisan. fungsi compose pada menu entri baru blogspot ini hanya dapat kita gunakan untuk membuat suatu text dan bukan suatu code, fungsi compose pada menu entri baru blogspot berbeda dengan fungsi html pada menu entri baru blogspot dimana fungsi ini merupakan kebalikan dari fungsi compose pada menu entri baru blogspot tersebut.

Pada kinerjanya bila seorang blogger membuat suatu postingan yang berbentuk suatu text ( bukan suatu code HTML/CSS yang dapat berfungsi ) maka sistem mode Compose pada menu entri baru Blogspot merupakan mode yang harus dipakai. Secara khusus Blogspot memberikan 2 fungsi mode dalam membuat suatu postingan pada platform tersebut dan memiliki perbedaan perbedaan tersendiri, hal ini dilakukan untuk memberikan kebebasan kepada member platform tersebut. ada beberapa contoh penulisan yang berfungsi dan tidak berfungsi dalam fungsi compose pada menu entri baru blogspot ini.

Contoh tulisan yang berfungsi

" Ini adalah sebuah artikel postingan "

Contoh penulisan kalimat diatas pada fungsi mode compose akan diterjemahkan dengan baik , sebab tulisan pada contoh tersebut merupakan sebuah text biasa atau hanya berbasis text dan bukan merupakan sebiah code.

Contoh tulisan yang tidak berfungsi

" <div style="float:right"> Ini adalah sebuah artikel postingan </div> "

Contoh penulisan diatas bila diterjemahkan dalam HTML adalah bahwa postingan kalimat diatas akan berada di sebelah kanan halaman karena diakibatkan oleh fungsi " style="float:right" " ( baca fungsi float pada HTML ) tapi pada kenyataannya bila kita memakai metode Compose maka code HTML pada contoh diatas akan diterjemahkan seperti penulisan aslinya atau tulisan apa adanya tanpa ada pengaruhnya.

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

Rivai Silaban

21.17
Rivai Silaban

Rivai Silaban

cara membuat box keterangan code

Posted: 08 May 2014 09:44 PM PDT

Cara membuat box keterangan code - tutorial cara membuat box keterangan code pada halaman blogspot. Tutorial cara membuat box keterangan code pada halaman blogspot ini merupakan fitur penting pada halaman blogspot yang menyajikan tutorial atau sejenisnya. Tutorial cara membuat box keterangan code ini terinspirasi dari seorang teman yang menginginkan pemasangan code untuk keperluan keterangan code pada halaman blogspotnya.

Pemasangan code pada cara membuat box keterangan code di halaman blogspot ini dipasang secara manual, hal ini dilakukan agar halaman Blogspot lebih berkesan elegan dan profesional. Untuk melihat tampilan cara membuat box keterangan code di halaman blogspot ( melihat tutorial nya secara detail ) silahkan klik link dibawah lihat dibagian bawah postingan pada halaman.

Pasang code script dibawah ini didalam code CSS template anda.

Code CSS here..


/*****************************************
Name : cara membuat box keterangan code
By : rivai.org | ideblogspot.com | Blog Design
Update : Jumat, 09 Mei 2014
******************************************/
.boxkets {border:dashed #333 2px;padding:8px;background-color: #E9F4FC;width: 95%;margin:0 auto;}
.rivaisilaban-titlekets {
position: relative;
padding: 5px;
margin: 20px 0px;
color: #FFFFFF;
width: 20%;
text-align: center;
text-shadow: 1px 1px 1px rgb(0, 0, 0);
color:#FFFFFF;
font-weight:bold;
background-color: #525252;
}
.rivaisilaban-titlekets:before {
content:"";
display:block;
position:absolute;
bottom:-20px;
left:40px;
width:0;
height:0;
border:0;
border-right-width:30px;
border-bottom-width:20px;
border-style:solid;
border-color:transparent #525252;
}
/* cara membuat box keterangan code */


Code HTML here..


<!-- cara membuat box keterangan code start -->
<div class="rivaisilaban-titlekets">Keterangan Code </div>
<div class='boxkets'>
<p>Lihat bagian code HTML yang berwarna MERAH, silahkan anda ganti dengan code link social media anda sesuai dengan title social medianya.</p>
<p>Code cara membuat social media di blogspot valid HTML 5, CSS 3 dan fast loading, bila anda memasang di widget yang baru anda jangan lupa untuk menghapus logo edit ( obeng dan tang ) agar widgetnya juga valid.. salam Blogspot </p>
</div><!-- cara membuat box keterangan code end -->


Bila anda masih belum memahami tata cara membuat box keterangan code pada halaman blogspot ini, silahkan kunjungi halaman sumbernya, semoga bermanfaat..
Sumber : http://www.ideblogspot.com/2014/05/cara-membuat-box-keterangan-code.html

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

Rivai Silaban

21.45
Rivai Silaban

Rivai Silaban

widget social media scale di blogspot

Posted: 30 Apr 2014 09:55 AM PDT

Widget social media scale di blogspot - cara membuat widget social media scale di blogspot pada blogspot atau tutorial membuat widget social media scale di blogspot. Sobat blogger kali ini saya posting artikel widget social media scale di blogspot yang terinspirasi dari email seorang sahabat yang membutuhkan widget social media scale di blogspot ini untuk dipasang di halaman blogspotnya. widget social media scale di blogspot ini tergolong lebih sederhana dan lebih simpel dengan memiliki code yang ringan. Untuk melihat tampilan widget social media scale di blogspot pada tutorial kali ini silahkan kunjungi link demo dibawah ini, nah bila anda tertarik silahkan simak tutorial dibawah ini...

Demo

Pasang code script dibawah ini didalam code CSS template anda.

Code CSS here..


/*****************************************
Name : widget social media scale
By : Rivai Silaban | Ide Blogspot | Blog Design
Update : Rabu 30 April 2014
*****************************************/
.rivaiblog{
list-style-type:none;
margin:0;
padding:0;
}
.rivaiblog li{
display:inline;
width: 60px;
height:60px;
}
.rivaiblog li img{
width: 32px;
height:32px;
border:0;
margin-right: 4px;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
}
.rivaiblog li img:hover{
-moz-transform:scale(1.3);
-webkit-transform:scale(1.3);
-o-transform:scale(1.3);
}/*** widget social media scale ***/


Pasang code script dibawah didalam widget blog anda

Code HTML here..


<!-- widget social media scale code start -->
<ul class="rivaiblog"><li><a href="https://www.google.com/+RivaiSilaban"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUARH84gzMTDyCmSkezvvZHreRj41XZgmrzJbyB7u5Fwcnb_Lt1FQHLu-XU1eANI1Bi8h7Nc56CiiUJAPmSz1Mnkyb451ugtzpmB1nvgF7ONDrQbC8EY1bs_2WAloVSPyZeeFPPWbIv8g/s1600/gplus5.png " title="Join to Gplus" /></a></li>
<li><a href="https://www.facebook.com/rivaisilaban"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdzl1UU0jW1sqk3ESb5Lrp5VeCgiMcXjirf4NoaMF6HQ-N6J3GZwBaQQ-wnNJbcaT8ZaDgJLHURrrAIBd3MjkTI2iU5N4hYEI9x-07lgsr8nNtsWwD06byuWdZt6Lxm_oNG7yE4iFzx6Y/s1600/fb5.png " title="Add to Facebook" /></a></li>
<li><a href="http://www.twitter/Rivai_Silaban"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1ZLMa_TwAuw4ZypMHYc-3sMklujip1WmyR4P9waew7phlsi8DshBNJZubrjJRJqkVLRzL0JBi-S0Pk0k7h601urQI3CwRmjxayCz2Yy0jwrCWaE5SIvLveYHW-TYnDgmuRPaYPPVEaqs/s1600/twit5.png " title="Follow Twitter" /></a></li>
<li><a href="http://feeds.feedburner.com/idblogspot"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg11oIQnVeUKvOmKhbBeagzBj2RvBU4nL7slrFmvdTKzFG4_wQq13WWeDZyOqsHEof3DByy7doEy047f1at5qHjFaIcyFRU_esm6CrczJtAXq_rmqviWJD0W0EEq6vC3LbrQJ_NQcR-unM/s1600/rss5.png" title="RSS" /></a></li>
<li><a href="http://www.blogger.com/follow-blog.g?blogID=5055362939739660258"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgarvJQrk4IEc9Qb72yKOgXB-zMA5_laMnzSwBxyhKou8FK1pS_Hmu-L5Bow1xU6Fu-p-vY18XJRfYS5ezsH6a4UI_m7e666AkHivM0i24e40fx7MxgiskdeD4DrE5IMXhGVD32qEi_0Vc/s1600/BB.gif" title="Join to Blog" /></a></li>
</ul>
<!-- widget social media scale code end -->


Bila anda masih belum memahami tata cara pemasangan cara memasang widget social media scale di blogspot ini silahkan kunjungi halaman sumbernya, semoga bermanfaat..
Sumber : http://www.ideblogspot.com/2014/04/widget-social-media-scale.html

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

Rivai Silaban

21.23
Rivai Silaban

Rivai Silaban

fungsi float pada html

Posted: 27 Apr 2014 08:43 PM PDT

Fungsi float pada html - kegunaan atau fungsi float pada html sangat diperlu diketahui, fungsi float pada html ini sangat mempengaruhi tata letak pada desain HTML, khususnya platform blogspot. fungsi float pada html pada blogspot dalam prakteknya adalah untuk menentukan letak suatu widget, gambar dll dalam situasi letak kekanan, ketengah dan kekiri. fungsi float pada html dituliskan dalam pengkodean CSS pada template blogspot.

Dalam kinerjanya pada struktur CSS Float berfungsi untuk memberikan suatu efek tata letak pada sebuah widget dalam blogspot, contoh penulisan Float dalam CSS pada pengkodean HTML adalah sebagai berikut :

Float Right ( letak suatu benda berada disebelah kanan ) : Penulisan code Float Right pada struktur CSS dalam HTML adalah element { float:right; } yang memiliki arti dalam platform Blogspot bahwa suatu widget akan berada pada letak sebelah kanan dalam tampilannya. Para programmer blogspot memakai fungsi code ini untuk meletakkan suatu widget atau aplikasi lain pada sebelah kanan halaman untuk tampilannya.

Float Center ( Letak suatu benda berada ditengah ) : Penulisan code Float Center ini pada struktur CSS HTML adalah element { float:center;} yang memiliki arti dalam blogspot bahwa suatu widget atau aplikasi lain akan berada pada posisi tengah pada sebuah tampilan halaman. Saat ini fungsi Float Center ini tidak valid lagi terhadap HTML5 sebab sudah mengalami perubahan code pada HTML5 pada saat artikel ini ditulis.

Float Left ( Letak suatu benda berada disebelah kiri ) : Penulisan code Float Left ini pada struktur CSS HTML adalah element { float:left; } yang memiliki arti dalam platform Blogspot bahwa suatu widget akan berada pada tata letak sebelah kiri dalam sebuah tampilannya, atau berlawanan arah dengan code Float Right.

Untuk melihat fungsi float pada html dan beberapa contoh lainnya dalam penerapan code CSS, silahkan kunjungi http://www.ideblogspot.com/2014/04/fungsi-float-pada-html.html

http://feeds.feedburner.com/RivaiSilaban

fungsi style clear both

Posted: 26 Apr 2014 11:36 PM PDT

Fungsi style clear both - penerapan fungsi style clear both pada blogspot/blogger atau kegunaan dan fungsi style clear both pada template platform blogspot. Pada prakteknya fungsi style clear both adalah memberikan ruang kosong sebagai pembatas code sebelumnya dan setelahnya. Dalam kinerja platform blogspot atau blogger hal fungsi style clear both ini sangat diperlukan dimana kita dapat membuat suatu pembatas code yang tidak akan mempengaruhi code yang lainnya pada template. Kegunaan lainnya yang dapat kita rasakan sebagai fungsi style clear both ini adalah sebagai penutup semua code yang berada sebelumnya agar tidak mempengaruhi code yang berada dibawah code sebelumnya.

Pada postingan artikel kali ini saya memposting pembahasan ini sebab fungsi style clear both sangat berguna sekali, bagi pemula hal ini sangat dibutuhkan, agar tampilan blognya tetap rapi dan lebih profesional. Dalam penerapannya fungsi style clear both ini memang sangat sederhana tapi memiliki banyak arti. Penulisan code fungsi style clear both ini pada HTML adalah sebagai berikut :

<div style="clear:both"/> atau
<p style="clear: both"/> atau
<span style="clear: both"/>



Dimana setiap type style yang berada sebelum code diatasnya akan ditutup atau terhapus pada saat code stylenya dituliskan. Pemakaian fungsi style clear both sering dijumpai penulisannya dengan karakter code <div> walaupun code tersebut dapat kita tuliskan dengan kode karakter lainnya seperti <p> , <span> dll pada umumnya. Jadi dalam prakteknya <div style="clear:both"/> atau fungsi style clear both pada blogspot/blogger menghapus pengaruh semua kode yang berada sebelum code tersebut agar tidak mempengaruhi semua kode yang berada dibawah atau sesudah code tersebut.

Untuk melihat fungsi style clear both pada blogspot/bloggerdalam penulisan code <div style="clear:both"/> pada HTML silahkan kunjungi http://www.ideblogspot.com/2014/04/fungsi-style-clear-both-pada-blogspot.html

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

Rivai Silaban

21.23
Rivai Silaban

Rivai Silaban

fungsi margin pada html

Posted: 26 Apr 2014 07:57 AM PDT

Fungsi margin pada html - pengertian fungsi margin pada html khususnya pada blogspot. fungsi margin pada html pada template blogspot sangat perlu untuk dipahami para blogger mania, hal ini diperlukan akibat seringnya kita jumpai tulisan " Margin " ini pada bagian CSS Template blogspot sendiri. Dalam prakteknya Margin dalam CSS berfungsi untuk membuat jarak sisi kiri kanan dan atas bawah. Jadi bila kita ingin membuat suatu jarak contohnya widget ada baiknya kita memakai fungsi Margin tersebut. Untuk membuat jarak tentunya margin tersebut harus diisi dengan nilai agar jarak tersebut dapat terlihat. Pemberian nilai pada margin dapat dilakukan dengan sistem angka dengan format angka yang telah ditetapkan, seperti 10px, 5%, 2em dll tergantung kebutuhan kita. Didalam CSS fungsi margin pada html secara devault ada 4 fungsi yang meliputi :

Margin Atas ( Margin Top ) atau pada penulisannya dalam code HTML adalah margin-top yang merupakan jarak titik tengah dengan titik kearah atas. Fungsi margin-top ini dapat kita gunakan bilamana " Cth : Jarak salah satu widget yang satu dengan widget yang diatasnya terlalu dekat dan kita ingin memberikan jarak yang setimpal agar kelihatan bagus dan rapi " maka kita boleh menambahkan nilai pada bagian margin-topnya sehingga penulisannya demikian : ( margin-top:20px ; ) atau ( margin-top:5%; ) dll. Jadi dalam pengertiannya adalah bahwa jarak widget tersebut ke widget yang berada diatasnya merupakan 20px.

Margin Bawah ( Margin Bottom ) atau pada penulisannya dalam code HTML adalah margin-bottom yang merupakan jarak yang berlawanan dengan margin-top atau jarak suatu titik tengah dengan titik yang berada dibawahnya. Penulisan angka pada nilai margin-bottom ini sama juga dengan dengan margin-top hanya saja nilai dari margin-bottom tersebut akan memberikan jarak kebawah.

Margin Kanan ( Margin Right ) atau pada penulisannya pada code HTML adalah margin-right yang merupakan jarak titik tengah terhadap jarak titik yang berada di sebelah kanan titik tengahnya. Dalam prakteknya bila mana suatu widget pada blogspot memiliki jarak kesebelah kanan terlihat tidak sempurnah maka kita dapat memanfaatkan fungsi margin-right untuk menyempurnakan jaraknya.Penulisan fungsi margin-right pada code html adalah sebagai berikut : ( margin-right:20px; ) , ( margin-right:5%; ) atau ( margin-right:2em; ) dll.

Margin kiri ( Margin Left ) atau penulisannya pada code HTML adalah margin-left yang merupakan jarak antara titik tengah kearah kiri titik tengah atau arah yang berlawanan dengan margin-right . Dalam prakteknya penulisan margin-left sama halnya dengan penulisan margin-right hanya saja arahnya yang berlawanan, seperti : ( margin-left:20px; ) , ( margin-left:5%; ) atau ( margin-left:2em; ) dll.

Keterangan fungsi margin pada html diatas merupakan keterangan singkat dalam praktek pemakaiannya dalam HTML baik itu pengkodean html pada platform blogspot. Untuk melihat tatacara penulisan margin pada code CSS silahkan kunjungi http://www.ideblogspot.com/2014/04/fungsi-margin-pada-html.html

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

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)