Cara Modifikasi Widget Popular Post Bawaan Blogger Menjadi SLIDER

23:25

Cara Modifikasi Widget Popular Post Bawaan Blogger Menjadi SLIDER

Salam Blogger, Artikel kali ini bloggingpasuruan tentang tutorial Cara Modifikasi Widget Popular Post Menjadi SLIDE. Dalam modifikasi ini bloggingpasuruan merubah tampilan widget popular post bawaan ( default ) blogger menjadi slide ( gambar berubah ubah ), dalam modifikasi ini widget juga disertai cuplikan teks dari artikel Sobat.

Lihat  Demo

Pada umumnya demo slide bisa Sobat temui pada Template karya lasanta, namun pada slide karya lasanta Sobat harus memasukkan gambar dan teks secara manual. Kelebiahan Modifikasi Widget Popular Post Menjadi SLIDE yang akan saya sajikan ini memiliki kemiripan dengan SLIDE karya lasanta NAMUN Sobat tidak akan melakukan perubahan apapun secara manual. 

Langkah Membuat Modifkasi Widget Popular Post SLIDER

1. Masuk ke Akun Blogger Sobat

2. Pilih TEMPLATE >>EDIT HTML

3. Sebelum melakukan perubahan backup template Sobat terlebih dahulu.

4. Cari kode <head> , Untuk mempercepat pencarian gunakan Ctrl + F untuk mencari kode <head>

5. Letakkan kode di bawah ini sebelum kode tag <head>

Kode Modifikasi Widget Popular Post Bawaan ( default ) Blogger
<script src='https://www.google.com/jsapi' type='text/javascript'/>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>//<![CDATA[
/**
script ini ditulis oleh konfluen Bentuk LLC http://bloggingpasuruan.blogspot.com setiap pembaruan untuk script ini akan diposting ke Tutorial SEO dan Blogger Tips silakan tinggalkan pesan ini dan sebagai kredit di mana kredit ini disebabkan!
**/
var slideshow_interval        = 4500; //dalam mili detik
var slideshow_fade_duration = 1000; // dalam mili detik
var slideshow_width           = 235; //dalam ukuran pixels
var image_redimension         = (slideshow_width * 1.5).toFixed();

$(document).ready(function() {
    $('#PopularPosts1 ul').each(function(){
            $('<button>').attr('id','prev').css('float','left').text('<<').insertAfter('#PopularPosts1 ul');
            $('<button>').attr('id','next').css('float','right').text('>>').insertAfter('#PopularPosts1 ul');
        function slideshow_jump(index){
            var slide_current = slideshow['slide_current'];
            $(slides[slide_current]).fadeOut(slideshow_fade_duration,function(){
                slide_current = index;
                if( (slide_current < 0) || (slide_current >= slides_count) ) slide_current = 0;
                $(slides[slide_current]).fadeIn(slideshow_fade_duration);
                slideshow['slide_current'] = slide_current;
                if(jumps){
                    var identifier_current = $(slides[slide_current]).attr('id');
                    jumps.children().removeClass('current');
                    jumps.children('[data-target="' + identifier_current + '"]').addClass('current');
                }
            });
        }
        var slideshow = $(this);
        var identifier = $(this).attr('id');
        var slides = $(this).children('li');
        var slides_count = slides.size();
        var jumps = $('#' + identifier + '-jumps');
            /* memproses daftar dan mengulang isi menggunakan thumbnail sebagai latar belakang */
            $('#PopularPosts1 ul').find('li').each(function(n, entry){
                  var entry = $(entry);
                  var image = entry.find('img').first();
                  var imageURL = image.attr('src');
                  if (imageURL){
                        if (imageURL.indexOf("/vi/") > 0){
                              imageURL = imageURL.replace("default","0");
                        } else imageURL = imageURL.replace(/s\B\d{2,4}-c/,'s'+ image_redimension);
                        entry.css({backgroundImage : "url(" + imageURL + ")"});
                        entry.find('.item-thumbnail').remove();
                  }
            });
           
            /* sembunyikan slide kecuali slide pertama, dan mengatur Indeks */
        slides.each(function(index){ if(index) $(this).hide(); $(this).attr('data-index',index); });
        slideshow['slide_current'] = 0;
        var timer = window.setInterval(function() {
            slideshow_jump(slideshow['slide_current'] + 1);
        }, slideshow_interval);

        $('#prev').click(function(){
                  if (slideshow['slide_current'] == 0){
                        slideshow_jump(slides_count - 1);
                  } else slideshow_jump(slideshow['slide_current'] - 1);
            window.clearInterval(timer);
        });

        $('#next').click(function(){
            slideshow_jump(slideshow['slide_current'] + 1);
            window.clearInterval(timer);
        });

    });

});
//]]></script>
<style>
// mengubah dimensi dari elemen lebar dan tinggi agar sesuai kebutuhan situs Anda
// pada dasarnya menyesuaikan ukuran apapun "235" menjadi ukuran yang tepat untuk blog Anda
#PopularPosts1 ul {
      list-style-type: none;
      position:         relative;
}
#PopularPosts1 ul li, #PopularPosts1 .item-content {
      width:                  235px;
}    
#PopularPosts1 ul li {
      height:                 235px;
      display:          none;
      background-repeat:      no-repeat;
      background-size:        auto 100%;
      background-position:    center center;
      margin:                 0;
      padding:          0;
} #PopularPosts1 ul li:first-child{
      display: block;
}
#PopularPosts1 ul  {
      width:                  235px;
      height:                 235px;
      margin-left:      auto;
      margin-right:     auto;
      padding:          0 0 0 0;
}
#PopularPosts1 .item-content {
      position:         absolute;
      bottom:                 0;
      margin:                 0;
      padding:          0;
    background: rgba(54, 54, 54, 0.5);
    -pie-background:  rgba(54, 54, 54, 0.5);
      color:                  #ffffff;
} #PopularPosts1 .item-content a {
      color:                  #ffffff;
      font-weight:      bold;
}
#PopularPosts1 .item-title, #PopularPosts1 .item-snippet {
      padding:    2px;
}
</style>



