Februari 2015 ~ Tips & Trik Blog

Sabtu, 21 Februari 2015

Menambah Gadget Google+ Followers Di Blog Dengan Mudah

Saya ada artikel terbaru nih. Pada postingan kali ini admin akan memberitahukan kepada pembaca setia Tips & Trik Blog hehehe bagaimana cara membuat gadget Google+ Followers dengan mudah. Artikel ini dikhususkan untuk para pemula yang mau belajar cara membuat nya. Bagi para master dalam dunia blog, mungkin bisa menambah beberapa dengan komen di bawah yaa hahahah.
Membuat dan Pasang Widget Google+ Followers di blogger

Membuat dan Pasang Widget Google+ Followers di blogger

Okey langsung saja ini dia tutorialnya.

Cara 1 menambah gadget Google+ Followers :
1. Masuk ke blogger.com, jika diminta email dan password kamu masukkan saja hahaha
2. Pilih blog kamu, jika blog kamu lebih dari 1 pilih salah satu aja. Jika kamu ingin menambah di blog kamu yang ke dua sabar satu-satu yaa
3. Klik Tata letak > Pilih Tambahkan Gadget/ Add Gadget
Membuat dan Pasang Widget Google+ Followers di blogger

4. Pilih Google+ Followers
Membuat dan Pasang Widget Google+ Followers di blogger

5.Terakhir Save untuk menyimpan widget anda
Okey sekian tutorial nya. Gampang kan membuatnya?. Jika tidak berhasil dicoba - coba terus yaa pasti berhasil dech. Jika berhasil jangan lupa komen di bawah yaa.Salam admin

By: Unknown On 21.23

Jumat, 13 Februari 2015

Kumpulan Efek - Efek Keren Untuk Blog

Memang selalu ada cara untuk mempercantik penampilan blog. Setelah sebelum memposting cara memasang animasi di blog, kali ini saya akan kasih sobat berbagai macam / jenis efek - efek blog yang bisa di pasang di blog.

Sebelum kita masuk ke intinya, terlebih dahulu saya ingatkan pada sobat bahwa efek, animasi dan widget - widget serupa akan menambah beban loading blog sobat, jadi mohon di perhitungkan sebelum sobat memasang efek ini. Efek yang akan saya posting kali ini, akan saya bagi 2 yaitu efek ringan ( loading ringan ) dan efek menegah hingga berat. ( kayak tinju aja.. ) .

Sobat yang tertarik memasangnya silahkan ikuti tutorial memasang efek - efek pada blogberikut.

A. Efek Ringan
Mungkin Ini adalah efek yang biasa sobat lihat saat sobat blogwalking.

1. Efek salju berjatuhan

2. Efek hati bertaburan

3. Efek bintang bertaburan

4. Efek kembang api

5. Efek Gelembung

5. Efek Kupu - Kupu Terbang

Cara pemasangan :

Klik rancangan --> Edit html
Letakkan script efek di atas kode </body>
Klik Save

B. Efek Menengah - Berat
Efek ini saya ambil dari http://www.netdisaster.com. Untuk demo dari salah satu script berikut, silahkan lihat di sini.. DEMO

1.Meteor Jatuh

2. Banjir

3. Bunga Mekar

4. Bom Atom

5. Ufo

6. Graffity

7. Shaver

8. Gun

9.Bloody gun

10. Paint ball

11. Chainsaw

12. Dinosaur

13. Lebah

14. Lalat

15. Semut

16. Siput

17. Cacing

18. Mold

19. Bayi merangkak

20. Telur mata sapi

21. Kopi tumpah

22. Terbakar

23. Tomat

24. Creampie

25. Murka

26. Sapi Jorok

27. Anjing Jorok

28. Kencing Sembarangan

Cara pemasangan :

Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
Masukkan script efek di dalam kotak yang di sediakan
Klik save dan lihat hasilnya.

Tambahan :
Efek yang ke 2 berbeda dengan efek yang pertama. di efek ke 2, efek bisa dimatikan secara manual, sedangkan yang pertama sebaliknya ( tidak bisa dimatikan selama masih memasang scriptnya ). so, pilih mana yang terbaik menurut sobat.. salam..

Sumber : http://christiantatelu.blogspot.com/2012/03/kumpulan-efek-efek-blog-lengkap.html

By: Unknown On 04.56

Rabu, 11 Februari 2015

Widget Animasi Untuk Di Pojok Blog

Satu lagi, kumpulan widget yang keren. Tidak usah berlama-lama ayo langsung simak baik-baik.

Silahkan ikuti terlebih dahulu Tutorial di bawah ini :

Langkah 1 : Silahkan pilih salah satu situs animasi yang menurut sobat cocok dengan keinginan sobat diantaranya...

