Jumat, 06 November 2015

When you say nothing at all BethWheeler_PS feat Chery Gultom (Smule sing)

0 komentar
Baca Selengkapnya →
Jumat, 05 September 2014

Cara Memasang Buku tamu di Blog

0 komentar

Cara Memasang Buku tamu di Blog

Buku tamu/Guest book adalah salah satu aksesoris wajib oleh para blogger. Bentuk nya sih mungkin beda beda pada setiap blog , ada yang di taruh di page,ada yang di taruh menggantung di kanan blog .nah pada kesempatan kali ini saya akan berbagi tips yang tentunya gratis yaitu cara membuat buku tamu menggantung di kanan blog. untuk mau melihat demonya silahkan klik disini.
semoga anda tertarik

untuk mau membuatnya silahkan ikuti langkah langkahnya:

1. Silahkan sign in dulu di akun blogger sobat.
2. Jika sudah masuk ke tata letak/layout.
3. trus add gadget ,pilih Html/javascript
4. copy paste kan kode di bawah ini

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMkvAytBQIh_ZqbxepYlemG88umQsIl-7GEwCeOgMJAvRFU4Km27-2PniQN0ERhqpZzXQB1UFAPS77xpWKvMkLys2E90-DFyovZ4jJbDLiEhNWkIf_MdMeR25-G7j80ACYbA4Px7PkGmE/s1600/bukutamu.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
                   <!-- BEGIN CBOX - www.cbox.ws - v001 --> <div id="cboxdiv" style="text-align: center; line-height: 0;background-position:center;background:url(https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcRnfkaKyYX3_4XIBIQWn2RqOJhKGelv34mKiWk6CWCXiUkBwxnL);width:200px;height:400px;background-repeat:no-repeat;"> <div><iframe frameborder="0" width="200" height="275" src="http://www5.cbox.ws/box/?boxid=857766&amp;boxtag=7a2hqz&amp;sec=main" marginheight="2" marginwidth="2" scrolling="auto" allowtransparency="yes" name="cboxmain5-857766" style="border: 0px solid;" id="cboxmain5-857766"></iframe></div> <div><iframe frameborder="0" width="200" height="75" src="http://www5.cbox.ws/box/?boxid=857766&amp;boxtag=7a2hqz&amp;sec=form" marginheight="2" marginwidth="2" scrolling="no" allowtransparency="yes" name="cboxform5-857766" style="border: 0px solid;border-top:0px" id="cboxform5-857766"></iframe></div> </div> <!-- END CBOX -->
<div style="text-align:right">
<a href="http://blog-wongndeso.blogspot.com/2013/04/cara-memasang-buku-tamu-di-blog.html">[get this widget]</a>><a href="javascript:showHideGB()">
[Tutup]
</a>
</div>
</div>
</div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div> 

5. Save
Baca Selengkapnya →
Selasa, 17 Juni 2014

nama maskot

