Mengubah Ukuran Gambar Thumbnail & Mengatasi Buram

Mengubah Ukuran Gambar Thumbnail & Mengatasi Buram

Blogging

Cara Mengubah Ukuran Gambar Thumbnail & Mengatasi Buram (Blur).

Gambar buram terjadi karena ukuran gambar sebenarnya lebih kecil dari yang tampil atau karena ukuran defaultnya lebih kecil daripada yang ditampilkan

Jika gambar buram, maka gadis berjilbab nan cantik jelita ini pun nantinya buram juga gambarnya.

Berikut ini solusi mengatasi gambar buram di blogger.

Gambar Thumbnail Halaman Depan
Simpan di atas kode </body>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function resizeThumb(parentID, size) {
    var parent = document.getElementById(parentID),
        image = parent.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/, "/s" + size + "-c");
        image[i].width = size;
        image[i].height = size;
    }
}
resizeThumb('main-wrapper', 300);
//]]>
</script>
</b:if>
</b:if>

Gambar Thumbnail Popular Post
Ukuran normal gambar popular Posts 72x72. Jika digedein, gunakan kode berikut ini agar tidak blur atau buram. Simpan di atas kode </body>

<script type='text/javascript'>
//<![CDATA[
function resizeThumb(parentID, size) {
    var parent = document.getElementById(parentID),
        image = parent.getElementsByTagName('img');
    for (var i = 0; i < image.length; i++) {
        image[i].src = image[i].src.replace(/\/s72\-c/, "/s" + size + "-c");
        image[i].width = size;
        image[i].height = size;
    }
}
// Mengubah ukuran thumbnail widget Posting Populer
resizeThumb('PopularPosts1', 300);
//]]>
</script>

Save Template!

Posted by CB Blogger

Pengertian, Sejarah, Jenis, dan Keuntungan Blogging

Pengertian, Sejarah, Jenis, dan Keuntungan Blogging

Blogging

Pengertian, Sejarah, Jenis, dan Keuntungan Blogging.

A blog (a truncation of the expression weblog)[1] is a discussion or informational website published on the World Wide Web consisting of discrete, often informal diary-style text entries ("posts"). 

Posts are typically displayed in reverse chronological order, so that the most recent post appears first, at the top of the web page. Until 2009, blogs were usually the work of a single individual[citation needed], occasionally of a small group, and often covered a single subject or topic. 

In the 2010s, "multi-author blogs" (MABs) have developed, with posts written by large numbers of authors and sometimes professionally edited. MABs from newspapers, other media outlets, universities, think tanks, advocacy groups, and similar institutions account for an increasing quantity of blog traffic. 

The rise of Twitter and other "microblogging" systems helps integrate MABs and single-author blogs into the news media. Blog can also be used as a verb, meaning to maintain or add content to a blog.

The emergence and growth of blogs in the late 1990s coincided with the advent of web publishing tools that facilitated the posting of content by non-technical users who did not have much experience with HTML or computer programming. 

Previously, a knowledge of such technologies as HTML and File Transfer Protocol had been required to publish content on the Web, and as such, early Web users tended to be hackers and computer enthusiasts. 

Interactive Web 2.0 Websites

In the 2010s, majority are interactive Web 2.0 websites, allowing visitors to leave online comments and even message each other via GUI widgets on the blogs, and it is this interactivity that distinguishes them from other static websites.[2] In that sense, blogging can be seen as a form of social networking service. Indeed, bloggers do not only produce content to post on their blogs, but also build social relations with their readers and other bloggers.[3] However, there are high-readership blogs which do not allow comments.

Many blogs provide commentary on a particular subject or topic, ranging from politics to sports. Others function as more personal online diaries, and others function more as online brand advertising of a particular individual or company. 

A typical blog combines 

1. text, 
2. digital images, and 
3. links to other blogs, 
4. web pages, and 
5. other media related to its topic. 

The ability of readers to leave comments in an interactive format is an important contribution to the popularity of many blogs. 

However, blog owners or authors need to moderate and filter online comments to remove hate speech or other offensive content. 

Most blogs are primarily textual, although some focus on 

• art (art blogs), 
• photographs (photoblogs), 
• videos (video blogs or "vlogs"), 
• music (MP3 blogs), and 
• audio (podcasts). 

Microblogging is another type of blogging, featuring very short posts. In education, blogs can be used as instructional resources. 