Catatan :
Jika Sobat ingin merubah ukuran panjang dan tingginya, silahkan rubah nilai width dan hight


6. Save template >> lihat hasilnya

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Modifikasi Widget Popular Post Bawaan Blogger Menjadi SLIDER . Semoga bermanfaat dan terima kasih...

Cara Membuat Syntax Highlighter di Blog

03:07
Cara Membuat Syntax Highlighter di Blog

Salam Blogger, Artikel bloggingpasuruan kali ini tutorial tentang Cara Membuat Syntax Highlight di Blog, Syntax Highlight Adalah fitur dari beberapa editor teks yang menampilkan teks, terutama source code dalam berbagai warna dan font sesuai dengan kategori istilah. Fitur ini memudahkan kita dalam menulis dalam bahasa terstruktur seperti bahasa pemrograman atau bahasa mark-up. 

Berikut Cara Membuat Syntax Highlight di Blog

1.) Login Ke Blogger Sobat

2.) Pilih menu Template >> Edit HTML

3.) Cari kode  ]]></b:skin> menggunakan CTRL + F

4.) Jika sudah menemukan, copy CSS dibawah dan letakkan kode di bawah ini sebelum kode ]]></b:skin> :


.dp-highlighter
{
 font-family: "Consolas", "Monaco", "Courier New", Courier, monospace;
 font-size: 12px;
 background-color: #E7E5DC;
 width: 99%;
 overflow: auto;
 margin: 18px 0 18px 0 !important;
 padding-top: 1px; /* adds a little border on top when controls are hidden */
}

/* clear styles */
.dp-highlighter ol,
.dp-highlighter ol li,
.dp-highlighter ol li span
{
 margin: 0;
 padding: 0;
 border: none;
}

.dp-highlighter a,
.dp-highlighter a:hover
{
 background: none;
 border: none;
 padding: 0;
 margin: 0;
}

.dp-highlighter .bar
{
 padding-left: 45px;
}

.dp-highlighter.collapsed .bar,
.dp-highlighter.nogutter .bar
{
 padding-left: 0px;
}

.dp-highlighter ol
{
 list-style: decimal; /* for ie */
 background-color: #fff;
 margin: 0px 0px 1px 45px !important; /* 1px bottom margin seems to fix occasional Firefox scrolling */
 padding: 0px;
 color: #5C5C5C;
}

.dp-highlighter.nogutter ol,
.dp-highlighter.nogutter ol li
{
 list-style: none !important;
 margin-left: 0px !important;
}