0 komentar
# Maskot Maskot Piala Dunia 1966 1970 1974 1978 1982 # 1# Willie - Maskot Piala Dunia 1966 Inggris Nama Maskot Piala Dunia Pertama tahun 1966 di Inggris adalah "Willie", seekor singa yang merupakan simbol Kerajaan Inggris. Willie memakai kostum bergambar bendera 'Union Jack' dengan tulisan "WORLD CUP" di tengahnya. Maskot pertama dalam sejarah sepak bola Dunia ini juga menjadi subjek dari "Lagu Piala Dunia" saat itu dan penjualan merchandise yang laku keras. Dan Willie berhasil mendampingi tuan rumah Inggris menjadi juara Piala Dunia Pertama kali pada tahun 1966. 2# Juanito - Maskot Piala Dunia 1970 Meksiko "Juanito" adalah sosok seorang anak berpakaian (kostum) Meksiko dan sombrero (topi khas penduduk Meksiko) bertuliskan "Mexico 70". Sekali melihat Maskot Piala Dunia Kedua ini pasti bisa langsung nebak kalo Piala Dunia 1970 diselenggarakan di Meksiko. Maskot yang punya nama kecil "Juan" ini, merupakan sebuah nama umum dalam bahasa Spanyol. 3# Tip and Tap - Maskot Piala Dunia 1974 Jerman Barat Untuk Maskot Piala Dunia Ketiga di Jerman Barat tahun 1974 ini adalah "Tip and Tap", menggambarkan dua bocah laki-laki yang memakai kostum dengan tulisan "WM 74", singkatan dari 'Weltmeisterschaft' yang artinya "Piala Dunia" dan nomor 74 = tahun 1974. Tip and Tap juga berhasil mendampingi tuan rumah Jerman Barat menjadi juara Piala Dunia ketiga pada tahun 1974 mengalahkan Belanda di final. 4# Gauchito - Maskot Piala Dunia 1978 Argentina Maskot Piala Dunia di Argentina tahun 1978 bernama "Gauchito", seorang anak yang mengenakan kostum Timnas Argentina dan topi yang bertuliskan "Argentina 78". Maskot Piala Dunia ke-empat ini hampir sama dengan maskot-maskot sebelumnya. Aksesoris yang dipakai maskot tersebut, syal dan cambuk yang merupakan ciri khas gauchos mewakili wilayah Amerika Selatan. 5# Naranjito - Maskot Piala Dunia 1982 Spanyol Spanyol sebagai tuan rumah Piala Dunia 1982 coba membuat gebrakan baru untuk Maskot Piala Dunia Kelima ini, yaitu dengan menggunakan buah Jeruk. Karena Buah jeruk merupakan ciri khas negara Spanyol. Maskot Piala Dunia 1982 ini bernama "Naranjito" yang berasal dari kata 'naranja' dalam bahasa Spanyol berarti Jeruk. # Maskot Maskot Piala Dunia 1986 1990 1994 1998 2002 # 6# Pique - Maskot Piala Dunia 1986 Meksiko Meksiko kembali menjadi tuan rumah Piala Dunia pada tahun 1986, tapi kali ini Meksiko membuat Maskot Piala Dunia Keenam menggunakan bumbu masakan yaitu Cabe "Jalapeno" (baca: Halapenyo), yang merupakan bahan utama makanan khas Meksiko. Cabe Jalapeno ini bernama "Pique" yang berasal dari kata "Picante", yang berarti pedas. Maskot ini tampil dengan memakai kumis dan kembali mengenakan sombrero. 7# Ciao - Maskot Piala Dunia 1990 Italia Pada Piala Dunia 1990 di Italia, maskot kali ini bisa dibilang paling unik dari maskot-maskot lain. Maskot Piala Dunia ketujuh yang bernama "Ciao" ini, susunan kotak-kotak berbentuk pemain bola dengan kepala berupa bola, dengan 3 warna ciri khas negara Italia yaitu: merah, putih dan hijau atau disebut "Tricolore Italia". Nama Maskot 'Ciao' yang merupakan salam warga Italia ini terinspirasi dari game tetris yang populer saat itu. 8# Striker - Maskot Piala Dunia 1994 United States America Untuk Piala Dunia kedelapan tahun 1994, Amerika Serikat kebagian menjadi tuan rumah dengan Maskot Piala Dunia bernama "Striker", seekor anjing yang merupakan hewan peliharaan umum dan populer di Amerika. Striker mengenakan baju sepakbola berwarna merah, putih dan biru bertuliskan "USA 94". 9# Footix - Maskot Piala Dunia 1998 Prancis Perancis mendapat kehormatan menjadi tuan rumah piala dunia tahun 1998 dengan maskot seekor Ayam Jantan bernama "Footix", yang merupakan salah satu simbol nasional Prancis. Footix menggunakan kostum Perancis berwarna biru bertuliskan "France 98" di dada. Kostum bernama Footix ini berasal dari penggabungan kata "football" dan akhiran "-ix" yang diambil dari kata Asterix (komik strip terkenal terbitan Prancis). Sebelum dipilih nama "footix", ada beberapa nama pilihan lainnya yaitu nama "Raffy", 'Houpi" dan "Gallik" sempat diusulkan, namun akhirnya nama Footix lebih disukai karena memberi keberuntungan. 10# Ato, Kaz and Nik (The Spheriks) - Maskot Piala Dunia 2002 Korea - Japan Pada Piala Dunia 2002, dua negara menjadi tuan rumah, yaitu Korea Selatan dan Jepang, dengan maskot 3 mahluk hasil rekayasa komputer yang berwarna orange, ungu dan biru yang futuristik bernama Ato, Kaz dan Nik (The Spheriks). Mereka bertiga merupakan anggota tim dari "Atmoball" (olahraga sepak bola fiksi), dimana Ato merupakan pelatih sedangkan Kaz dan Nik merupakan pemain. Tiga nama tersebut adalah hasil dari polling pengguna Internet dan di outlet McDonald di negara-negara tuan rumah. # Maskot Maskot Piala Dunia 2006 2010 2014 # 11# Goleo VI dan Pille - Maskot Piala Dunia 2006 Jerman Jerman kembali menjadi tuan rumah pada Piala Dunia 2006, dan kali ini kembali dengan maskot seekor singa yang bernama "Pille", yang mengenakan kostum Jerman dengan nomor 06. Sedangkan kata "Goleo" merupakan kombinasi dari kata "goal" dan "leo", kata Latin untuk singa. "Pille" adalah istilah bahasa sehari-hari untuk sepak bola di negara Jerman. Dan 06 merupakan singkatan dari tahun 2006. 12# Zakumi - Maskot Piala Dunia 2010 Afrika Selatan Maskot Piala Dunia 2010 yang berlangsung di Afrika Selatan ini bernama "Zakumi", seekor Leopard (macan tutul yang ditemukan di Afrika Selatan) berambut Hijau dan memakai kaos Putih bertuliskan "South Africa 2010". Nama 'Zakumi' ber-arti 'Persatuan Afrika Selatan'. Kata "Za" merujuk kepada Afrika Selatan. Sedangkan "kumi" memiliki arti sepuluh, merujuk kepada 10 bahasa yang digunakan di negara tersebut. 13# Fuleco - Maskot Piala Dunia 2014 Brazil Dan pada Piala Dunia Ke Tigabelas yang diselenggarakan di Brazil, FIFA mengumumkan "Fuleco" sebagai nama resmi untuk Maskot Piala Dunia 2014. Fuleco berarti saling mengingatkan tentang kesadaran lingkungan. Setengah dari 1,7 juta yang ikut bagian dalam polling online memilih Fuleco mengalahkan dua nama lainnya 'Zuzeco' dan 'Amijubi'. Maskot Piala Dunia 2014 sendiri berwujud "Armadillo", sejenis hewan omnivora yang banyak hidup di wilayah Amerika Selatan dan Utara. Di Brasil hewan ini sudah hampir punah. - See more at: http://ariepinoci.blogspot.com/2013/09/maskot-maskot-piala-dunia-1966-2014.html#sthash.KMqn4Snd.dpuf