These blogs are referred to as edublogs. On 16 February 2011, there were over 156 million public blogs in existence. On 20 February 2014, there were around 172 million Tumblr[4] and 75.8 million WordPress[5] blogs in existence worldwide. 

According to critics and other bloggers, Blogger is the most popular blogging service used today. However, Blogger does not offer public statistics.[6][7] Technorati has 1.3 million blogs as of February 22, 2014.[8] (Sumber: Wikipedi).*

Posted by CB Blogger

Cara Menambah Satu Kolom Sidebar Kiri di Blogspot

Cara Menambah Satu Kolom Sidebar Kiri di Blogspot

Blogging News

Cara Menambah Kolom Sidebar di Sebelah Kiri

1. Login ke akun Blogger Anda

2. Pilih blog yang akan ditambah satu kolom sidebar kiri
3. Klik Template > Edit HTML
3. Tekan Ctrl+F dan cari kode css yang mirip seperti dibawah ini
4. Tambahkan kode berikut di atas kode ]]></b:skin>

#sidebarkiri-wrapper {width:160px;float:left;word-wrap:break-word;overflow:hidden;}

5. Cari kode #main-wrapper dan ganti kode width dikrangi kode lebar sidebar baru.
6. Cari kode <div id='main-wrapper'> dan tambahkan kode berikut di atasnya

<div id='sidebarkiri-wrapper'>
<b:section class='sidebar' id='sidebarkiri' preferred='yes'>
</b:section></div>

9. Simpan Template!

Demikianlah cara menambah satu kolom sidebar kiri di blogger.

Posted by CB Blogger

Best, Beautiful and Responsive Search Box Widget for Blogger

Best, Beautiful and Responsive Search Box Widget for Blogger

Blogging

Best, Beautiful and Responsive Search Box Widget for Blogger

Just copy the below code and add it as a HTML element. Width of the search box is fluid and it gets automatically adjusted to the sidebar width or wherever it is placed.

<style> #search-box { position: relative; width: 100%; margin: 0; } #search-form { height: 40px; 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: 11px 0 12px 1em; color: #333; outline: none; } #search-button { position: absolute; top: 0; right: 0; height: 42px; width: 80px; font-size: 14px; color: #fff; text-align: center; line-height: 42px; 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 3forblogger' type='text'/> <button id='search-button' type='submit'><span>Search</span></button> </form> </div>

Source:

http://www.3forblogger.com/2016/01/best-beautiful-and-responsive-search_17.html

Posted by CB Blogger

Blogger Popular Posts With AMP Carousel

Blogger Popular Posts With AMP Carousel

Blogging News

Popular posts adalah salah satu cara untuk menambah page view blog. 

Untuk itu perlu tampilan yang menarik pada popular posts agar menarik perhatian pembaca.

Salah satu cara membuat popular posts pada blog AMP menjadi tampilan yang menarik adalah dengan memanfaatkan amp-carousel. 

Dengan sedikit modifikasi pada kode widget popular post, maka jadilah carousel popular post yang bisa disimpan di bagian atas atau bawah blog ataupun di sidebar.

Langkah Pertama

Silahkan gunakan CSS di bawah ini untuk tampilan carousel popular posts.

.PopularPosts{background:#fff;padding:10px 30px 30px}
.PopularPosts amp-img{width:280px;height:180px;}
.PopularPosts h2{position:relative;overflow:hidden;margin:0 0 10px}
.PopularPosts h2 div{padding:0 10px 0 0;display:inline;float:left;}
.PopularPosts h2:after{content:'';display:inline-block;float:left;position:absolute;top:0;height:15px;margin:8px 0 0 0;width:100%;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAa-03tK43GbN2Hfs1bfkW6ay1bqxF7Zc_8sbQKUtaaGqZwrfDM0D_6kB-2dF6YkLphqJrSAY26Wm1LyvwE7QtC7WODgF-INfmKZoyaEAmqFARQQOBOYSs20LrGatbaVhDtaVFZMixSziq/s1600/repeat-bg.png);opacity:.9;}

Langkah Kedua