.dp-highlighter ol li,
.dp-highlighter .columns div
{
 list-style: decimal-leading-zero; /* better look for others, override cascade from OL */
 list-style-position: outside !important;
 border-left: 3px solid #6CE26C;
 background-color: #F8F8F8;
 color: #5C5C5C;
 padding: 0 3px 0 10px !important;
 margin: 0 !important;
 line-height: 14px;
}

.dp-highlighter.nogutter ol li,
.dp-highlighter.nogutter .columns div
{
 border: 0;
}

.dp-highlighter .columns
{
 background-color: #F8F8F8;
 color: gray;
 overflow: hidden;
 width: 100%;
}

.dp-highlighter .columns div
{
 padding-bottom: 5px;
}

.dp-highlighter ol li.alt
{
 background-color: #FFF;
 color: inherit;
}

.dp-highlighter ol li span
{
 color: black;
 background-color: inherit;
}

/* Adjust some properties when collapsed */

.dp-highlighter.collapsed ol
{
 margin: 0px;
}

.dp-highlighter.collapsed ol li
{
 display: none;
}

/* Additional modifications when in print-view */

.dp-highlighter.printing
{
 border: none;
}

.dp-highlighter.printing .tools
{
 display: none !important;
}

.dp-highlighter.printing li
{
 display: list-item !important;
}

/* Styles for the tools */

.dp-highlighter .tools
{
 padding: 3px 8px 3px 10px;
 font: 9px Verdana, Geneva, Arial, Helvetica, sans-serif;
 color: silver;
 background-color: #f8f8f8;
 padding-bottom: 10px;
 border-left: 3px solid #6CE26C;
}

.dp-highlighter.nogutter .tools
{
 border-left: 0;
}

.dp-highlighter.collapsed .tools
{
 border-bottom: 0;
}

.dp-highlighter .tools a
{
 font-size: 9px;
 color: #a0a0a0;
 background-color: inherit;
 text-decoration: none;
 margin-right: 10px;
}

.dp-highlighter .tools a:hover
{
 color: red;
 background-color: inherit;
 text-decoration: underline;
}

/* About dialog styles */