Baca Selengkapnya →
Jumat, 11 April 2014

Membuat ucapan selamat datang di Blog

0 komentar

Membuat ucapan selamat datang di Blog



welcome

Kali ini saya akan membagikan sebuah tutorial sederhana yang sebenarnya kurang saya sukai. Yaa walaupun dengan memberikan ucapan selamat datang pengunjung akan merasa lebih dihargai, tetapi pengunjung juga akan merasa direpotkan karena diharuskan untuk meng-klik tombol "Ok" untuk menutup ucapan ini, supaya  bisa melanjutkan ke konten yang dituju. Tetapi setiap orang pasti memiliki pemikiran yang berbeda-beda, jadi bagi anda yang ingin memasang ucapan selamat datang pada Blog anda, bisa ikuti tutorialnya dibawah.
  • Login.
  • Pilih menu "Template".
  • Klik "Edit HTML".
  • Centang "Expand Template Widget".
  • Cari kode </head>.
  • Sekarang silakan anda copy kode yang ada dibawah, kemudian anda letakkan diatas kode </head>.
<script type='text/javascript'>
alert("Welcome To My Blog")
</script>
Keterangan: kode berwarna biru merupakan ucapan yang akan anda tampilkan, anda bisa merubahnya sesuai keinginan anda.

  • Terakhir klik "Simpan".

Mudah kan?

Semoga bermanfaat.



Sumber : http://c-gultom.blogspot.com/
Baca Selengkapnya →

Membuat Screensaver Pada Blog

0 komentar

Membuat Screensaver Pada Blog


Screensaver atau yang biasa disebut energy saving mode merupakan sebuah tampilan stanby dari layar dimana seluruh aktivitas dihentikan sementara. Screensaver akan tampil ketika blog dalam keadaan diam tanpa aktivitas dengan memunculkan sebuah halaman baru yang menutupi seluruh layar. Namun tampilan layar akan kembali normal ketika mouse digerakan. Selain untuk memperindah tampilan blog, screensaver juga digunakan untuk menghemat energy.
Itu tadi merupakan sedikit penjelasan mengenai screensaver. Sekarang saya akan membagikan cara untuk memasangnya pada blog anda.