Silahkah copy kode HTML widget popular post di bawah ini untuk di atas (di bawah header) dan bawah blog (di atas footer). Jika sudah ada widget popular post di sidebar, silahkan hapus widgetnya.

        <b:section class='carousel' id='carousel' preferred='yes'>
          <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts' version='1' visible='true'>
            <b:includable id='main'>
                <b:if cond='data:title != &quot;&quot;'><h2><div><data:title/></div></h2></b:if>
  <div class='widget-content popular-posts'>
<amp-carousel height='180' layout='fixed-height' type='carousel'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='!data:showThumbnails'>
          <b:if cond='!data:showSnippets'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div><a expr:href='data:post.href'><data:post.title/></a></div>
            <div><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
            <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
                <a expr:href='data:post.href' expr:title='data:post.title' target='_blank'>
                  <b:with value='data:post.featuredImage.isResizable                                  ? resizeImage(data:post.featuredImage, 280)                                  : data:post.thumbnail' var='image'>
                    <amp-img expr:alt='data:post.title' expr:src='data:image' height='180' width='280'/>
                  </b:with>
                </a>
            </b:if>
        </b:if>
      </b:loop>
</amp-carousel>
  </div>
</b:includable>
          </b:widget>
        </b:section>

Jika ingin menampilkan di bawah Blog Posts, silahkan copy kode di bawah ini

          <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts' version='1' visible='true'>
            <b:includable id='main'>
                <b:if cond='data:title != &quot;&quot;'><h2><div><data:title/></div></h2></b:if>
  <div class='widget-content popular-posts'>
<amp-carousel height='180' layout='fixed-height' type='carousel'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='!data:showThumbnails'>
          <b:if cond='!data:showSnippets'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div><a expr:href='data:post.href'><data:post.title/></a></div>
            <div><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
            <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
                <a expr:href='data:post.href' expr:title='data:post.title' target='_blank'>
                  <b:with value='data:post.featuredImage.isResizable                                  ? resizeImage(data:post.featuredImage, 280)                                  : data:post.thumbnail' var='image'>
                    <amp-img expr:alt='data:post.title' expr:src='data:image' height='180' width='280'/>
                  </b:with>
                </a>
            </b:if>
        </b:if>
      </b:loop>
</amp-carousel>
  </div>
</b:includable>
          </b:widget>

Kemudian simpan di bawah kode berikut

              <b:includable id='threaded_comments' var='post'>...</b:includable>
            </b:widget>

Sehingga penampakannya seperti berikut

              <b:includable id='threaded_comments' var='post'>...</b:includable>
            </b:widget>
           KODE HTML POPULAR POST DI SINI
          </b:section>

Jika ingin menampilkan di sidebar, silahkan ganti widget popular post yang lama dengan kode di bawah ini.

          <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts' version='1' visible='true'>
            <b:includable id='main'>
                <b:if cond='data:title != &quot;&quot;'><h2><div><data:title/></div></h2></b:if>
  <div class='widget-content popular-posts'>
<amp-carousel height='180' layout='fixed-height' type='carousel'>
      <b:loop values='data:posts' var='post'>
        <b:if cond='!data:showThumbnails'>
          <b:if cond='!data:showSnippets'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div><a expr:href='data:post.href'><data:post.title/></a></div>
            <div><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <!-- (3) Show only thumbnails or (4) Snippets and thumbnails. -->
            <b:if cond='data:post.featuredImage.isResizable or data:post.thumbnail'>
                <a expr:href='data:post.href' expr:title='data:post.title' target='_blank'>
                  <b:with value='data:post.featuredImage.isResizable                                  ? resizeImage(data:post.featuredImage, 280)                                  : data:post.thumbnail' var='image'>
                    <amp-img expr:alt='data:post.title' expr:src='data:image' height='180' width='280'/>
                  </b:with>
                </a>
            </b:if>
        </b:if>
      </b:loop>
</amp-carousel>
  </div>
</b:includable>
          </b:widget>

Dan pastikan Anda sudah menyimpan kode amp-carousel seperti di bawah ini di atas </head>

<script async='async' custom-element='amp-carousel' src='https://cdn.ampproject.org/v0/amp-carousel-0.1.js'/>

Sumber: http://www.kompiajaib.com/2016/12/blogger-popular-posts-with-amp-carousel.html

Posted by CB Blogger

Membuat Daftar Isi Blog (Sitemap) Table & Auto Readmore

Membuat Daftar Isi Blog (Sitemap) Table & Auto Readmore

Blogging News

Membuat Daftar Isi Blog (Sitemap) Table & Auto Readmore