situs naruto http://narutobase.net/Naruto-Animated-Gifs/Naruto/0

situs skull ( tengkorak ) http://bestanimations.com/Humans/Skulls/Skulls2.html

situs flowers ( bunga ) http://www.picgifs.com/graphics/flowers/

Jika sudah ada yang cocok gambar animasi gif diantara situs tersebut caranya ambil link dari gambar animasi tersebut dengan cara di bawah ini

arahkan corsur sobat pas ditengah - tengah gambar tersebut , saya ambil contoh gambar logo blogs ini , kemudian klik kanan nah disitu akan keluar alamat link gambar tersebut , bisa lihat contoh gambar di bawah ini

Cara Pasang dan Kumpulan situs Animasi untuk di pojok blog

Silahkan simpan link tersebut ke notepad , perhatikan linknya itu yang saya block hitam

Langkah 2 : Log in terlebih dahulu di blogs sobat lalu pilih Tata Letak >> Tambahkan Gadget >> kemudian pilih HTML/JavaScript dan sisipkan kode script di bawah ini

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://variasiblogger.blogspot.com/2013/05/cara-pasang-dan-kumpulan-situs-animasi.html" target="_blank"><img border="0" src="DISINI LINK ALAMAT GAMBAR ANIMASI PILIHAN SOBAT" title="My widget" alt="Cara Pasang dan Kumpulan situs Animasi untuk di pojok blog" /></a><small><center><a href="http://variasiblogger.blogspot.com/2013/05/cara-pasang-dan-kumpulan-situs-animasi.html" target="_blank">My Widget</a></center></small></div>

Silahkan ganti teks yang berwarna merah di atas dengan link animasi pilihan sobat , Simpan dan lihat hasilnya semoga bermanfaat

Contoh widget animasi CCTV

<script language="JavaScript" src="https://sites.google.com/site/variasibloggerblogspotcom/widget_variasi_blogger_blogspot_com/cctv.js" type="text/javascript"> </script> <script language="JavaScript" type="text/javascript"> cot("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjGVulrrBvvW7uoN4C2gN0Prnu440_y45jqVfeOjBR4H3EOUzpcSvuH6lRVZmHJxwyxshbedhK2setGACYmMsek5o-zzd3DTOTk5hwgj3dJHLfLEk4JHQavCR2ozV_g3dTVF403g7HKCI/s1600/cctv.gif")</script>

Contoh widget animasi semut muter - muter di blogs

<div style="display: scroll; left: 30px; position: fixed; top: 250px;">
<img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdOsPNC3Bk6RChXpYY7Xg35z3peiy-HAQ9CogDbkZyl3b90_VYd0kBP1ClZDRgKc3SgepBvqJgFFqjDKTaIM70YVjc_W5DGikjq5N-3mu5J4b_1wxhO18hy6iFjcUBtQ4mR-J5ij5pZ20/s1600/semut.gif" /> </div>

By: Unknown On 18.13

Kumpulan Widget Keren Untuk Blog

Halo semua. Hari ini saya akan meng-share postingan baru tentang widget. Widget ini berfungsi untuk memperindah blog anda. Ok langsung saja simak baik-baik ya gan.

Cara Pasangnya 1. loggin blog masing masing 2. pilih widget yang kamu suka lalu copy scriptnya 3.klik tata letak > Tambahkan Gadget > HTML/JAVASCRIPT 4. Pastekan script tadi di kolom HTML bukan RICH TEXT 5. klik SIMPAN
INILAH KUMPULAN WIDGET Bergerak Yang Unik Dan Keren

By: Unknown On 17.46

Senin, 09 Februari 2015

Cara Membuat Related Post Dengan Gambar

POSTING tentang cara membuat related post dengan foto atau gambar thumbnail (Related Posts with Thumbnail Image) ini dibuat terkait pertanyaan dan permintaan seorang pengguna template New Johny Wuss. Ia ingin menggunakan posting terkait yang menampilkan foto dan judul.

CB menggunakan kode related post dengan gambar yang di-share oleh Help Bloggerdengan sedikit modifikasi dan "membersihkannya" dari kemungkinan ada injeksi link.

Demonya bisa dilihat di blog Cibi Magz. Lihat bagian Related Posts di bawah postingan.

Pengguna New Johny Wuss lainnya boleh mempraktekan ini. Caranya, sebelumnya HAPUS dulu SEMU kode di template yang bertuliskan "related post, lalu lakukan dua langkah mudah berikut ini

Cara Membuat Related Post dengan Gambar di Blogspot