Langkah-langkah membuat screensaver pada blog:
  • Login.
  • Pilih menu "Tata Letak".
  • Klik "Tambahkan Gadget".
  • Pilih widget "HTML/JavaScript".
  • Isi konten dengan kode yang ada dibawah,
<style type="text/css">
body .saving{
    position: fixed;
    width: 100%;
    top: 0;
    left:0;
    height: 100%;
    opacity: 0.98;
    filter:  alpha(opacity=98);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";
    background: #000;
    border-bottom: 3px solid transparent;
    z-index: 999999;
    -o-transition: all 3s ease-in-out 10s;
    -moz-transition: all 3s ease-in-out 10s;
    -webkit-transition: all 3s ease-in-out 10s;
}
body:hover .saving {
    opacity: 0.0;
    height:0.001%;
    filter: alpha(opacity=0);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    background: #0a7f01;
    border-bottom: 5px solid #333;
    -o-transition: opacity 2s ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in 1.8s;
    -moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;
    -webkit-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;
}
body .saving p.esm1{
    margin: 0;
    padding: 0;
    width: 92%;
    background: transparent;
    font-size: 100px;
    font-family: "Serif", Times New Roman;
    color: #FF0000;
    text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
    position: relative;
    margin-top: 200px;
    line-height: 20px;
    font-weight: bold;
    text-align: center;
    border: 30px solid transparent;
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -o-transition: -o-transform 5s ease-out 8s, background-color 4s ease-out 12s;
    -moz-transition: -moz-transform 5s ease-out 8s, background 4s ease-out 12s;
    -webkit-transition: -webkit-transform 5s ease-out 8s, background 4s ease-out 12s;
}
body:hover .saving p.esm1{
    font-size: 10px;
    color: red;
    width: 25%;
    margin: 340px 0 0 300px;
    padding: 25px;
    background: #aaa;
    border: 20px solid #888;
    border-radius: 170px;
    -moz-border-radius: 170px;
    -webkit-border-radius: 170px;
    -o-transform:translate(600px,-500px) rotate(360deg) scale(0.2);
    -moz-transform:translate(600px,-500px) rotate(360deg) scale(0.2);
    -webkit-transform:translate(600px,-500px) rotate(360deg) scale(0.2);
    -o-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s, background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;
    -moz-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;
    -webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left 0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in, -webkit-border-radius 3s ease-in;
}
.saving p span.esm2{
    font-size: 18px;
    opacity: 0.5;
    filter: alpha(opacity=50);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    display: block;
    text-align: center;
    width: 300px;
    margin: -10px auto;
    font-weight: normal;
    padding: 2px 8px;
    background: #000;
    border: 1px solid #333;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    color: #0000FF;
    text-shadow: none;
    font-family: Arial, Helvetica, sans-serif;
    -o-transition: 1s ease-out;
    -moz-transition: 1s ease-out;
    -webkit-transition: 1s ease-out;
}
.saving:hover p span.esm2{
    font-size: 10px;
    width: 200px;
    padding: 0;
}
.saving p span.esm3{
    color: #ccc;font-family: "Tahoma", Arial, Helvetica;
    display: block;
    margin:10px auto;
    background: url http://i964.photobucket.com/albums/ae124...) left center repeat-x;
    background: -moz-linear-gradient(top,#666,#111);
    background: -webkit-gradient(linear,0% top,0% bottom,from(#111),to(#666));
    opacity: 0.6;
    filter: alpha(opacity=60);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    width: 250px;
    text-shadow: 1px 1px 1px #000;
    border: 1px solid #333;
    border-radius: 4px;
    padding:2px 10px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    font-size: 12px;
    font-weight: normal;
    line-height: 16px;
}
.saving .by_kucopas {
    margin-left: 30px;
    text-align: center;
    color: #015828;
    font-size: 12px;
    font-weight: normal;
    position: absolute;
    bottom: 30px;
    width: 100%;
    height: 20px;
    left: 0;
}
.saving .by_kucopas span.esm4 {
    color: #aaa;
    font-style:italic;
    font-size:14px;
    font-weight:bold;
    text-transform:uppercase;
}
#recpost {
    width:210px;
    overflow: hidden;
    height: 327px;
    float: right;
    margin-top: 10px;
    padding: 4px 2px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -o-transition: all 1.5s ease-out;
    -moz-transition: all 1.5s ease-out;
    -webkit-transition: all 1.5s ease-out;}
</style>
<div class='saving'>
<p class='esm1'>Chery Gultom<br/>
<span class='esm2'>Energy Saving Mode using CSS3</span><br/><br/>
<span class='esm3'>Move your mouse to go back to the page!<br/>Gerakkan mouse anda dan silahkan baca kembali posting kami!</span></p>
<div class='by_kucopas'>Support design by: <span class='esm4'>KUCOPAS</span> - September 2012</div>
</div>
Keterangan: sumber script, c-gultom.blogspot.com. ganti kode berwarna merah sesuai dengan keinginan anda.

  • Klik "Simpan".



Scrensaver diatas hanya memunculkan sebuah text/tulisan. Jika anda ingin menggunakan gambar pada screensaver diblog anda, caranya sama saja, hanya pada bagian "HTML/JavaScript" isikan konten-nya dengan kode dibawah,
<script type="text/javascript" src="https://sites.google.com/site/vikrymadzblogspotcom/vikrymadz/screensavervikry.js">
</script>
<style type='text/css'>
div#energysaving, div#energysaving * {
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border: 0;
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaLxn9UxtXv5rttB3-0X2DyY52CPQ7yhS82b-bLtsM7cwwXlC1E-RaNWwrLrWBhlJqI0GQNZqshHCsbh5_zQosIv6bKENNKalzDovrxduk_ZZpbOtYE1OiwO07v4_3EiyeUrC5BgIA4RJc/) no-repeat center center fixed black;
}
div#energysaving p span {
    display:none;
    visibility:hidden;
}
</style>
Keterangan : ganti kode berwarna merah dengan URL gambar anda.

  • Klik "Simpan".