DAFTAR isi blog bisa dibilang penting gak penting. Penting karena bisa jadi diperlukan oleh pengunjung. Gak penting karena banyak website yang tidak pasang sitemap gak ngaruh tuh.

Banyak sekali jenis atau desain daftar isi blog, mulai dari yang simple hinggga tabulasi, accordion, dan sebagainya.

Buat halaman baru (New Page)
Copas di mode HTML

<style scoped="scoped" type="text/css">
#table-outer{padding:7px 10px;margin:0 auto}
#table-outer table{width:auto;margin:0 auto}
#table-outer form{font:inherit}
#table-outer label{display:block;text-align:right;margin:0 10px 0 0;padding:4px 0 0}
#table-outer select[disabled]{opacity:.4}
#post-searcher{display:block;margin:0;padding:0}
#table-outer input,#table-outer select{width:100%;border:none;margin:0;padding:5px;font-size:86%;text-transform:uppercase;outline:0;-webkit-box-shadow:inset 0 1px 3px #000,0 1px 0 #444;-moz-box-shadow:inset 0 1px 3px #000,0 1px 0 #444;box-shadow:inset 0 1px 3px #000,0 1px 0 #444;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}
#feed-container{display:block;clear:both;margin:0 30px;padding:0;list-style:none;overflow:hidden;position:relative;border-top:none}
#feed-container li{list-style:none;margin:0;padding:0;border-top:1px solid #eee;color:#555;width:auto;float:left;display:inline}
#feed-container li .inner{margin:15px 16px;height:auto;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}
#feed-container li a{text-decoration:none;color:#2C2C2C;font-weight:700}
#feed-container li a:hover{text-decoration:none;color:#E94141}
#feed-container li .news-text{margin:10px 0 0}
#feed-container li img{margin:0 10px 5px 0;padding:5px;float:left;display:block;}
#result-desc{margin:0 30px;padding:0;border-bottom:2px solid #eee}
#result-desc div,#result-desc span{display:block;margin:0;padding:5px 10px 7px;color:#D64D52}
#result-desc div{color:inherit}
#feed-nav{margin:10px 30px 0;text-align:center;font-weight:700}
#feed-nav a,#feed-nav span{border:1px solid #C9C9C9;padding:0;color:#757575;text-decoration:none;display:block;height:30px;line-height:32px}
#feed-nav a,#feed-nav span:hover{color:#1B1B1B}
#feed-nav a:active,#feed-nav a:hover{color:#555}
#feed-nav span{cursor:wait}
@media (max-width:600px){#table-outer table{margin:0 auto;width:100%}
#feed-container,#table-outer{margin:0 auto}
#feed-container li .inner{margin:5px auto;height:auto}
#feedContainer li{float:none;display:block;width:auto;height:auto}
#feed-container li .news-text, #feedContainer:after,#feed-container li img{display:none!important}
}
</style>
<div id="table-outer">
<table><tbody>
<tr><td><label for="feed-order">Urutkan artikel berdasarkan:</label></td> <td><select id="feed-order"> <option selected="" value="published">Artikel terbaru</option> <option value="updated">Artikel yang terakhir di update</option> </select></td></tr>
<tr><td><label for="label-sorter">Filter artikel berdasarkan kategori:</label></td> <td><select disabled="" id="label-sorter"> <option selected="">Loading....</option> </select></td></tr>
<tr>                 <td><label for="feed-q">Cari artikel dengan kata kunci:</label></td> <td><form id="post-searcher">
<input id="feed-q" type="text" placeholder="Ketik dan tekan ENTER"/>
</form>
</td></tr>
</tbody></table>
</div>
<header id="result-desc"></header>
<ul id="feed-container"></ul>
<div id="feed-nav">
</div>
<script src="https://cdn.rawgit.com/indradpcom/file-host/master/sitemap-fitur-lengkap.js" type="text/javascript"></script>

Publikasikan! Beres!

CARA LAINNYA:

Buat halaman baru (New Page)
Copas di mode HTML:

