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
Langganan: Komentar (Atom)