Sekarang anda hanya perlu memilih ingin menggunakan script yang mana.
Hanya itu penjelasan yang bisa saya berikan tentang membuat screensaver pada blog.
Kurang lebihnya mohon maaf.
Semoga bermanfaat.




Sumber : www.c-gultom.blogspot.com
Baca Selengkapnya →

Mempercantik Tampilan Komentar Blog

0 komentar

Mempercantik Tampilan Komentar Blog


Kotak komentar blog adalah sebuah fasilitas yang di sediakan untuk melakukan interaksi antara pengunjung dengan pemilik blog tentang sebuah posting. Dari komentar, pengunjung dapat mengeluarkan unek-unek, memberikan pujian, saran atau bahkan mengkritik artikel yang di tulis oleh si pemilik blog. Untuk saya pribadi komentar dari pengunjung dapat memberikan semangat tersendiri, karena artikel yang sudah saya tulis di berikan komentar, walaupun komentarnya berupa kritik yang pedas.

Oleh karena begitu pentingnya sebuah kotak komentar, banyak dari para blogger memodifikasi tampilannya sehingga terlihat lebih keren, unik, juga cantik. Tampilan komentar yang indah akan memberi daya tarik tersendiri kepada pengunjung agar mau meluangkan sedikit waktunya untuk mengomentari artikel yang baru di bacanya.

Pada kesempatan kali ini saya akan coba berbagi sebuah tutorial sederhana, yaitu untuk merubah tampilan kotak komentar.

Langkah-langkah yang perlu di lakukan:

Login >> Template >> Edit HTML.

Cari kode ]]></b:skin>