<div id="table-outer">
  <table>
    <tbody>
      <tr>
        <td>
          <label for="feed-order">Urutkan artikel berdasarkan:</label>
        </td>
        <td>
          <select id="feed-order">
            <option selected="" value="published">Artikel terbaru</option>
            <option value="updated">Artikel yang terakhir di update</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <label for="label-sorter">Filter artikel berdasarkan kategori:</label>
        </td>
        <td>
          <select disabled="" id="label-sorter">
            <option selected="">Loading....</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <label for="feed-q">Cari artikel dengan kata kunci:</label>
        </td>
        <td>
          <form id="post-searcher">
            <input id="feed-q" placeholder="Ketik dan tekan ENTER" type="text" />
          </form>
        </td>
      </tr>
    </tbody>
  </table>
</div>
<br />
<header id="result-desc"></header>
<br />
<ul id="feed-container"></ul>
<div id="feed-nav">
</div>

<script type='text/javaScript'>
document.write;var loadToc,loadCategories,_toc={init:function(){var cfg={homePage:window.location.origin,maxResults:10,numChars:270,thumbWidth:140,thumbHeight:95,navText:"Tampilkan artikel selanjutnya &#9660;",resetToc:"Kembali ke Awal",noImage:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhilE1mDhob7vyb9Vu3oVYGGJ64v-yF4qv_eBECy2DnycFsyhLszZGusBffRGWimNcX8iAck8b0oZpOxQGjfRHsGTZ-7z3FhTmMzJyBptoeitDnv-LH0nKeZw0NAeNz3iP8FUv9sUZwhUW3/s1100/no-thumbnail.png",loading:"<span>Memuat...</span>",counting:"<div>Memuat artikel...</div>",searching:"<span>Mencari...</span>"},w=window,d=document,el=function(id){return d.getElementById(id);},o={a:el('feed-order'),b:el('label-sorter').parentNode,c:el('post-searcher'),d:el('feed-q'),e:el('result-desc'),f:el('feed-container'),g:el('feed-nav'),h:d.getElementsByTagName('head')[0],i:0,j:null,k:'published',l:0,m:""},fn={a:function(){old=el('temporer-script');old.parentNode.removeChild(old);},b:function(param){var script=d.createElement('script');script.type="text/javascript";script.id="temporer-script";script.src=param;if(el('temporer-script'))fn.a();o.h.appendChild(script);},c:function(mode,tag,order){o.i++;o.e.innerHTML=cfg.counting;o.g.innerHTML=cfg[mode==1?"searching":"loading"];if(mode===0){fn.b(tag!==null?cfg.homePage+'/feeds/posts/summary/-/'+ tag+'?alt=json-in-script&start-index='+((o.i*cfg.maxResults)+ 1)+'&max-results='+ cfg.maxResults+'&orderby='+ order+'&callback=loadToc':cfg.homePage+'/feeds/posts/summary?alt=json-in-script&start-index='+((o.i*cfg.maxResults)+ 1)+'&max-results='+ cfg.maxResults+'&orderby='+ order+'&callback=loadToc');}else if(mode==1){fn.b(cfg.homePage+'/feeds/posts/summary?alt=json-in-script&start-index='+((o.i*cfg.maxResults)+ 1)+'&max-results='+ cfg.maxResults+'&q='+ tag+'&orderby='+ order+'&callback=loadToc');}
o.j=(tag!==null)?tag:null;o.l=mode;o.a.disabled=true;o.b.children[0].disabled=true;},d:function(json){var _h;o.g.innerHTML="";o.e.innerHTML=o.l==1?'<span>Hasil penelusuran untuk kata kunci <b>&#8220;'+ o.m+'&#8221;</b> ('+ json.feed.openSearch$totalResults.$t+' Hasil)</span>':'<div>Total: '+ json.feed.openSearch$totalResults.$t+' Artikel</div>';if("entry"in json.feed){var a=json.feed.entry,b,c,_d,e="0 Komentar",f="",g;for(var i=0;i<cfg.maxResults;i++){if(i==a.length)break;b=a[i].title.$t;_d=("summary"in a[i])?a[i].summary.$t.replace(/<br ?\/?>/ig," ").replace(/<(.*?)>/g,"").replace(/<iframe/ig,"").substring(0,cfg.numChars):"";g=("media$thumbnail"in a[i])?a[i].media$thumbnail.url.replace(/.*?:\/\//g , "//").replace(/\/s[0-9]+\-c/,"\/s"+ cfg.thumbWidth+""):cfg.noImage.replace(/\/s[0-9]+\-c/,"\/s"+ cfg.thumbWidth+"");for(var j=0,jen=a[i].link.length;j<jen;j++){c=(a[i].link[j].rel=="alternate")?a[i].link[j].href:"#";}
for(var k=0,ken=a[i].link.length;k<ken;k++){if(a[i].link[k].rel=="replies"&&a[i].link[k].type=="text/html"){e=a[i].link[k].title;break;}}
_h=d.createElement('li');_h.innerHTML='<div class="inner"><img style="width:'+ cfg.thumbWidth+'px;height:'+ cfg.thumbHeight+'px;" src="'+ g+'" alt="'+ b+'"><a class="toc-title" href="'+ c+'" target="_blank" title="'+ b+'">'+ b+'</a><div class="news-text">'+ _d+'&hellip;<br style="clear:both;"></div></div>';o.f.appendChild(_h);}
_h=d.createElement('a');_h.href='#load-more';_h.innerHTML=cfg.navText;_h.onclick=function(){fn.c(o.l,o.j,o.k);return false;};}else{_h=d.createElement('a');_h.href='#reset-content';_h.innerHTML=cfg.resetToc;_h.onclick=function(){o.i=-1;o.e.innerHTML=cfg.counting;o.f.innerHTML="";fn.c(0,null,'published');o.a.innerHTML=o.a.innerHTML;o.b.children[0].innerHTML=o.b.children[0].innerHTML;return false;};}
o.g.appendChild(_h);o.a.disabled=false;o.b.children[0].disabled=false;},e:function(json){var a=json.feed.category,b='<select id="label-sorter"><option value="" selected disabled>Pilih Kategori...</option>';for(var i=0,len=a.length;i<len;i++){b+='<option value="'+ encodeURIComponent(a[i].term).replace(/%20/g, " ")+'">'+ encodeURIComponent(a[i].term).replace(/%20/g, " ")+'</option>';}
b+='</select>';o.b.innerHTML=b;o.b.children[0].onchange=function(){o.i=-1;o.f.innerHTML="";o.g.innerHTML=cfg.loading;fn.c(0,this.value,o.k);};}};loadToc=fn.d;loadCategories=fn.e;fn.b(cfg.homePage+'/feeds/posts/summary?alt=json-in-script&start-index='+(o.i+ 1)+'&max-results='+ cfg.maxResults+'&orderby=published&callback=loadToc');fn.b(cfg.homePage+'/feeds/posts/summary?alt=json-in-script&max-results=0&orderby=published&callback=loadCategories');o.a.onchange=function(){o.i=-1;o.f.innerHTML="";o.g.innerHTML=cfg.counting;o.b.children[0].innerHTML=o.b.children[0].innerHTML;fn.c(0,null,this.value);o.k=this.value;};o.c.onsubmit=function(){o.i=-1;o.f.innerHTML="";o.m=o.d.value;fn.c(1,o.d.value,o.k);return false;};}};_toc.init();
</script>