1. Copy + Paste kode di bawah ini DI ATAS kode </head>

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#related-posts{float:left;width:auto;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #f2f2f2;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;width:100px;height:80px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;}
#related-title {color:#0033cc;text-align:center;padding: 0 5px;font-size:12px Arial; line-height:16px;text-shadow:0 2px 2px #fff;height:28px;width:100px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>

Catatan: kode berwarna biru adalah ukuran gambar/foto yang akan ditampilkan, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

2. Copy + Paste kode di bawah ini DI ATAS kode <div class='post-footer'> (di template New Johny Wuss ada dua kode begini, pilih kode YANG KEDUA):

<b:if cond='data:blog.pageType == "item"'><div id='related-posts'><b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != "true"'></b:if><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=5"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl="<data:post.url/>";
var maxresults=5;
var relatedpoststitle="<b>Related Posts:</b>";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div class='clear'/>
</b:if>

Catatan: kode berwarna biru adalah jumlah related post, bisa diubah sesuai selera, bisa lebih besar atau lebih kecil.

Jangan lupa SAVE Template! Good Luck and Happy Blogging!

By: Unknown On 03.04

Memberikan Title Link dan Tag Title Gambar pada Popular Post

Widget popular post merupakan wiget yang berguna untuk mengetahui bacaan yang paling sering dibaca , sebagian besar para blogger memasang widget popular post di templatenya , . Kali ini saya akan memberikan tutorial bagaimana cara Memberi Title Tags Pada Thumbnail dan Link Popularpost , tutorial ini juga berfungsi untuk menaikan nilai score seo anda ketika di cek di chkme . untuk melihat demo , silahkan arahkan mouse anda ke widget popular post yang saya pasang , atau bisa lihat gamnar di bawah ini

Memberikan Title Link dan Gambar pada Popular Post

Cara Memasang Title Tags Pada Thumbnail dan Link Popularpost

Pertama login dulu ke dashbor blog anda
Kemudian Pilih Template => Edit HTML => Lompatke widget => Popular Post

Anda nanti akan menemukan kurang lebih widget seperti ini

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
,,,,,,,,,,,,,,
</b:widget>

Kemudian Ganti kode tersebut dengan kode dibawah ini

<b:widget id='PopularPosts2' locked='false' mobile='yes' title='Entri Populer' type='PopularPosts'>
  <b:includable id='main'>
        <b:if cond='data:title'><h3><data:title/></h3></b:if>
        <div class='widget-content popular-posts'>
       <ul><b:loop values='data:posts' var='post'>
         <li><b:if cond='data:showThumbnails == &quot;false&quot;'><b:if cond='data:showSnippets == &quot;false&quot;'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a><b:else/><div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div><div class='item-snippet'><data:post.snippet/></div> </b:if><b:else/><b:if cond='data:showSnippets == &quot;false&quot;'><div class='item-thumbnail-only'><b:if cond='data:post.thumbnail'><div class='item-thumbnail'><a expr:href='data:post.href' target='_blank'> <img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:title='data:post.title' expr:width='data:thumbnailSize'/></a></div></b:if><div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div></div> <div style='clear: both;'/> <b:else/><div class='item-content'><b:if cond='data:post.thumbnail'><div class='item-thumbnail'><a expr:href='data:post.href' target='_blank'><img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:title='data:post.title' expr:width='data:thumbnailSize'/></a></div></b:if><div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div><div class='item-snippet'><data:post.snippet/></div> </div><div style='clear: both;'/></b:if></b:if></li></b:loop>
       </ul>
        </div><div class='clear'/>
      </b:includable>
</b:widget>

Simpan Template dan lihat hasilnya , Taraa kini widget popular post anda sudah ada tag title dan tag linknya , untuk mengetesnya silahkan arahkan mouse anda ke widget popular post tersebut , jika seperti punya saya , bearti anda sudah berhasil

Selain menambahkan title link dan title tag , code tersebut juga berfungsi untuk menaikan nilai score seo anda , ketika anda cek di chkme , kalau gak percaya silahkan buktikan , dengan mengecek sebelum memasang dan setela memasang , ... hembs benarkan hehhehe , demikian sharing saya kali ini tentang Memberi Title Tags Pada Thumbnail dan Link Popularpost semoga bermanfaat bagi anda

By: Unknown On 01.56

Cara Mengganti Template Blog

Panduan cara mengganti template blog(mengubah tampilan) ini tentu untuk blogger baru yang belum tahu caramengubah tampilan blognya.

Namun, blogger lama juga bisa "mengintip"-nya, siapa tahu ada "hal baru" dalam tutorial dasar blogging ini.

*** Biar mudah dalam mengikuti panduan ini, silakan DOWNLOAD dan Print, sudah termasuk cara membuat blog lengkap.