Copy kode yang ada di bawah, kemudian letakkan di atas kode ]]></b:skin>
/* Comments
----------------------------------------------- */
#comments h4 {
font-weight:bold;
color:#000;
background:url(http://lh5.ggpht.com/-aTlt92RWTxg/UbIJIUGB5dI/AAAAAAAAJ64/xjbK-dAYEKM/bcg%25255B2%25255D.gif) repeat-x;
height: 35px;
line-height: 35px;
width: 100%;
margin:-5px 0 -7px -10px;
text-align:center;
border-top:1px solid #ddd;
display:block;
padding-bottom:6px ;
line-height:30px;
}
h4#comment-post-message {
display:none;
}
.comments .comments-content {
font-size:12px;
text-align:left;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em
}
#comments-block .comment-author {
margin:.5em 0
}
#comments-block .comment-body {
margin:.25em 0 0
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height:1.4em;
letter-spacing:.1em
}
#comments-block .comment-body p {
margin:0 0 .75em
}
.deleted-comment {
font-style:italic;
color:gray
}
.comments {
font:normal 11px/14px "Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif!important
}
.comments .comments-content .comment,.comments .comments-content .comment:first-child,.comments .comments-content .comment:last-child {
padding:0;
margin:0;
position:relative
}
.comments .avatar-image-container {
width:45px;
height:45px;
max-width:45px;
max-height:45px;
padding:2px;
border-radius:2px;
margin-right:5px;
margin-top:8px;
margin-left:8px;
position:relative;
background-color:white;
z-index: 2;
}
.comments .avatar-image-container img {
max-width:100%;
height:100%
}
.comments .inline-thread .avatar-image-container {
width:38px;
height:38px;
position:relative;
margin:0
}
.comments .comment-block {
margin-left:0;
padding:0 8px;
min-height:90px;
border:1px solid #4173af;
border-radius:2px
}
.comments .inline-thread .comment-block {
margin-left:45px;
padding:0;
border:0;
min-height:initial
}
.comments .comments-content .comment:hover .comment-block {
border:1px solid 4173af;
-moz-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);
-webkit-box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21);
box-shadow:0 1px 3px rgba(58,58,58,0.06),0 1px 2px rgba(54,54,54,0.21)
}
.comments .comments-content .comment:hover .inline-thread .comment-block {
border:0;
-moz-box-shadow:none;
-webkit-box-shadow:none;
box-shadow:none
}
.comments .comments-content .comment-replies {
margin-left:20px;
margin-top:5px
}
.comments .comments-content .comment-header,.comments .comments-content .comment-content {
margin:0 0 8px;
padding-left:58px;
text-align:left;
line-height:1.6em;
}
.comments .comments-content .comment-header {
margin-top:8px;
height:14px
}
.comments .comments-content .inline-thread .comment-header,.comments .comments-content .inline-thread .comment-content {
padding-left:8px;
margin-top:0;
text-align:left;
line-height:1.6em;
}
.comment-actions {
position:absolute;
top:64px;
left:10px;
z-index:2
}
.comments .comment .comment-actions a {
background:#0671A1;
border-radius:4px;
position:relative;
display:block;
padding:2px 7px;
color:white;
top:-1px;
font-family:Arial,Sans-serif;
font-weight:bold;
box-shadow:0 1px 1px rgba(0,0,0,0.4);
text-shadow:0 1px 0 rgba(0,0,0,0.3);
-webkit-transition:none;
-moz-transition:none;
-o-transition:none;
-ms-transition:none;
transition:none
}
.comments .comment .comment-actions a:hover {
text-decoration:none;
background-color:#0057ae;
}
.comments .comment .comment-actions a:active {
top:0;
background-color:#0057ae;
}
.comments .comments-content .inline-thread li.comment,.comments .comments-content .inline-thread li.comment:first-child,.comments .comments-content .inline-thread li.comment:last-child {
padding:5px;
border:1px solid #4173af;
margin-bottom:5px;
}
.comments .comments-content .inline-thread {
padding:0
}
.comments .comments-content .comment-thread.inline-thread ol {
padding-top:8px
}
.comments .comments-content .comment-thread.inline-thread ol > div:first-child {
border-left:1px solid #4173af;
padding:10px
}
.comments .comments-content .inline-thread li.comment::before {
content:"";
position:absolute;
width:11px;
height:1px;
background-color:#4173af;
display:block;
left:-12px;
top:12px
}
.comments .comments-content .inline-thread li.comment:last-child {
margin-bottom:0
}
.comments .comments-content .inline-thread li.comment:last-child::after {
content:"";
height:100%;
width:5px;
display:block;
background-color:#FCFCFC;
position:absolute;
top:13px;
left:-13px
}
.comments .thread-toggle.thread-expanded {
position:relative
}
.comments .thread-toggle.thread-expanded::after {
content:"";
display:block;
width:1px;
height:32px;
position:absolute;
background:#4173af;
top:-8px;
left:0
}
.comments .comment .comment-actions .item-control a {
display:none;
background-color:#FCFCFC;
background-position:2px 50%;
background-repeat:no-repeat;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo-i6YvYUY57S7i2UXhfVHNVUK_xgYRyMQZrgHsa5YQxHEdT0eocFJARxg4feQskMD1bo4bCGtPyfoTkIOBdo9qJ2BVC-zLEgu8mivGnXdGX3VpzTLKBCES_WbxBwTwgdePOgzdJnJ9p0/s14/Trash.png);
border:1px solid #4173af;
position:absolute;
left:-10px;
text-indent:-9999px;
padding:0;
width:19px;
height:20px;
top:-42px;
border-radius:2px
}
.comments .comments-content .comment:hover .comment-actions .item-control a {
display:block
}
.comments .comments-content .comment:hover .inline-thread .comment-actions .item-control a {
display:none
}
.comments .comments-content .inline-thread li.comment:hover .comment-actions .item-control a {
display:block
}
.comments .inline-thread .comment .comment-actions .item-control a {
left:-61px;top:-35px
}
#comments h4#comment-post-message {
border-bottom:0;
background-color:transparent;
font-size:130%
}
.comment-form {
max-width:100%
}
.comments .comments-content .icon.blog-author {
display: block;
width: 0;
height: 0;
border: 6px solid transparent;
border-color:transparent #0671A1 #0671A1 transparent;
position: absolute;
right: 0;bottom: 4px;
}
.comments .comments-content .inline-thread .icon.blog-author {
bottom:-9px;
right:-5px;
}
.comments .comments-content .user,.comments .comments-content .datetime {
display:inline-block;
float:left
}
.comments .avatar-image-container img[src="http://img1.blogblog.com/img/anon36.png"] {
content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_XQ9JennYYmMcdPkQMzIFNcqBpqwvrizjapqhXoLfDNSKfvKa1gXJVNC75BemaMxuYzeOquP7rcdw4Y_BT8qtjy1qc21gqPUxTG6VYunNH6mj2Pik2RusqNosLRzITnyVfJLM2CNaOBp-/s70/user-anonymous-icon.png);
}