Copas di atas kode </head>

<b:if cond='data:blog.url == &quot;URL PAGE DAFTAR ISI DI SINI&quot;'>
<style type='text/css'>
#table-outer{padding:7px 10px;margin:0 auto}
#table-outer table{width:auto;margin:0 auto;border:none!important;}
#table-outer table td{border:none!important;padding:0!important}
#table-outer form{font:inherit}
#table-outer label{display:block;text-align:right;margin:0 10px 0 0;padding:4px 0 0}
#table-outer select[disabled]{opacity:.4}
#post-searcher{display:block;margin:0;padding:0}
#table-outer input,#table-outer select{width:100%;border:1px solid #dedede;border-radius:5px;margin:0;padding:5px;font-family: Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#table-outer select option{min-height:1.4em!important;}
#table-outer input#feed-q{padding:5px 10px!important;}
#feed-container{background:#fff;display:block;clear:both;margin:0;padding:0;list-style:none;overflow:hidden;position:relative;border-top:none}
#feed-container li{list-style:none;margin:0;padding:0;border-top:1px solid #eee;color:#555;width:auto;float:left;display:inline}
#feed-container li .inner{margin:15px 0;height:auto;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}
#feed-container li a{text-decoration:none;color:#2C2C2C;font-weight:500}
#feed-container li a:hover{text-decoration:none;color:#E94141}
#feed-container li .news-text{margin-top:5px;line-height:1.3em!important}
#feed-container li img{margin:0 15px 5px 0;padding:7px 7px 7px 0;float:left;display:block;width:140px!important;}
#result-desc{margin:0;padding:0;}
#result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52}
#result-desc div{color:inherit}
#feed-nav{margin:10px 0 30px;text-align:center;font-weight:500}
#feed-nav a,#feed-nav span{border:1px solid #dedede;border-radius:5px;padding:0;color:#757575;text-decoration:none;display:block;height:30px;line-height:32px}
#feed-nav a,#feed-nav span:hover{color:#1B1B1B}
#feed-nav a:active,#feed-nav a:hover{color:#555}
#feed-nav span{cursor:wait}
@media (max-width:600px){#table-outer table{margin:0 auto;width:100%}
#feed-container,#table-outer{margin:0 auto}
#feed-container li .inner{margin:5px auto;height:auto}
#feedContainer li{float:none;display:block;width:auto;height:auto}
#feed-container li .news-text, #feedContainer:after,#feed-container li img{display:none!important}
}

