Tuesday, April 1, 2014

Mari Mengenal Base64

Sebelumnya Saya memberikan artikel tentang Emoticon Wordpress Untuk Blogger, dalam artikel tersebut ada kata base64. Kalian sudah mengenal base64 atau baru mengenalnya sekarang. Yuk, mari Kita ulas mengenai base64.

Pengertian Base64

Base64 adalah metoda yang digunakan untuk melakukan encoding (penyandian) terhadap data binary sehingga menjadi “printable” atau pendek katanya data binary disandikan menjadi format 7-bit character semacam bagian isi email.

Saya hanya akan menjelaskan arti inti dari sebuah base64, karena apabila kita jelaskan akan sangat panjang atau Anda juga bisa membacanya lengkap di Wikipedia http://en.wikipedia.org/wiki/Base64.

Intinya Base64 adalah kode yang disusun oleh 64 karakter, dimana karakternya ( berdasarkan : RFC 1421 ) terdiri dari ( A-Z, a-z, 0-9, +, /)  atau “ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/”. Tapi ada satu karater tambahan yaitu “=”, yang fungsinya untuk menggenapkan atau istilahnya sebagai pengisi pad.

Contoh Penggunaan Base64

Untuk lebih memahami Base64 Saya akan memberikan contohnya dengan mengubah gambar ke Base64. Misalkan Anda mempunyai gambar dengan ukuran 10 Kb, maka apabila Anda merubahnya ke base64 ukurannya akan sama 10 Kb tetapi dirubah ke dalam sandi yang sulit diterjemahkan. Apabila Anda menyimpan data base64 tersebut ke Template Anda, maka ukuran file template Anda akan bertambah 10 Kb. Berikut adalah gambar
Logo Kang Mousir
Ini adalah URL dari gambar diatas
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZKHaBM-qQcfym1Xp_It295X_zJCB2cYp84IGIgjsLGgvLyiqwYSoRI_TmytjXJDz-1USfpMnqKz-FmmKdbyg6HABKZUAKGUZzNEgnxcEMuxoyuzp3fJnZeZtDq2a7v9D0Ur3TXQLWxfsA/s1600/KM+Icon.png
Kemudian Saya rubah ke data Base64 String, menjadi seperti ini. 
data:image/png;base64,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
Coba Anda buka kedua data tersebut di browser Anda, keduanya akan terlihat dengan gambar yang sama. Namun coba Anda bandingkan kecepatan kedua data tersebut. Pada URL pertama saat dibuka browser harus membaca data tersebut kemudian diproses dahulu dimana gambar tersbut di unggah. Sedangkan pada data base64 gambar langsung terbuka, karena semua data diproses dalam satu kali.

Support

Base64 tentunya tidak dapat dibaca di semua browser, oleh karena itu base64 hanya support pada browser dibawah ini.
  • Internet Explorer 8+
  • Google Chrome
  • Opera Mini
  • Firefox
  • Safari
Kita juga bisa merubah file ke base64 seperti Gambar, Font, File HTML, CSS, JS dll.

Alat Untuk Merubah File Ke Base64

  • www.motobit.com/util/base64-decoder-encoder.asp‎
  • www.base64decode.org
  • webcodertools.com/imagetobase64converter‎
  • www.freeformatter.com/base64-encoder.html‎
  • www.opinionatedgeek.com/dotnet/tools/base64encode/
Dari alat diatas Saya sering menggunakan webcodertools.com/imagetobase64converter‎ karena lebih mudah dan cepat ( menurut Saya ).
Itulah penjelasan yang dapat Saya berikat tentang Base64. Semoga dengan adanya artikel ini Anda dapat memahami tentang Base64. :D
Posted by at No comments:
Labels: , , ,

Monday, March 31, 2014

Emoticon Wordpress Untuk Blogger

Setelah membahas tentang SEO kali ini Saya akan mencoba berbagi tutorial kecil yaitu Emoticon Wordpress Untuk Blogger. Emoticon ini Saya gunakan pada blog ini, emoticon ini memiliki kelebihan yaitu lebih ramah terhadap loading blog, karena Saya merubah gambar ke base64. Emoticon ini Saya ambil dari sini http://codex.wordpress.org/Using_Smilies.