Terakhir klik "Simpan Template".
Kemudian lihat hasilnya.

Sekian dulu artikel mengenai cara merubah tampilan komentar blog, Semoga bermanfaat.

Keterangan: cari kode /* comments, jika sebelumnya masih terdapat kode CSS yang berkaitan dengan komentar, sebaiknya anda hapus.



Sumber : www.c-gultom.blogspot.com
Baca Selengkapnya →

Cara Mudah Merubah Tampilan Cursor Mouse di Blog

0 komentar

Cara Mudah Merubah Tampilan Cursor Mouse di Blog



cara mudah merubah cursor mouse pada blog
Mouse pointer atau penunjuk mouse adalah tanda yang menyatakan posisi mouse pada layar. Umumnya berbentuk tanda panah akan tetapi bisa diubah sesuai keinginan. Untuk itu pada postingan kali ini saya akan membagikan cara mudah merubah pointer atau cursor mouse pada Blog anda. Cursor mouse merupakan salah satu bagian penting pada Blog, karena merupakan bagian yang paling sering mendapat perhatian dari pengunjung. Dengan merubah kursornya dengan tampilan yang lebih unik tentunya Blog anda akan terlihat lebih menarik. Jika anda tertarik untuk mengganti kursor pada Blog anda, silakan ikuti tutorialnya dibawah,


Langkah-langkah:

  • Disana anda akan disugukan banyak contoh dari kursornya.
  • Anda dapat memilih berdasarkan kategori yang ada.

kategori kursor


  • Silakan anda pilih salah satu gambar yang anda ingin gunakan pada Blog anda.
pocketball kursor

  • Jika anda telah menentukan kursor mana yang akan anda gunakan, klik gambar tersebut untuk mendapatkan kode dari kursornya.
  • Sekarang copy kode yang diberikan untuk kursor yang telah anda pilih. (Option #1 - Universal CSS/HTML Code)
copy kode kursor

  • Nah anda sekarang telah mendapatkan kodenya.

  • Untuk memasangnya di Blog anda, Pilih Tata Letak >> Tambahkan Gadget >> HTML/Javascript.
  • Isikan konten dengan kode yang sebelumnya telah anda copy.
  • Jika sudah klik "Simpan".


Sekarang anda akan menemukan perubahan yang terjadi pada cursor mouse yang ada Blog anda.



Sekian tutorial dari saya mengenai cara mudah mengganti kursor blog dengan animasi, Semoga bermanfaat.




Sumber : www.c-gultom.blogspot.com
Baca Selengkapnya →