.post-body{min-height:300px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX0jjOu0voNGJIjsxWfxzGYrmEDEn-uZgSXn79YKiRXWof5YdCJIdTLGl2oX_9MlDoh2b0LJ8Ke5k5Y9oKatEX9mqRkgRP28B5tPN4Wmru65BDuJPUd_B_8nf4SewdLS4CPw5PVWXVD2s/w220-h19-no/ajax-loader+%25281%2529.gif)50% 50% no-repeat!important;}
</style>
</b:if>

Posted by CB Blogger

A Blog is A Frequently Updated Online Personal Journal or Diary

A Blog is A Frequently Updated Online Personal Journal or Diary

Blogging

Lorem ipsum is a placeholder text (filler text) commonly used to demonstrate the graphic elements of a document or visual presentation, such as font, typography, and layout, by removing the distraction of meaningful content.

A Blog is A Frequently Updated Online Personal Journal or Diary.

The lorem ipsum text is typically a mangled section of De finibus bonorum et malorum, a 1st-century BC Latin text by Cicero, with words altered, added, and removed that make it nonsensical and not proper Latin.

A common form of lorem ipsum text reads as follows:

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Another version of the text uses the word "adipisici" (rather than "adipisicing"; the digraph ng at the end of words is alien to classical Latin).

Other versions of lorem ipsum include additional words to add variety so that repeated verses will not word-wrap on the same phrases. (wikipedia).* Posted by CB Blogger

Kotak Kode HTML dalam Postingan Blogspot

Kotak Kode HTML dalam Postingan Blogspot

Blogging News

Lorem ipsum is a placeholder text (filler text) commonly used to demonstrate the graphic elements of a document or visual presentation, such as font, typography, and layout, by removing the distraction of meaningful content.

The lorem ipsum text is typically a mangled section of De finibus bonorum et malorum, a 1st-century BC Latin text by Cicero, with words altered, added, and removed that make it nonsensical and not proper Latin.

A common form of lorem ipsum text reads as follows:

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Another version of the text uses the word "adipisici" (rather than "adipisicing"; the digraph ng at the end of words is alien to classical Latin).

Other versions of lorem ipsum include additional words to add variety so that repeated verses will not word-wrap on the same phrases. (wikipedia).*


Kode html dalam postingan

<div align="left"><textarea cols="30" name="code" rows="6">
KODE HTML ANDA DI SINI
</textarea></div> Posted by CB Blogger

Another version of the text uses the word

Another version of the text uses the word

Blogging News

Lorem ipsum is a placeholder text (filler text) commonly used to demonstrate the graphic elements of a document or visual presentation, such as font, typography, and layout, by removing the distraction of meaningful content.

The lorem ipsum text is typically a mangled section of De finibus bonorum et malorum, a 1st-century BC Latin text by Cicero, with words altered, added, and removed that make it nonsensical and not proper Latin.

A common form of lorem ipsum text reads as follows:

"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

Another version of the text uses the word "adipisici" (rather than "adipisicing"; the digraph ng at the end of words is alien to classical Latin).

Other versions of lorem ipsum include additional words to add variety so that repeated verses will not word-wrap on the same phrases. (wikipedia).*


Kode html dalam postingan

<div align="left"><textarea cols="30" name="code" rows="6">
KODE HTML ANDA DI SINI
</textarea></div> Posted by CB Blogger