Langkah Pertama : Memasang CSS

Lalu silakan Anda simpan kode CSS ini berada di atas kode ]]></b:skin> atau </style>.

.emoWrap{margin:0 auto;text-align:center}
.emo,.emoKey{display:inline-block;*display:inline;vertical-align:middle}
.emoKey{width:auto;border:1px solid #ccc;background-color:white;font:normal bold 11px/normal Arial,Sans-Serif;padding:2px;margin:0 0 0 2px;color:black}

Langkah Kedua : Memasang jQuery

Agar emoticon ini berkeja pakai jQuery versi dibawah ini, dan simpan diatas kode </head>
<script async='async' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
Silakan Anda simpan jQuery ini diatas kode </body>.

<script type='text/javascript'>
//<![CDATA[
// Automatic Emoticons by Taufik Nurrohman
// http://gplus.to/tovic -  http://dte.web.id
// Modification - Wordpress Emoticon For Blogger by Kang Mousir
// http://gplus.to/mousir - http://kang-mousir.blogspot.com

var emoRange = ".comment_reply_form,.div.comment-form,#comments p, div.post-body, div.emoWrap",
    emoMessage = "Untuk menyisipkan emoticon setidaknya Anda harus menambahkan satu spasi di awal simbol.";
(function ($) {
    $(document).ready(function () {
        function emo(emo, imgRep, emoKey) {
            $(emoRange).html(function () {
                return $(this).html().replace(/<br ?\/?>(:|;|=|\^)/ig, "<br> $1").replace(emo, " <img src='" + imgRep + "' class='emo delayLoad' alt='" + emoKey + "' />")
            })
        }
        emo(/\s:\)/g, "data:image/gif;base64,R0lGODlhDwAPALMOAP/qAEVFRQAAAP/OAP/JAP+0AP6dAP/+k//9E///////xzMzM///6//lAAAAAAAAACH5BAEAAA4ALAAAAAAPAA8AAARb0EkZap3YVabOGRcWcAgCnIMRTEEnCCfwpqt2mHEOagoOnz+CKnADxoKFyiHHBBCSAdOiCVg8KwPZa7sVrgJZQWI8FhB2msGgwTXTWGqCXP4WBQr4wjDDstQmEQA7", ":)");
        emo(/\s:D/g, "data:image/gif;base64,R0lGODlhDwAPALMNAEVFRf/qAAAAAP/////OAP/JAP+0AP6dAP/+k//9E///x///6//lAAAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARZsEkJap241aUQIhcGcEkSnMQBTEBnnnC6aogpwHcAasqbB7mCCoD4wXCGSlHAbDqTANtgSh0IClACsEq9qjRaAfe6AxMYTvKXQiAU3m9ZpmKoG4YZlmU2iQAAOw==", ":D");
        emo(/\s:\(/g, "data:image/gif;base64,R0lGODlhDwAPALMMAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///x//lAP//6wAAAAAAAAAAAAAAACH5BAEAAAwALAAAAAAPAA8AAARYkEkZap2Y1ZXOGRcWcAgCnEMRTEEnnLCQrtrxwjGoJSZw+yeCKnDo/W4EQ+WAawKSlZ4zqAwMpieFcGU9Cb7fp04zGPwACpmKVSa43bNMxUA3DDMsC20SAQA7", ":(");
        emo(/\s:\-\o/ig, "data:image/gif;base64,R0lGODlhDwAPALMNAP/qAEVFRQAAAP/////OAP/JAP6dAP+0AP/+k//9E///x//lAP//6wAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARbsEkZap24VaYQIhcWcEkCnIQRTEEnCCfwpquGmHEOagoOn7+CKnADxoKHCiLHBBSSAZzs9To9KwTgYLsVLISrQFbA7RZ2GgJhQTbTWOoC9azKVA74wzDDstQmEQA7", ":-o");
        emo(/\s@@,/g, "data:image/gif;base64,R0lGODlhDwAPALMNAP///wAAAP/qAEVFRf/OAP/JAP+0AP6dAP/lAP/9E//+k///6///xwAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARXsEk5ap241cWUIhcWjEkinGMwBUAbnALrNnILvLUr77Gr264eMDCovVA24iCRgqFGhgrBSUUUDgPN9HksgCgEAsJpJWAng3BhvTZnMRWD3IB9ZzQWuyQCADs=", "@@,");
        emo(/\s\:s/g, "data:image/gif;base64,R0lGODlhDwAPALMMAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///x//lAP//6wAAAAAAAAAAAAAAACH5BAEAAAwALAAAAAAPAA8AAARYkEkZap2Y1ZXOGRcWcAgCnEMRTEEnCCfwpqt2mHEOagkOnz+CKnADxoKGyiHHBBCSAVzz9KwMpieFcBW4/mQvwk4zGCheMC2NVSa43WtRwEA3DDMsS20SAQA7", ":s");
        emo(/\s:-d/ig, "data:image/gif;base64,R0lGODlhFwASALMMAEVFRf/qAP/////OAP/JAP6dAP/9E/+0AP/+k///x///6//lAP///wAAAAAAAAAAACH5BAEAAAwALAAAAAAXABIAAASDkMlJqwQY2F2xEBgnAt+nddlJkaXKYEqCIEM4seYdG0bgDwUVDnSR9XxI4AlnAyAMGCTgl2oVob5pQEsIglIa5xFJJhwypa+TzA6YPelvT8sGvOEtwGDb3nbBKS97dFkENSBxSwMDC2CGXkNEF4sElZVKJoArAAedB0FVaTabGaSBDBEAOw==", ":-d");
        emo(/\s:wow:/ig, "data:image/gif;base64,R0lGODlhDwAPALMKAEVFRf/qAP/MAP////+pAP/+qP/9EzExMf///p4AAP///wAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFDAAKACwAAAAADwAPAAAETFBJCWqdWFVUurgYwBlGYAoEMAFdab6oqhXuC6tsWb17nAc7Uy/FshkDvtoRSRQsYSmNUxgUfChWKgAZW1k/FWs0BCCYzaCMxiKbRAAAIfkEBQwACgAsAwAEAAkABAAABBBQAaDqlGNQkOc527dRFhUBACH5BAUMAAoALAIAAwALAAkAAAQeUCkA5KwSjFE1n4PEhQqniWfZbeuXYZclz3QtJ3MEACH5BAUMAAoALAEAAgANAAgAAAQgUEkApKJ2jlHBrprEDWJHWmfpZanCXedYWt5bgzSOSREAIfkEBQwACgAsAQACAA0ACAAABCVQyWKkCsJOAMLl2SZ1wJgVpZWOBKqtCkB8Y5AC4dfpnhb0F2AEACH5BAUMAAoALAEAAgANAAgAAAQgUEkApKJ2jlHBrprEDWJHWmfpZanCXedYWt5bgzSOSREAIfkEBQwACgAsAQACAA0ACAAABCVQyWKkCsJOAMLl2SZ1wJgVpZWOBKqtCkB8Y5AC4dfpnhb0F2AEACH5BAUMAAoALAEAAgANAAgAAAQgUEkApKJ2jlHBrprEDWJHWmfpZanCXedYWt5bgzSOSREAIfkEBQwACgAsAQACAA0ACAAABCVQyWKkCsJOAMLl2SZ1wJgVpZWOBKqtCkB8Y5AC4dfpnhb0F2AEACH5BAUMAAoALAIAAwALAAkAAAQfUCkTpApVGgBq4NUmdcAoiAppXiDbWRicWXRt32MdAQAh+QQFDAAKACwDAAQACQAEAAAEC9CESSkAFoebqw8RADs=", ":wow:");
        emo(/\s8\)/g, "data:image/gif;base64,R0lGODlhDwAPALMNAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///x//////lAP//6wAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARZsEkZap24VZbOGRcWcAgCnEMRTEFnnnC6ascLx2sr7DvA76rAgacQ+HZFQ+VwNJ54BGXAdoNFK4PqbUFQabJOmIAAogwGi99YxjoT3m+2KGCoG4IZlmU2iQAAOw==", "8)");
        emo(/\s:x/ig, "data:image/gif;base64,R0lGODlhDwAPALMNAP/qAEVFRQAAAP/OAP/JAP+0AP6dAP/+k//9E///////x///6//lAAAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARbsEkZap241aXOGRcWcAgCnIMRTEEnnLCQrtphvicOaooJ/wCCKmADCHDGF6FQOcSeQWbAB4QtK4PY8QhgCFeBrCBBJgsIO81gsG3PWGuCXP4WBQr4wjDDstAmEQA7", ":x");
        emo(/\s:P/ig, "data:image/gif;base64,R0lGODlhDwAPALMOAP/qAEVFRQAAAP/OAP8AAP/JAP+0AP6dAP/9E//+k///x///6zMzM//lAAAAAAAAACH5BAEAAA4ALAAAAAAPAA8AAARd0EkZap3Y1aVSGhcWcAgCnMMRTEEnCCfwpquWmHEOagoOn7+CKnADxoKGSiLHBBSSAROjCWA8KwPZa7sVrgJZAWE8FhR2msGgESAHziqWutB+0zIVg94wzLAsNRMRADs=", ":P");
        emo(/\s:\|/g, "data:image/gif;base64,R0lGODlhDwAPALMMAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///x//lAP//6wAAAAAAAAAAAAAAACH5BAEAAAwALAAAAAAPAA8AAARYkEkZap2Y1ZXOGRcWcAgCnEMRTEEnnKcgpKt2vHAOaokJ4L8TQRU4+IA4gqFyyDkByorvKVwGBtSTYri6/mRgAWGnGQwUuS2NZSa43WtRwEA3EDMsS20SAQA7", ":|");
        emo(/\s;\)/g, "data:image/gif;base64,R0lGODlhDwAPALMMAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///x//lAP//6wAAAAAAAAAAAAAAACH5BAEAAAwALAAAAAAPAA8AAARXkEkZap2Y1ZXOGRcWcAgCnEMRTEEnnDCQrtrxxjCoJSZw+y+CKnDo/WAEQ+WAwyUrvWZQGRg0TwKFcFX1xYI6zWCgEJizhBlrTGi31aKAYW4YZlgW2iQCADs=", ";)");
        emo(/\s:lol:/ig, "data:image/gif;base64,R0lGODlhDwAPALMNAEVFRf/qAAAAAP/////OAP/JAP+0AP6dAP/9E//+k///x///6//lAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFFAANACwAAAAADwAPAAAEWrBJCWqduNWlUiIXBiyCgARBeQAToJhonK5UcgoxHoCacuspXGEFsMmOBUMlATymlABEaUotQQmpgXY7EAxZAKyA2y3wNAQCo2qmUdKFeJzgbgEMeAMxY7dkIgAh+QQFFAANACwCAAIACwAHAAAEE7BJJFuoOOvNq+if8GGiNAzZ2UQAIfkEBQoADQAsBQAHAAUAAgAABAVQSDlqjQAh+QQFCgANACwFAAcABQACAAAEBTBIKWqNACH5BAUKAA0ALAUABwAFAAIAAAQFUEg5ao0AIfkEBRQADQAsBQAHAAUAAgAABAUwSClqjQA7", ":lol:");
        emo(/\s:oops:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQfAPqzAP3KAOBsAPeOW//3zftoaP62dfecAP/Sh/ykaf+3t/6YmOdzSkVFRf/k5P/69f/MzP/qAPiAgP/86frXAP7jAPmmpv/8E/7Lg//+k+NfX9lINgAAAP/lmfrBewAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFFAAfACwAAAAADwAPAAAFZuAnik1ZjuhXTkSWBSfasNcV3cHRjE3L3UBObqfK/IBBmIpgixydOF0jY+M8rZEAoJSpUCrIiFdbugAAFGTlfC6dDwHwjQI42HcNQCBt5XjhRA0BcWqDOjyDiYmHMnlsUik8JkQjIQAh+QQFCgAfACwBAAEADQANAAAFUeAnfs9EEMY4ll2HvMYwmt9rf7FI1PadTi4ETwgbEFyiW82QIHgMmB7imUggBgyrzYMdVBmbQc8AZsgGA49QhEl4RQZoDxOXweP4ukpUrdpFIQAh+QQFMgAfACwBAAEADQANAAAFSOAnik65jKgDQUq7FGP5tfT3kjNdn2qbK7lXT1SbLSQOi0XXUh4VEs1CZ4lKrpqPhJotwK7LkeIlES2mzDPMfG6rUaLrdS0KAQAh+QQFCgAfACwBAAEADQANAAAFUOAnihNBGGM6dR3iGsNYfm79wSJB1za6ujvEDkZoiWw0Q4LgMWB4iGYigRgwqDWPdTBlfAY8g5cRGww8QhEmwRUZnDzMO+Z+2+cp0XRKF4UAACH5BAUKAB8ALAEAAQANAA0AAAVR4Cd+E5FlwTiW1xW9wTGa32t/sZjV9p0SrghPCDtkXKJbLQDIUAKVXuTJjBwEgB7legAABIJDLwA+yAAHilBUQQNEAWivEpfB4/i6SuT12kUhADs=", ":oops:");
        emo(/\s:cry:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQQAP/qAEVFRQAAAP/OAP/JAP6dAP+0AP/+k//9E///////x///6//lAACM2IG71l5eXgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFHgAQACwAAAAADwAPAAAFXCAkikFZjihULspxDCcasAgC3EMRjEEr3EBBbqc6/IBBmEphQyIJusDBJjgCqgCCoXRwOrWlpvcGDgzGNwZ0Z75V31mlajB4IBmPIY9O6Pf1MgEGgwZRKTwmRCMhACH5BAUUABAALAQABQAHAAcAAAURICRA5EieZNKcTYK+MGyeQggAIfkEBQoAEAAsBAAIAAcAAQAABQZg4kCkk4QAIfkEBQoAEAAsBAAHAAcAAwAABQogII5AkoymiSYhACH5BAUKABAALAQACAAHAAMAAAULIABApEieZIJCSQgAIfkEBQoAEAAsBAAHAAcABAAABQ1g0gBkk5BoqgJC2wIhACH5BAUKABAALAQACAAHAAEAAAUGYOJApJOEACH5BAUKABAALAQABwAHAAMAAAUKICCOQJKMpokmIQAh+QQFCgAQACwEAAUABwAGAAAFDyAEQORInmgKmCKLJmkSAgA7", ":cry:");
        emo(/\s:evil:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQQAEVFRf/qAAAAAP/OAP/JAP6dAP/9E/+0AP8AAP/+k///x/4qAP5tA5aWlv/lAP//6wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAABAALAAAAAAPAA8AAAVpIABApGiSkLmYj5IkgyoyhaEYRqAPQ8GINUBORwT0AA1AwiAg6pqx5C0gaD6bhIJoKUBUqV0B4bClIhDEs5gsvBK/Y9HASXdkR8ZrFRsr8aw6DgJHKEYDBIiIhCgpAAePB1ojjIUmkyghADs=", ":evil:");
        emo(/\s:twisted:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQRAEVFRf/qAAAAAP/OAP6dAP/9E/+0AP8AAP/////+k//JAP//x/4qAJaWljMzM/5tA///6wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAABEALAAAAAAPAA8AAAVrIABEpGiSkcmY0JIkgyo+RLEURaAPA/GINUBORwT0AA1AoiAg6pqx5C0gaD6bCoJoKThUqV2BwrClHg7Es5gsvBK/Y9Eg4HASHdmRscrvx0o8AgiDgwJHKEYxfEZaKCUABpEGWiOOiCaVKCEAOw==", ":twisted:");
        emo(/\s:roll:/ig, "data:image/gif;base64,R0lGODlhDwAPALMNAEVFRf/qAAAAAP/OAP/JAP////6dAP+0AP/+k///x//9E//lAP//6wAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFCgANACwAAAAADwAPAAAEXrBJCWqduFWWEBoXBnCKEpyDAUxAJwhn8KarhghFAeM6qCW8XFCnAtx0uGTyUEHIXjsogQkwPWOvwLQyiHlPC4JK0/2eCD7yYAGAAtBjymBAqNdpmcphfyhmWBY1ExEAIfkEBQoADQAsBAAFAAgAAwAABAqwiFnkvFbYoGcEACH5BAUKAA0ALAQABAAHAAQAAAQLsIlG5ayz1Kb5LhEAIfkEBTIADQAsBAAEAAgAAwAABApQtNkkLbThgiePACH5BAUUAA0ALAkACgACAAIAAAQEsAnRIgAh+QQFCgANACwEAAQABwAEAAAEDbCURmUBtIErMOhahkUAIfkEBQAADQAsAgACAAsABwAABB2wSSEbrTJUXVX4zQcqQikEpkBMTdFaWFnJGxdyEQAh+QQFAAANACwCAAIACwAGAAAEFrBJJVuoOFehG7dBCIrKJwQmMV6hGAEAIfkEBQAADQAsAgACAAsABgAABBawSSEbrThLpVuYQmiFlFBIhYmW5ChGADs=", ":roll:");
        emo(/\s:!:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQdAP/qAEVFRf/OAP/JAP/9E/+0AP6dAP/+k///x391AP/lAAAAAL+vAP//68W1Bi8vL9LBBfPfBHFvV3JwWL+wAEpHKbGiAgMDA21rUxQUFOnXBvvnAFNPJgAAAAAAAAAAACH5BAEAAB0ALAAAAAAPAA8AAAVpYCeKQVmOaFc2yHEIJxqwBAHcghGMQWsnCwZORzrYAEAhbtc7Ii+UG2CgCxillox0Wigdto7KdtANOAEOzrgs2G4gUgWV2b5JHpPbAEYSCBQAGhgRcjk7fQIDioqGKSUFkAVVKTwmhyMhADs=", ":!:");
        emo(/\s:\?\:/ig, "data:image/gif;base64,R0lGODlhDwAPAMQaAEVFRf/qAP/OAP/JAP6dAP+0AP/9E//+k+/bAH91AAAAAN/NAP//x8++AA8OAL+vAP/lAC8rAJ+SAP//6x8cAF9XAN+wAO+8AL+XAG9mAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAABoALAAAAAAPAA8AAAV1oCaKQFmOqFZOzHEIJwqwhhHcAgGMQGsskooEEcjtVAcDwkFJUBSL4q5nS0ADy0xgoAMksY1bQ5HYFkqHm7rhiBAHZ4BNHWgTzSUB/aF43CBcU3piCVFbMCQCAhABVg+ARjyKAxYYFwORMgAFnAVdKTwmRyMhADs=", ":?:");
        emo(/\s:idea:/ig, "data:image/gif;base64,R0lGODlhDwAPALMNAEVFRf/qAAAAAP/////OAP/JAP+0AP/9E/6dAP/+k///x//lAP//6wAAAAAAAAAAACH5BAEAAA0ALAAAAAAPAA8AAARdsEkJap24VaZSIhcGcMcRnAQCTEBnCjCqUsk73AK6tvaNBwUVoBYQ4H4FQyVxMg6cuWTF1Hw+T1IA4dSMBRbB3babA4IoBMKiCAOnVmhCoSCYvzMVg94gzLAscBMRADs=", ":idea:");
        emo(/\s:arrow:/ig, "data:image/gif;base64,R0lGODlhDwAPALMMAP/qAEVFRQAAAP/OAP/JAP/9E/6dAP+0AP/+k///x//lAP//6wAAAAAAAAAAAAAAACH5BAEAAAwALAAAAAAPAA8AAARXkEkZap2Y1ZUQGhcWcEUBnIMRTEFnnnC6asgLCEK8tvaJnwRVoHbDGXOEQwXhOxqTlZfzBw0MYLCfIri7ZnMAAogyGCiwWxmrTGi31aLAYX4QZliW2SQCADs=", ":arrow:");
        emo(/\s:mrgreen:/ig, "data:image/gif;base64,R0lGODlhDwAPANUAAAAAAP///wDywwDuvwDsvgDqvADktwDitgDgtADcsQDarwDYrgDWrADSqQDOpgDKogDIoQDGnwDEngC+mQC8lwC4lAC0kQCyjwCujACqiQCohwCmhQCggQCcfQCafACWeQCOcgCKbwCGbACCaQB+ZQB8ZAB4YP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAACcALAAAAAAPAA8AAAZ6wJNQCCgWh8hTcQJpKAxHJEBzoTQVh4IAMAR0NkWJY1EcbIkeAKYCeAASBwCBCwB9OBkLJeJgJBAGUAAhRoWFCUUiAAEBi4yOAA1FI5CMjY8QRSWVj48TdCSLjpcAF1xKJqGjRRsap6iqRh4dr0QAJSMiISBRSUqFSUEAOw==", ":mrgreen:");
        var one = 0;
        $(document.body).on("click", function () {
            $('.emoKey').remove()
        });
        $('.emo').css('cursor', 'pointer').live("click", function (e) {
            $('.emoKey').remove();
            $(this).after('<input class="emoKey" type="text" size="6" value=" ' + this.alt + '" />');
            $('.emoKey').trigger("select");
            if (emoMessage && one === 0) {
                alert(emoMessage);
                one = 1
            }
            e.stopPropagation()
        })
    })
})(jQuery);
//]]>
</script>

Langkah Ketiga : Memasang Emoticon

Sebenarnya emoticon ini bisa simpan di mana saja, namun disini Saya akan menjelasakan emoticon ini di simpan di pesan komentar. Pertama masuk ke Setelan blogger Anda seperti gambar dibawah ini.
Setelan Komentar Blogger
Kemudian pada Pos dan Komentar isi dengan kode dibawah ini tepat di Pesan Formulir Komentar lalu Simpan. 
 :) :D :( :-o @@, :s :wow: 8) :x :P :| ;) :lol: :oops: :cry: :evil: :twisted: :roll: :!: :?: :idea: :arrow: :mrgreen: :-d

Data Emoticon Wordpress Untuk Blogger

IconTeks
:) :)
:D :D
:( :(
:-o :-o
@@, @@,
:s :s
:wow: :wow:
8) :D
:x :x
:P :)
:| :|
;) ;)
:lol: :lol:
:oops: :oops:
:cry: :cry:
:evil: :evil:
:twisted: :twisted:
:roll: :roll:
:!: :!:
:?: :?:
:idea: :idea:
:arrow: :arrow:
:mrgreen: :mrgreen:
:-d :-d
Posted by at No comments:
Labels: ,