.dp-about { background-color: #fff; color: #333; margin: 0px; padding: 0px; }
.dp-about table { width: 100%; height: 100%; font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; }
.dp-about td { padding: 10px; vertical-align: top; }
.dp-about .copy { border-bottom: 1px solid #ACA899; height: 95%; }
.dp-about .title { color: red; background-color: inherit; font-weight: bold; }
.dp-about .para { margin: 0 0 4px 0; }
.dp-about .footer { background-color: #ECEADB; color: #333; border-top: 1px solid #fff; text-align: right; }
.dp-about .close { font-size: 11px; font-family: Tahoma, Verdana, Arial, sans-serif !important; background-color: #ECEADB; color: #333; width: 60px; height: 22px; }

/* Language specific styles */

.dp-highlighter .comment, .dp-highlighter .comments { color: #008200; background-color: inherit; }
.dp-highlighter .string { color: blue; background-color: inherit; }
.dp-highlighter .keyword { color: #069; font-weight: bold; background-color: inherit; }
.dp-highlighter .preprocessor { color: gray; background-color: inherit; }

5. )Cari kode </head> dan letakkan kode di bawah ini sebelum kode </head>


<script gapi_processed="true" src="https://apis.google.com/js/plusone.js" async="" type="text/javascript"></script><script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shCore.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCpp.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCSharp.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushCss.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushDelphi.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJava.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushJScript.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPhp.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushPython.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushRuby.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushSql.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushVb.js" type="text/javascript">
</script>    
<script src="http://syntaxhighlighter.googlecode.com/svn/trunk/Scripts/shBrushXml.js" type="text/javascript">
</script>

6.)Cari kode </body>dan letakkan kode di bawah ini sebelum kode </body>

<script language='javascript'> dp.SyntaxHighlighter.BloggerMode(); dp.SyntaxHighlighter.HighlightAll('code'); </script>


7.)Simpan Template

Catatan :

Setiap mempublikasikan ARTIKEL yang terdapat kode-kode di dalamnya, sobat blogger harus memasukkan kode tersebut seperti contoh di bawah ini dan jika Sobat ingin merubah ukuran kotaknya silahkan rubah cols="60" rows="10"

<textarea name="code" class="c#" cols="60" rows="10">
KODE  YANG AKAN DITAMPILKAN LETAKKAN DISINI
</textarea>

Selasai

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Membuat Syntax Highlighter di Blog. Semoga bermanfaat dan terima kasih...



Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3

01:19
Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3

Salam Blogger, bloggingpasuruan mua berbagi tentang Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3. Popular post memang sangat penting untuk di tampilkan dalam blog guna memberikan informasi seputar artikel terpopuler dari Blog kita, atau artikel yang paling sering dikunjungi.

Buat Sobat yang ingin mencoba untuk merubah tampilan popular post nya bisa lihat tutorialnya di bawah ini.


1. Login ke Akun Blogger Sobat.
2. Masuk ke bagian Template >> EDIT HTML
3. Cari kode ]]></b:skin> dan letakan kode di bawah tepat di atasnya.

.popular-posts ul{padding-left:0px;}
.popular-posts ul li {background: #FFF url(http://4.bp.blogspot.com/-oOVUW06ghgo/UHwuqL9TltI/AAAAAAAAGKU/Nj4DQnvft8k/s1600/1.gif)  no-repeat scroll 5px 10px;
  list-style-type: none;
  margin:0 0 5px 0px;
  padding:5px 5px 5px 20px !important;
  border: 1px solid #ddd;
  border-radius:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
}
.popular-posts ul
  li:hover {
  border:2px solid #6BB5FF;
background:#000000;
}
.popular-posts ul
  li a:hover {
  text-decoration:none;
color:#FFF8DC;
}
.popular-posts .item-thumbnail img {
  webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

4. Kemudian save,dan silahkan sobat lihat hasilnya.

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Modifikasi Tampilan Popular Post Bawaan Blogger ( Default ) Dengan CSS3. Semoga bermanfaat dan terima kasih...

Cara Membuat Headline News Di Blog

00:47
Cara Membuat Headline News Di Blog

Salam Blogger, Artikel bloggingpasuruan kali ini tentang kali ini tentang Cara Membuat Headline News Di Blog. Widget ini sebagai navigasi yang memberikan informasi dan kemudahan bagi pengunjung Blog Sobat tentunya memberikan informasi ter-update dari artikel Sobat. Jika Sobat melihat tayang TV dan dibawahnya terdapat tulisan berjalan ( short info ) sebagai ulasan dari wacana yang ada didalamnya, ini sama halnya dengan Headline News seperti tema artikel yang akan kita bahas...Responsive kah ??? Of course..Sudah di update script april 2016.

Langsung saja kita ikuti langkah langkahnya :

1. Login terlebih dahulu ke Akun Blogger Sobat.
2. Pilih menu Templete >> Edit HTML
3. Cari kode </head>
4.Copy kode di bawah ini di atas kode </head>

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'></script>
<script type='text/javascript'>
//<![CDATA[
var _0x5587=["\x65\x61\x73\x79\x54\x69\x63\x6B\x65\x72","\x75\x70","\x73\x77\x69\x6E\x67","\x73\x6C\x6F\x77","\x61\x75\x74\x6F","","\x50\x6C\x61\x79","\x53\x74\x6F\x70","\x6F\x70\x74\x73","\x65\x78\x74\x65\x6E\x64","\x65\x6C\x65\x6D","\x74\x61\x72\x67","\x3A\x66\x69\x72\x73\x74\x2D\x63\x68\x69\x6C\x64","\x63\x68\x69\x6C\x64\x72\x65\x6E","\x74\x69\x6D\x65\x72","\x6D\x48\x6F\x76\x65\x72","\x77\x69\x6E\x46\x6F\x63\x75\x73","\x62\x6C\x75\x72\x2E\x6A\x71\x65\x74","\x6F\x6E","\x6F\x66\x66","\x66\x6F\x63\x75\x73\x2E\x6A\x71\x65\x74","\x6D\x6F\x75\x73\x65\x50\x61\x75\x73\x65","\x74\x69\x6D\x65\x72\x54\x65\x6D\x70","\x6D\x6F\x75\x73\x65\x6C\x65\x61\x76\x65","\x6D\x6F\x75\x73\x65\x65\x6E\x74\x65\x72","\x63\x6C\x69\x63\x6B","\x70\x72\x65\x76\x65\x6E\x74\x44\x65\x66\x61\x75\x6C\x74","\x63\x6F\x6E\x74\x72\x6F\x6C\x73","\x64\x6F\x77\x6E","\x74\x6F\x67\x67\x6C\x65","\x6D\x61\x72\x67\x69\x6E","\x63\x73\x73","\x72\x65\x6C\x61\x74\x69\x76\x65","\x68\x65\x69\x67\x68\x74","\x68\x69\x64\x64\x65\x6E","\x61\x62\x73\x6F\x6C\x75\x74\x65","\x64\x69\x72\x65\x63\x74\x69\x6F\x6E","\x69\x6E\x74\x65\x72\x76\x61\x6C","\x73\x74\x6F\x70\x54\x65\x78\x74","\x68\x74\x6D\x6C","\x65\x74\x2D\x72\x75\x6E","\x61\x64\x64\x43\x6C\x61\x73\x73","\x70\x6C\x61\x79\x54\x65\x78\x74","\x72\x65\x6D\x6F\x76\x65\x43\x6C\x61\x73\x73","\x3A\x76\x69\x73\x69\x62\x6C\x65","\x69\x73","\x2D\x3D","\x61\x70\x70\x65\x6E\x64\x54\x6F","\x3A\x6C\x61\x73\x74\x2D\x63\x68\x69\x6C\x64","\x2B\x3D","\x70\x72\x65\x70\x65\x6E\x64\x54\x6F","\x6F\x75\x74\x65\x72\x48\x65\x69\x67\x68\x74","\x70\x78","\x73\x70\x65\x65\x64","\x65\x61\x73\x69\x6E\x67","\x66\x61\x64\x65\x49\x6E","\x68\x69\x64\x65","\x74\x6F\x70","\x61\x6E\x69\x6D\x61\x74\x65","\x73\x74\x6F\x70","\x64\x69\x73\x70\x6C\x61\x79","\x62\x6C\x6F\x63\x6B","\x65\x61\x63\x68","\x3A\x6C\x74\x28","\x76\x69\x73\x69\x62\x6C\x65","\x29","\x6E\x61\x6D\x65","\x63\x61\x6C\x6C\x65\x72","\x63\x61\x6C\x6C\x65\x65","\x69\x6E\x69\x74","\x66\x6E","\x64\x61\x74\x61","\x64\x61\x74\x61\x2D\x64\x6F\x6D\x61\x69\x6E","\x61\x74\x74\x72","\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E","\x2F\x66\x65\x65\x64\x73\x2F\x70\x6F\x73\x74\x73\x2F\x73\x75\x6D\x6D\x61\x72\x79\x2F\x3F\x6D\x61\x78\x2D\x72\x65\x73\x75\x6C\x74\x73\x3D\x35\x26\x61\x6C\x74\x3D\x6A\x73\x6F\x6E\x2D\x69\x6E\x2D\x73\x63\x72\x69\x70\x74","\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x69\x63\x6B\x65\x72\x77\x72\x61\x70\x70\x65\x72\x22\x3E\x3C\x73\x70\x61\x6E\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x69\x63\x6B\x68\x65\x61\x64\x22\x3E\x4C\x61\x74\x65\x73\x74\x20\x4E\x65\x77\x73\x3C\x2F\x73\x70\x61\x6E\x3E\x3C\x64\x69\x76\x20\x63\x6C\x61\x73\x73\x3D\x22\x74\x69\x63\x6B\x65\x72\x32\x22\x3E\x3C\x75\x6C\x3E\x3C\x2F\x75\x6C\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x2F\x64\x69\x76\x3E\x3C\x63\x65\x6E\x74\x65\x72\x3E\x57\x69\x64\x67\x65\x74\x20\x62\x79\x20\x3C\x61\x20\x68\x72\x65\x66\x3D\x22\x68\x74\x74\x70\x3A\x2F\x2F\x62\x6C\x6F\x67\x67\x69\x6E\x67\x70\x61\x73\x75\x72\x75\x61\x6E\x2E\x62\x6C\x6F\x67\x73\x70\x6F\x74\x2E\x63\x6F\x6D\x2F\x22\x20\x74\x61\x72\x67\x65\x74\x3D\x22\x5F\x62\x6C\x61\x6E\x6B\x22\x3E\x42\x6C\x6F\x67\x67\x69\x6E\x67\x70\x61\x73\x75\x72\x75\x61\x6E\x3C\x2F\x61\x3E\x3C\x2F\x63\x65\x6E\x74\x65\x72\x3E","\x61\x70\x70\x65\x6E\x64","\x47\x45\x54","\x61\x70\x70\x6C\x69\x63\x61\x74\x69\x6F\x6E\x2F\x6A\x73\x6F\x6E","\x6A\x73\x6F\x6E\x70","\x6C\x65\x6E\x67\x74\x68","\x65\x6E\x74\x72\x79","\x66\x65\x65\x64","\x6C\x69\x6E\x6B","\x72\x65\x6C","\x61\x6C\x74\x65\x72\x6E\x61\x74\x65","\x68\x72\x65\x66","\x24\x74","\x74\x69\x74\x6C\x65","\x3C\x6C\x69\x3E\x3C\x61\x20\x68\x72\x65\x66\x3D\x22","\x22\x3E","\x3C\x2F\x61\x3E\x3C\x2F\x6C\x69\x3E","\x2E\x74\x69\x63\x6B\x65\x72\x32\x20\x75\x6C","\x2E\x74\x69\x63\x6B\x65\x72\x32","\x61\x6A\x61\x78","\x2E\x6E\x65\x77\x73\x2D\x74\x69\x63\x6B\x65\x72"];(function(_0x68a2x1,_0x68a2x2,_0x68a2x3,_0x68a2x4){var _0x68a2x5=_0x5587[0],_0x68a2x6={direction:_0x5587[1],easing:_0x5587[2],speed:_0x5587[3],
interval:2000,height:_0x5587[4],visible:0,mousePause:1,controls:{up:_0x5587[5],down:_0x5587[5],toggle:_0x5587[5],playText:_0x5587[6],
stopText:_0x5587[7]}};function _0x68a2x7(_0x68a2x8,_0x68a2x9){var _0x68a2xa=this;_0x68a2xa[_0x5587[8]]=_0x68a2x1[_0x5587[9]]({},_0x68a2x6,_0x68a2x9);_0x68a2xa[_0x5587[10]]=_0x68a2x1(_0x68a2x8);_0x68a2xa[_0x5587[11]]=_0x68a2x1(_0x68a2x8)[_0x5587[13]](_0x5587[12]);_0x68a2xa[_0x5587[14]]=0;_0x68a2xa[_0x5587[15]]=0;_0x68a2xa[_0x5587[16]]=1;_0x68a2xc();_0x68a2xd();_0x68a2x1([_0x68a2x2,_0x68a2x3])[_0x5587[19]](_0x5587[20])[_0x5587[18]](_0x5587[20],function(){_0x68a2xa[_0x5587[16]]=1})[_0x5587[19]](_0x5587[17])[_0x5587[18]](_0x5587[17],function(){_0x68a2xa[_0x5587[16]]=0});if(_0x68a2xa[_0x5587[8]][_0x5587[21]]==1){_0x68a2xa[_0x5587[10]][_0x5587[24]](function(){_0x68a2xa[_0x5587[22]]=_0x68a2xa[_0x5587[14]];_0x68a2xe()})[_0x5587[23]](function(){if(_0x68a2xa[_0x5587[22]]!==0){_0x68a2xd()}})};_0x68a2x1(_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[1]])[_0x5587[18]](_0x5587[25],function(_0x68a2xb){_0x68a2xb[_0x5587[26]]();_0x68a2x16(_0x5587[1])});_0x68a2x1(_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[28]])[_0x5587[18]](_0x5587[25],function(_0x68a2xb){_0x68a2xb[_0x5587[26]]();_0x68a2x16(_0x5587[28])});_0x68a2x1(_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[29]])[_0x5587[18]](_0x5587[25],function(_0x68a2xb){_0x68a2xb[_0x5587[26]]();if(_0x68a2xa[_0x5587[14]]==0){_0x68a2xd()}else {_0x68a2xe()}});function _0x68a2xc(){_0x68a2xa[_0x5587[10]][_0x5587[13]]()[_0x5587[31]](_0x5587[30],0)[_0x5587[13]]()[_0x5587[31]](_0x5587[30],0);_0x68a2xa[_0x5587[10]][_0x5587[31]]({position:_0x5587[32],height:_0x68a2xa[_0x5587[8]][_0x5587[33]],overflow:_0x5587[34]});_0x68a2xa[_0x5587[11]][_0x5587[31]]({"\x70\x6F\x73\x69\x74\x69\x6F\x6E":_0x5587[35],"\x6D\x61\x72\x67\x69\x6E":0});setInterval(function(){_0x68a2x1c()},100)}function _0x68a2xd(){_0x68a2xa[_0x5587[14]]=setInterval(function(){if(_0x68a2xa[_0x5587[16]]==1){_0x68a2xf(_0x68a2xa[_0x5587[8]][_0x5587[36]])}},_0x68a2xa[_0x5587[8]][_0x5587[37]]);_0x68a2x1(_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[29]])[_0x5587[41]](_0x5587[40])[_0x5587[39]](_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[38]])}function _0x68a2xe(){clearInterval(_0x68a2xa[_0x5587[14]]);_0x68a2xa[_0x5587[14]]=0;_0x68a2x1(_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[29]])[_0x5587[43]](_0x5587[40])[_0x5587[39]](_0x68a2xa[_0x5587[8]][_0x5587[27]][_0x5587[42]])}function _0x68a2xf(_0x68a2x10){var _0x68a2x11,_0x68a2x12,_0x68a2x13;if(!_0x68a2xa[_0x5587[10]][_0x5587[45]](_0x5587[44])){return};if(_0x68a2x10==_0x5587[1]){_0x68a2x11=_0x5587[12];_0x68a2x12=_0x5587[46];_0x68a2x13=_0x5587[47]}else {_0x68a2x11=_0x5587[48];_0x68a2x12=_0x5587[49];_0x68a2x13=_0x5587[50]};var _0x68a2x14=_0x68a2xa[_0x5587[11]][_0x5587[13]](_0x68a2x11);var _0x68a2x15=_0x68a2x14[_0x5587[51]]();_0x68a2xa[_0x5587[11]][_0x5587[59]](true,true)[_0x5587[58]]({"\x74\x6F\x70":_0x68a2x12+_0x68a2x15+_0x5587[52]},_0x68a2xa[_0x5587[8]][_0x5587[53]],_0x68a2xa[_0x5587[8]][_0x5587[54]],function(){_0x68a2x14[_0x5587[56]]()[_0x68a2x13](_0x68a2xa[_0x5587[11]])[_0x5587[55]]();_0x68a2xa[_0x5587[11]][_0x5587[31]](_0x5587[57],0);_0x68a2x1c()})}function _0x68a2x16(_0x68a2x10){_0x68a2xe();if(_0x68a2x10==_0x5587[1]){_0x68a2xf(_0x5587[1])}else {_0x68a2xf(_0x5587[28])}}function _0x68a2x17(){var _0x68a2x15=0;var _0x68a2x18=_0x68a2xa[_0x5587[10]][_0x5587[31]](_0x5587[60]);_0x68a2xa[_0x5587[10]][_0x5587[31]](_0x5587[60],_0x5587[61]);_0x68a2xa[_0x5587[11]][_0x5587[13]]()[_0x5587[62]](function(){_0x68a2x15+=_0x68a2x1(this)[_0x5587[51]]()});_0x68a2xa[_0x5587[10]][_0x5587[31]]({"\x64\x69\x73\x70\x6C\x61\x79":_0x68a2x18,"\x68\x65\x69\x67\x68\x74":_0x68a2x15})}function _0x68a2x19(_0x68a2x1a){var _0x68a2x1b=0;_0x68a2xa[_0x5587[11]][_0x5587[13]](_0x5587[63]+_0x68a2xa[_0x5587[8]][_0x5587[64]]+_0x5587[65])[_0x5587[62]](function(){_0x68a2x1b+=_0x68a2x1(this)[_0x5587[51]]()});if(_0x68a2x1a==1){_0x68a2xa[_0x5587[10]][_0x5587[59]](true,true)[_0x5587[58]]({height:_0x68a2x1b},_0x68a2xa[_0x5587[8]][_0x5587[53]])}else {_0x68a2xa[_0x5587[10]][_0x5587[31]](_0x5587[33],_0x68a2x1b)}}function _0x68a2x1c(){if(_0x68a2xa[_0x5587[8]][_0x5587[33]]==_0x5587[4]&&_0x68a2xa[_0x5587[8]][_0x5587[64]]!=0){anim=arguments[_0x5587[68]][_0x5587[67]][_0x5587[66]]==_0x5587[69]?0:1;_0x68a2x19(anim)}else {if(_0x68a2xa[_0x5587[8]][_0x5587[33]]==_0x5587[4]){_0x68a2x17()}}}return {up:function(){_0x68a2x16(_0x5587[1])},down:function(){_0x68a2x16(_0x5587[28])},start:_0x68a2xd,stop:_0x68a2xe,
options:_0x68a2xa[_0x5587[8]]}}_0x68a2x1[_0x5587[70]][_0x68a2x5]=function(_0x68a2x9){return this[_0x5587[62]](function(){if(!_0x68a2x1[_0x5587[71]](this,_0x68a2x5)){_0x68a2x1[_0x5587[71]](this,_0x68a2x5, new _0x68a2x7(this,_0x68a2x9))}})}})(jQuery,window,document);$(function(){$(_0x5587[96])[_0x5587[62]](function(){var _0x68a2x1d=$(this)[_0x5587[73]](_0x5587[72]);var _0x68a2x1e=_0x5587[74]+_0x68a2x1d+_0x5587[75];var _0x68a2x1f=$(this);_0x68a2x1f[_0x5587[77]](_0x5587[76]);$[_0x5587[95]]({type:_0x5587[78],url:_0x68a2x1e,async:false,contentType:_0x5587[79]
,dataType:_0x5587[80],success:function(_0x68a2x20){for(var _0x68a2x21=1;_0x68a2x21<_0x68a2x20[_0x5587[83]][_0x5587[82]][_0x5587[81]];_0x68a2x21++){for(var _0x68a2x22=0;_0x68a2x22<_0x68a2x20[_0x5587[83]][_0x5587[82]][_0x68a2x21][_0x5587[84]][_0x5587[81]];_0x68a2x22++){if(_0x68a2x20[_0x5587[83]][_0x5587[82]][_0x68a2x21][_0x5587[84]][_0x68a2x22][_0x5587[85]]==_0x5587[86]){var _0x68a2x23=_0x68a2x20[_0x5587[83]][_0x5587[82]][_0x68a2x21][_0x5587[84]][_0x68a2x22][_0x5587[87]];break}};var _0x68a2x24=_0x68a2x20[_0x5587[83]][_0x5587[82]][_0x68a2x21][_0x5587[89]][_0x5587[88]];var _0x68a2x25=_0x5587[90]+_0x68a2x23+_0x5587[91]+_0x68a2x24+_0x5587[92];
$(_0x5587[93],_0x68a2x1f)[_0x5587[77]](_0x68a2x25)};$(_0x5587[94])[_0x5587[0]]({direction:_0x5587[1],easing:_0x5587[2],speed:_0x5587[3],
interval:2000,height:_0x5587[4],visible:0,mousePause:1})}})})})
//]]></script>
<style type='text/css'>
.tickerwrapper{ position:relative; } .tickhead{ background:#dd4c39 url(https://lh4.googleusercontent.com/S2yrb7GoLLN7s1-NmlkE_nS9Svzr5DQNM3dcCCp2Occ=s50-no) no-repeat; background-position:125px 10px; background-size:20px; position:absolute; line-height:40px !important; height:40px; width:130px; padding:0 15px 0 5px; text-align:center; color:#fff; font:400 15px 'pt sans',sans-serif; text-transform:uppercase; z-index:1; top:0; left:0; } .ticker2{ padding-left:155px; height:40px !important; overflow:hidden; background:#333; line-height:40px !important; } .ticker2 ul{ padding:0; margin:0; list-style:none; } .ticker2 ul li a{ color:#fff; font:400 15px 'pt sans',sans-serif; text-decoration:none; }
</style>

4. Kemudian cari kode <div id='outer-wrapper'><div id='wrap2'>
5. Pastekan kode dibawah ini tepat diatas-nya

<div class='news-ticker' data-domain='namablogmu.blogspot.com'>
</div>

Kustomisasi :

Tulisan berwarna kuningadalah link URL blog silahkan ganti dengan nama blog Sobat.

Saya akan sangat berterima kasih jika sobat Blogger berkenan meninggalkan komentar, saran atau tambahan informasi serta pertanyaan seputar artikel Cara Membuat Headline News Di Blog. Semoga bermanfaat dan terima kasih...