Social Icons

Pages

Saturday, May 11, 2013

Cara Membuat Widget Recent Post Berupa Gambar Kotak-Kotak

Untuk kali ini, saya akan share Recent posts berupa gambar grid/kotak saja. sehingga lebih efisien dan canggih

Cara Membuat Widget Recent Post Hanya Gambar Grid :


Dari gambar di atas kita sudah bisa melihat bahwa yang akan ditampilkan adalah gambar dari masing-masing postingan di blog anda. Maka dari itu akan membuat blog anda lebih menarik untuk dilihat dan pasti juga akan lebih hemat tempat dan fungsional. saya menggunakan widget ini pada blog saya yang berupa download, sehingga lebih efisien dan efektif.

Berikut adalah langkah-langkah nya :


1. Masuk ke blogger >> Dashboard >> Tata Letak >> Add Gadget
2. Pilih Gadget HTML/Javascript.
3. Masukkan kode javascript di bawah ini.

<div id='bp_recent'></div>
<script style='text/javascript' src='http://bloggergadgets.googlecode.com/files/recentposts_orig.js'></script>
<script style='text/javascript'>
var numberOfPosts = 20;
var showPostDate = false;
var showSummary = false;
var titleLength = 0;
var showCommentCount = false;
var showThumbs = true;
var showNoImage = true;
var imgDim = 55;
var imgFloat = 'left';
var myMargin = 5;
var mediaThumbsOnly = true;
var showReadMore = false;
</script>
<script src='http://
reyzalteykaje.blogspot.com/feeds/posts/summary?max-results=20&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>
</div>



Ganti reyzalteykaje.blogspot.com dengan alamat blog anda,

Langkah 4 : Simpan

Kalau sudah selesai silahkan anda lihat hasilnya, bagaimana jadinya.

Cara Membuat Tombol Share Keren di Blogger

Kali ini saya akan memberikan tutorial kepada anda cara membuat tombol share keren di blogger, oke lansung aj gann,,,,,....................

Berikut ini langkah yang perlu anda lakukan :

1. Masuk ke blogger anda.

2. Masuk ke Tata letak 

3.Tambah gatget


4. Pilih HTML/JavaScript

5. Masukan Kode berikut ini :



<!-- Start Shareaholic Sassy Bookmarks HTML-->
    <div class='shr_ss shr_publisher'>
    </div>
    <!-- End Shareaholic Sassy Bookmarks HTML -->
    <!-- Start Shareaholic Sassy Bookmarks settings -->
    <script type='text/javascript'>
    var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}};
    </script>
    <!-- End Shareaholic Sassy Bookmarks settings -->
    <!-- Start Shareaholic Sassy Bookmarks script -->
    <script type='text/javascript'>
    (function() {
    var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true;
    sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js";
    var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s);
    })();
    </script>
    <!-- End Shareaholic Sassy Bookmarks script -->




6. Simpan, dan liat hasilnya......
       Contoh :

Mudah bukan... Semoga bermanfaat...