Sunday, March 30, 2014

Memasang Author Rich Snippet

Artikel ini adalah lanjutan dari artikel sebelumnya tentang Mengenal Author Rich Snippet. Bagi yang belum mengenal Author Rich Snippet silakan baca artikel Saya sebelumnya. Untuk memasang Author Rich Snippet dibutuhkan akun Gmail yang terintegrasi dengan Google Plus.

Memasang Author Rich Snippet pada blog sangat mudah, Anda hanya tinggal menambahkan link rel=author pada blog Anda. Kemudian mengisi kontributor web/blog Anda pada Google Plus. Saya akan menjelaskan langkah - langkahnya, oleh karena itu silakan disimak.

Langkah Pertama : Mengisi Kepemilikan Web/Blog

Pertama masuk ke akun Google Plus Anda kemudian masuk ke menu About atau Anda juga bisa menggunakan link ini.
https://plus.google.com/Alamat atau ID Google Plus Anda/about
Bisa juga dengan cara seperti ini masuk ke alamat ini https://www.google.com/settings/account, Kemudian klik Edit Profile.

Setting Google Plus

Kemudian Anda akan dibawa pada halaman About Google Plus.

Setelan Kontributo

Silakan lihat samping kanan bawah yang terdapat kontributor, kemudian klik Edit. Nanti akan muncul pop up jendela pengisian kontributor seperti ini.

