Showing posts with label sosial. Show all posts
Showing posts with label sosial. Show all posts
Saturday, November 12, 2016
Cara Membuat Widget Author Keren Dengan Tombol Sosial Media
Cara Membuat Widget Author Keren Dengan Tombol Sosial Media
Cara Membuat Widget Author Keren Dengan Tombol Sosial Media. Kali ini Jona Rendra akan membagikan info tentang widget yang dapat mempercantik blog. Seperti yang bisa anda lihat pada judul, pasti sudah mengerti maksudnya kan? Widget author kali ini berbeda dengan bawaan blogger. Yang satu ini tampilannya keren banget. Berisi foto author, tombol facebook, twitter, google plus serta anda bisa menambahkan deskripsi tentang diri anda.

Bisa anda lihat pada gambar diatas adalah contoh gambar widget author menarik dengan tombol sosial media. Apakah anda juga ingin memasangnya ke blog anda? Caranya sangat mudah. Cukup ikuti tutorial saya dibawah ini.
Cara Membuat Widget Author Keren Dengan Tombol Sosial Media
1. Login ke blogger, pada dashboard pilih blog lalu masuk ke Tata Letak
2. Pikirkan dulu kolom mana yang akan anda taruh widget author ini. Kalau sudah, klik Tambah Gadget (Add Gadget)
3. Pilih HTML Javascript
4. Pada kolom konten, copy kode HTML dibawah ini dan paste
<style>
.widget-author {width:auto; height:83px;padding:5px}
.foto-author {float:left;width:75px;height:75px;margin:4px 1px 0px 0px;border-radius:90em;opacity:0.8;border-top:2px solid #cf2031;border-right:2px solid #0f7dc8;border-bottom:2px solid #2eb31a;border-left:2px solid #eab823;}
.dskrpsi-author{width:auto; padding:1%;font-family:arial,sans-serif; margin:-85px 0 0 110px; font-size:11px; color:#fff;}
.fb, .gp, .tw {color:#fff!important; display:block;font-weight: bold; line-height: 14px; height: 14px; width: 14px; border: 3px solid #444;text-align: center;padding:3px;border-radius:15px;font-size: 13px;text-decoration:none!important;margin: 1px;position:relative;margin-right:0px}
.fb {background: #3B5998;margin-left:73px}
.fb:hover {border-color: #4F77CC; box-shadow: 0 0 3px #4F77CC;}
.gp {background: #D34836;font-size:11px;margin-left:85px}
.gp:hover {border-color: #EB503C; box-shadow: 0 0 3px #EB503C;}
.tw {background: #4099FF;margin-left:73px}
.tw:hover {border-color: #36D0FF; box-shadow: 0 0 3px #36D0FF;}
</style>
<div class=widget-author>
<img alt=NAMA src=URL GAMBAR / FOTO title=NAMA class=foto-author />
<a class=fb href=URL FACEBOOK rel=nofollow target="_blank">f</a>
<a class=gp href=URL GOOGLE PLUS rel=nofollow target="_blank">g+</a>
<a class=tw href=URL TWITTER rel=nofollow target="_blank">t</a>
<div class=dskrpsi-author>
<span style="color: #000;">
DESKRIPSI
</span>
</div>
</div>
Keterangan:
- Anda perlu kustomisasikan rangkaian HTML diatas, agar data anda dapat terpasang sempurnya dengan mengganti
- NAMA dengan nma anda
- URL GAMBAR / FOTO dengan URL foto anda
- URL FACEBOOK dengan URL profil facebook anda
- URL GOOGLE PLUS dengan URL google plus anda
- URL TWITTER dengan URL twitter anda
5. Setelah di edit edit, terakhir klik simpan dan lihat tampilannya.
Bagaimana? Mudah dan cepat kan untuk Membuat Widget Author Keren Dengan Tombol Sosial Media nya? Dengan memasang widget ini, pengunjung blog akan lebih mengenal pemilik blog tersebut. Itulah artikel dari Jona Rendra yang berjudul Cara Membuat Widget Author Keren Dengan Tombol Sosial Media, semoga bermanfaat untuk anda dalam proses mengedit blog. Apabila ada kesulitan saat melakukan edit kode HTML, anda bisa tanyakan saya melalui komentar dibawah.
Go to link Download
Cara Memblokir Pesan dan Permintaan Teman dari Orang Asing di Jejaring Sosial Facebook
Cara Memblokir Pesan dan Permintaan Teman dari Orang Asing di Jejaring Sosial Facebook
Cara Memblokir Pesan dan Permintaan Teman dari Orang Asing di Jejaring Sosial Facebook - Jejaring sosial merupakan tempat berbagai promosi baik berupa barang, tempat atau sejenisnya. Jika kita melihat lebih jauh lagi bahkan jejaring sosial juga digunakan sebagai ajang mencari jodoh maupun ajang yang sifatnya pasangan hidup. Dari hal itu kita sudah mengetahui bahwa Facebook merupakan jejaring sosial yang paling banyak penghuninya.
Jika kita mempunya akun Facebook tentunya sangat tidak ingin akun kita sepi dari orang. Dari situ kita dapat menganalisa hal-hal yang dapat terjadi. Berbagai kemungkinan dapat muncul seketika. Hal-hal yang negatif tentunya sangat tidak diinginkan. Untuk itu Mundi Lembos akan membagikan tutorial ada kalanya untuk membatasi orang yang dapat mengakses/menambahkan dan ingin berkenalan dengan anda pada Facebook.
Namun sebenarnya Anda bisa juga melakukan pemblokiran terhadap permintaan teman atau pesan pribadi yang masuk ke akun Anda. Cara untuk melakukan filtrasi ini pun tidak sulit. Berikut ini adalah langkah-langkah yang bisa Anda lakukan.


Tak terlalu sulit bukan? Tentunya semua pemilik akun Facebook bisa mencoba langkah di atas. Selamat mencoba!
Sekian artikel tentang Cara Memblokir Pesan dan Permintaan Teman dari Orang Asing di Jejaring Sosial Facebook semoga bermanfaat bagi kita sekalian. Kritik dan saran selalu kami nantikan dari anda semuanya untuk pengembangan ke depannya agar lebih baik. Terimakasih dan sampai jumpa pada tutotial selanjutnya yang lebih menarik.
- Login pada akun Facebook Anda, dan buka Privacy Settings yang terletak pada menu di bagian kanan atas layar.

- Pada halaman Privacy Settings ini, Anda bisa mencari opsi How you connect dan klik pada Edit Settings.

- Di sini, Anda bisa melihat tiga pilihan. Yang pertama, Anda bisa mengatur siapa saja yang bisa melihat alamat email atau nomor handphone yang Anda cantumkan di Facebook. Yang kedua, Anda juga bisa mengatur siapa saja yang bisa melakukan permintaan teman. Dan, yang terakhir, Anda juga bisa mengatur siapa saja yang dapat mengirimkan pesan pribadi kepada Anda.
Tak terlalu sulit bukan? Tentunya semua pemilik akun Facebook bisa mencoba langkah di atas. Selamat mencoba!
Sekian artikel tentang Cara Memblokir Pesan dan Permintaan Teman dari Orang Asing di Jejaring Sosial Facebook semoga bermanfaat bagi kita sekalian. Kritik dan saran selalu kami nantikan dari anda semuanya untuk pengembangan ke depannya agar lebih baik. Terimakasih dan sampai jumpa pada tutotial selanjutnya yang lebih menarik.
Go to link Download
Thursday, November 3, 2016
Cara Membuat Kotak Pencarian plus Ikon Media Sosial
Cara Membuat Kotak Pencarian plus Ikon Media Sosial
Contohnya ada di sidebar blog CB ini, namun yang persis sama dengan kode yang CB share di bawah ini demonya bisa dilihat di Online News Template yang baru saja dipasang.
Kotak Pencarian merupakan salah satu menu utama dalam sebuah situs web/blog. Kotak ini memudahkan pengunjung dan admin blog sendiri untuk mencari informasi yang dibutuhkan.
Blog yang tidak dipasangi kotak pencarian termasuk kategori yang buruk dan tidak user friendly. Sedangkan ikon sosial media berguna bagi nusa dan bangsa, eh.... berguna bagi meningkatkan jumlah follower, teman, atau liker.
Sebelum memasangnya, tentu saja Anda harus punya dulu akun-akun media sosialnya.
Cara Membuat Kotak Pencarian plus Ikon Media Sosial
1. Layout > Add a Gadget di sidebar paling atas.2. Copy + Paste kode berikut ini di kolom "Content". Kolom judul biarkan kosong.
<!-- SEARCH BOX -->
<style>
#search-box {position: relative;width: 100%;margin: 0;}
#search-form {height: 30px;border: 1px solid #999;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;background-color: #fff;overflow: hidden;}
#search-text {font-size: 14px;color: #ddd;border-width: 0;background: transparent;}
#search-box input[type="text"]
{width: 90%;padding: 7px 0 12px 1em;color: #333;outline: none;}
#search-button {position: absolute;top: 0;right: 0;height: 32px;width: 80px;font-size: 14px;color: #fff;text-align: center;line-height: 32px;border-width: 0;background-color: #4d90fe;-webkit-border-radius: 0px 5px 5px 0px;-moz-border-radius: 0px 5px 5px 0px;border-radius: 0px 5px 5px 0px;cursor: pointer;}
</style>
<div id=search-box>
<form action=/search id=search-form method=get target=_top>
<input id=search-text name=q placeholder=Search here... type=text/>
<button id=search-button type=submit><span>Search</span></button>
</form>
</div>
<!-- SEARCH BOX END -->
<!-- SOCIAL PROFILE END -->
<div class=widget-content>
<style>
#socialwidget {width: 300px;margin:10px 1px 10px 1px;}
.TZ-social{padding:0 5px 15px;}
.TZ-social img:hover{opacity:0.8}
.googleplus {background: #ffffff;border-top: 1px solid white;border-bottom: 1px solid #ebebeb;font-size: 12px;color: #000;padding: 9px 11px;line-height: 1px;font-family: Verdana, Geneva, sans-serif;}
.TZ {background: #ffffff;border-top: 1px solid white;font-size: 12px;color: #000;padding: 9px 11px;line-height: 1px;font-family: Verdana, Geneva, sans-serif;}
.TZ span {color: #000;font-size: 11px;position: absolute;margin: -12px 100px;width: 310px;}
#widgetbox .author-credit a {font-size: 10px;font-size: 10px;letter-spacing: 1px;color: #1E598E;text-decoration: none;}
.TZDefault {border: 0px solid #dedede;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
.TZDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}
</style>
<div id=socialwidget>
<div class=TZ-social>
<!-- social ico -->
<center>
<a href=http://facebook.com/cbblogger rel=nofollow style=margin-right: 15px; target=_blank>
<img alt=Facebook src=http://2.bp.blogspot.com/-1UYOmpOWMv8/T65vfQFE80I/AAAAAAAAABY/H0t0CMEwyO0/s1600/facebook.png/></a>
<a href=http://twitter.com/contohblog rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=Twitter src=http://1.bp.blogspot.com/-4xPK0hkcELk/T65vi83XGqI/AAAAAAAAAB0/ef6Af1cesHE/s1600/twitter.png/></a>
<a href=https://plus.google.com/106869251529186655236/posts rel=me style=margin-right: 12px; target=_blank>
<img alt=Google Plus src=http://3.bp.blogspot.com/-QEdzJcR1pfI/T65vgBJxxMI/AAAAAAAAABg/2eXrz-32Gds/s1600/gplus.png/></a>
<a href=http://www.pinterest.com/cbblogger style=margin-right: 12px; target=_blank>
<img alt=Pinterest src=http://1.bp.blogspot.com/-2A1sbDGCgOw/T65vhAL4VZI/AAAAAAAAABo/2XDEIAFUuEI/s1600/pinterest.png/></a>
<a href=http://feeds.feedburner.com/contohblognih rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=RSS Feed src=http://1.bp.blogspot.com/-wK9q4eUXA6U/T65viJ1HVmI/AAAAAAAAABs/DyIkCZdJ1Y4/s1600/rss.png/></a>
<a href=http://www.linkedin.com/in/cbblogger rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=Linkedin src=http://1.bp.blogspot.com/-uQdbnT1u1e0/Ui26eZOy3VI/AAAAAAAAJqA/h4wzaYt2L_Y/s1600/linkedin.png/></a>
</center>
</div>
</div>
</div>
<!-- SOCIAL PROFILE END -->
<style>
#search-box {position: relative;width: 100%;margin: 0;}
#search-form {height: 30px;border: 1px solid #999;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;background-color: #fff;overflow: hidden;}
#search-text {font-size: 14px;color: #ddd;border-width: 0;background: transparent;}
#search-box input[type="text"]
{width: 90%;padding: 7px 0 12px 1em;color: #333;outline: none;}
#search-button {position: absolute;top: 0;right: 0;height: 32px;width: 80px;font-size: 14px;color: #fff;text-align: center;line-height: 32px;border-width: 0;background-color: #4d90fe;-webkit-border-radius: 0px 5px 5px 0px;-moz-border-radius: 0px 5px 5px 0px;border-radius: 0px 5px 5px 0px;cursor: pointer;}
</style>
<div id=search-box>
<form action=/search id=search-form method=get target=_top>
<input id=search-text name=q placeholder=Search here... type=text/>
<button id=search-button type=submit><span>Search</span></button>
</form>
</div>
<!-- SEARCH BOX END -->
<!-- SOCIAL PROFILE END -->
<div class=widget-content>
<style>
#socialwidget {width: 300px;margin:10px 1px 10px 1px;}
.TZ-social{padding:0 5px 15px;}
.TZ-social img:hover{opacity:0.8}
.googleplus {background: #ffffff;border-top: 1px solid white;border-bottom: 1px solid #ebebeb;font-size: 12px;color: #000;padding: 9px 11px;line-height: 1px;font-family: Verdana, Geneva, sans-serif;}
.TZ {background: #ffffff;border-top: 1px solid white;font-size: 12px;color: #000;padding: 9px 11px;line-height: 1px;font-family: Verdana, Geneva, sans-serif;}
.TZ span {color: #000;font-size: 11px;position: absolute;margin: -12px 100px;width: 310px;}
#widgetbox .author-credit a {font-size: 10px;font-size: 10px;letter-spacing: 1px;color: #1E598E;text-decoration: none;}
.TZDefault {border: 0px solid #dedede;text-shadow: #d08d00 1px 1px 0;background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffca00),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffca00 0,#ff9b00 100%);background: linear-gradient(center top,#ffca00 0,#ff9b00 100%);}
.TZDefault:hover {background-color: #ff9b00;background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#ffe480),color-stop(1,#ff9b00));background: -webkit-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -moz-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -o-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: -ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background: linear-gradient(center top,#ffe480 0,#ff9b00 100%);}
</style>
<div id=socialwidget>
<div class=TZ-social>
<!-- social ico -->
<center>
<a href=http://facebook.com/cbblogger rel=nofollow style=margin-right: 15px; target=_blank>
<img alt=Facebook src=http://2.bp.blogspot.com/-1UYOmpOWMv8/T65vfQFE80I/AAAAAAAAABY/H0t0CMEwyO0/s1600/facebook.png/></a>
<a href=http://twitter.com/contohblog rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=Twitter src=http://1.bp.blogspot.com/-4xPK0hkcELk/T65vi83XGqI/AAAAAAAAAB0/ef6Af1cesHE/s1600/twitter.png/></a>
<a href=https://plus.google.com/106869251529186655236/posts rel=me style=margin-right: 12px; target=_blank>
<img alt=Google Plus src=http://3.bp.blogspot.com/-QEdzJcR1pfI/T65vgBJxxMI/AAAAAAAAABg/2eXrz-32Gds/s1600/gplus.png/></a>
<a href=http://www.pinterest.com/cbblogger style=margin-right: 12px; target=_blank>
<img alt=Pinterest src=http://1.bp.blogspot.com/-2A1sbDGCgOw/T65vhAL4VZI/AAAAAAAAABo/2XDEIAFUuEI/s1600/pinterest.png/></a>
<a href=http://feeds.feedburner.com/contohblognih rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=RSS Feed src=http://1.bp.blogspot.com/-wK9q4eUXA6U/T65viJ1HVmI/AAAAAAAAABs/DyIkCZdJ1Y4/s1600/rss.png/></a>
<a href=http://www.linkedin.com/in/cbblogger rel=nofollow style=margin-right: 12px; target=_blank>
<img alt=Linkedin src=http://1.bp.blogspot.com/-uQdbnT1u1e0/Ui26eZOy3VI/AAAAAAAAJqA/h4wzaYt2L_Y/s1600/linkedin.png/></a>
</center>
</div>
</div>
</div>
<!-- SOCIAL PROFILE END -->
3. Ganti ID yang berwarna merah dengan kepunyaan Anda.
4. Save!
Selamat, kini Kotak Pencarian plus Ikon Media Sosial sudah muncul di sidebar blog Anda!
Go to link Download
Subscribe to:
Posts (Atom)