SIAPKAN DULU TEMPLATENYA!
Yang dimaksud mengganti template blog di sini bukan ganti template dengan yang disediakan blogspot, tapi menggantinya dengan template hasil download dari situs-situs penyedia template blog seperti:

1. Download Templatenya.
Pilih template yang clean, fast loading, dan SEO Friendly. Baca review templatenya (jika ada).

Anda bisa Test ke-SEO-an demo templatnya di Chkme. Test loadingnya di GTMetrix.

2. Simpan file ekstensi xml.
Jika hasil download berupa file ZIP atau RAR, ekstrak file tersebut. Caranya:

Klik kanan > Exctract to [nama file]) sehingga menjadi file ekstensi XML.
Jika menjadi lebih dari satu file, "amankan" yang berekstensi XML.
File lain biasanya berupa "readme" atau panduan instalasi dan link.

Cara Mengganti Template Blog

1. Login ke Blogger. Ketik www.blogger.com di address bar browser Anda.
2. Klik menu Template / Tampilan di kiri bawah Dashborad Blog.

3. Klik menu Backup/Restore (Cadangkan/Pulihkan) di kanan atas Dashboard Blog.

4. Backup Template lama Anda (optional) dengan klik "Download Full Template".

5. Klik Choose File / Pilih File.

6. Anda akan dibawa menuju folder di komputer untuk menemukan file template blog. Klik file ekstensi XML yang sudah didownload/diekstrak, lalu klik "Open".

7. Klik Upload (Unggah).

8. Tunggu hingga selesai..... dan Beres! Selamat, tampilan blog Anda sudah berubah!

Mengganti Template Blog: Tahap Lanjutan

Mengganti template belum benar-benar selesai setelah langkah ke-7 tadi. Masih ada beberapa hal yang mesti diperhatikan, di antaranya:

1. Mengganti Favicon
Favorit icon. Gambar kecil yang muncul di samping blog. Siapkan gambar ukuran sama lebar-sama panjang, misalnya 100x100 pixel.

Klik Layout > Edit Favicon > Upload!

2. Mengganti Logo.

Ini jika di template baru Anda ada logo gambar. Ganti dengan logo versi Anda: Klik Layout > EditHeader > Upload!

Catatan:
- Klik "Instead of title and description" sebelum klik "Save" !
- Kadang-kadang ada template yang logonya di dalam (kode HTML). Cari file tersebut di dalam template (Template > Edit HTML) dan ganti dengan URL logo Anda.

2. Mengganti Menu.

Ganti nama-nama menu dan link-nya dengan menu yang Anda inginkan. Caranya:

Klik Template > Edit HTML > cari menu tersebut (CTRL+F) dan Ganti/Ubah.
Kadang-kadang ada template yang menu HOME-nya menggunakan link desainer template.
Cek menu dan link home di dalam template. Jika linknya seperti ini, <a href='/'>HOME</a>, tidak usah diubah, sudah benar. Jika tidak begitu, ganti menjadi begitu.

Anda bisa mengganti warna huruf dan warna lainnya dengan mengganti kode warna yang ada. Lihat Kode Warna HTML.

2. Cek link RSS Feed/Subscribe.

Apakah masih kosong atau menggunakan FeedBurner ID yang lain. Ganti dengan FeedBurner ID Anda!

3. Cek juga link SEARCH (jika ada).

Arahkan link searchnya ke blog Anda (jika ada nama blog lain, ganti dengan nama blog Anda).

Misalnya, ada kode begini:

maka ganti dengan nama blog Anda.

4. Cek Link Copyright!

Jika yang muncul nama blog lain, misalnya nama template, ganti dengan nama blog Anda. Umumnya sih sudah mengarah ke nama blog Anda. Tapi ada juga yang menggunakan nama template.

By: Unknown On 01.14

Tips & Trik Blog

Sabtu, 21 Februari 2015

Menambah Gadget Google+ Followers Di Blog Dengan Mudah

Jumat, 13 Februari 2015

Kumpulan Efek - Efek Keren Untuk Blog

Rabu, 11 Februari 2015

Widget Animasi Untuk Di Pojok Blog

Kumpulan Widget Keren Untuk Blog

Senin, 09 Februari 2015

Cara Membuat Related Post Dengan Gambar

Cara Membuat Related Post dengan Gambar di Blogspot

Memberikan Title Link dan Tag Title Gambar pada Popular Post

Cara Memasang Title Tags Pada Thumbnail dan Link Popularpost

Cara Mengganti Template Blog

Cara Mengganti Template Blog

Mengganti Template Blog: Tahap Lanjutan

Kategori

Arsip

Entri Populer

Tempat Terjemahan

Stat's Blog

Tentang Saya