Kontributor

Pada kontributor perhatikan tanda warna merah, silakan klik Add custom link untuk menambahkan kontributor baru. Perlu di perhatikan pada tanda merah kanan atas terdapat notifikasi tampilan kontributor. Silakan pilih Publik agar Author Rich Snippet ini muncul, alasan tidak muncul bisa terjadi karena ini.

Form Kontributor

Silakan isi Label dengan judul web/blog Anda, sedangkan URL isi dengan alamat web/blog Anda. Kemudian pada setelan sebelah kanan atas pilih Current contributor.

Langkah Kedua : Memasang Rel Author

Selanjutkan Anda tinggal menambahkan rel=author seperti ini dan simpan dibawah kode <head>
<link href='URL Google Plus Anda' rel='author'/>
Maka jadinya akan seperti kode dibawah ini.
<link href='https://plus.google.com/107577168276378903527/about' rel='author'/>
Saran Saya tambahkan URL Google Plus yang terdapat ID Number. Sampai sini Memasang Author Rich Snippet pada blog sudah selesai. Untuk mengeceknya bisa Anda lihat di http://www.google.com/webmasters/tools/richsnippets.
Posted by at No comments:
Labels:

Thursday, March 27, 2014

Mengenal Author Rich Snippet

Saat Anda mendengar Author Rich Snippet mungkin Anda sudah tidak asing atau baru mengenalnya. Sebelum kita mengulas Apa Author Rich Snippet ? alangkah baiknya kita harus mengenal dahulu mengenai Rich Snippet.

Apa Itu Rich Snippet ?

Rich Snippet adalah beberapa data yang disajikan kepada mesin pencari, diantara nya seperti Judul, Alamat URL, Pemilik, Lokasi, dan lain - lain. Saat Anda mengetik kata kunci pada mesin pencari, secara otomatis mesin pencari akan menampilkan data - data yang dibuat oleh pemilik blog/web.

Berdasarkan pengalaman dan penelusuran yang Saya lakukan ternyata Rich Snippet sangat berpengaruh terhadap SEO. Namun, perlu Anda ketahui juga bahwa Rich Snippet tidak menjamin blog/web Anda berjaya di mesin pencari. Tentunya ada beberapa hal lain agar blog/web Anda berjaya di mesin pencari.

Baca :

Apa Itu Author Rich Snippet ?

Sekarang kita akan menjelaskan Apa Itu Rich Snippet ?. Author  Rich Snippet adalah data yang disajikan kepada mesin pencari, berupa Foto Author, Nama Author dan Jumlah Followers. Untuk lebih jelas mengenai Author Rich Snippet Saya sajikan dengan Screenshoot nya.
Author Rich Snippet
Itu adalah contohnya namun, terkadang Author Rich Snippet kadang muncul dengan fotonya dan kadang pula tidak seperti halnya contoh gambar diatas. Oleh karena itu Author Rich Snippet yang benar adalah seperti gambar dibawah ini. Saya ambil sampel dari trikmudahseo.blogspot.com.
Author Rich Snippet Trik Mudah SEO

Keuntungan Memasang Author Rich Snippet

Ada beberapa keutungan memasang Author Rich Snippet atau baca lebih lengkapnya 5 Keuntungan Memasang Author Rich Snippet

  1. Menambah kepercayaan Search Engine kepada blog/web Anda.
  2. Menarik perhatian pengunjung, karena dengan adanya Author Rich Snippet pengunjung akan lebih tertarik kepada blog/web Anda.
  3. Mempunyai nilai klik lebih tinggi.
  4. Memungkinkan blog/web Anda ada di halaman pertama search engine.
  5. Lebih Professional

Author Rich Snippet ini dibutuhkan akun Gmail karena data yang ditampilkan pada mesin pencari adalah data dari Google Plus. Bagi Anda yang ingin mengetahui Apakah blog Anda sudah ada Author Rich Snippet dapat mengeceknya di http://www.google.com/webmasters/tools/richsnippets. Itulah pembahasan sederhana mengenai Mengenal Author Rich Snippet. Semoga bisa menambah pengetahuan Anda semua.
Posted by at No comments:
Labels:
Subscribe to: Posts (Atom)