Senin, 03 Maret 2014

Cara Membuat Entri Populer berjalan di Blog

Silahkan bagikan :
۞ السَّــــــلاَمُ عَلَيْــــــكُمْ وَرَحْمَــةُ اللــــهِ وَبَرَكَاتُــــــــــهُ ۞
۞ بســـــــــــــم اللّـــه الرّحمٰن الرّحيـــــــــــــم ۞
-----------------------------------------------------------------------
Cara Membuat Entri Populer Bergerak ke atas atau kebawah secara otomatis.

Ikuti langkah-langkah dibawah ini.
  1. Login ke blog, dari halaman dasbor pilih pengaturan Template.
  2. Klik Edit HTML, lalu cari kode  <div class='widget-content popular-posts'>
  3. Selanjutnya Copy kode berikut dan tempatkan di Sebelahnya.
  4. <marquee direction='down' height='200' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' scrolldelay='100' width='auto'>
  5. Langkah selanjutnya, masukan kode </marquee> di akhir rangkaian kode. Jadinya seperti ini.
  6. </ul>
        <b:include name='quickedit'/></marquee>
      </div>
    </b:includable>
      </b:widget>
  7. Susunan Kode lengkapnya.
  8. <b:widget id='PopularPosts1' locked='false' title='Entri Populer' type='PopularPosts'>
        <b:includable id='main'>
      <b:if cond='data:title'><h2><data:title/></h2></b:if>
      <div class='widget-content popular-posts'><marquee direction='down' height='200' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' scrolldelay='100' width='auto'>
        <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;'>
                <!-- (1) No snippet/thumbnail -->
                <a expr:href='data:post.href'><data:post.title/></a>
              <b:else/>
                <!-- (2) Show only snippets -->
                <div class='item-title'><a expr:href='data:post.href'><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;'>
                <!-- (3) Show only thumbnails -->
                <div class='item-thumbnail-only'>
                  <b:if cond='data:post.thumbnail'>
                    <div class='item-thumbnail'>
                      <a expr:href='data:post.href' target='_blank'>
                        <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                      </a>
                    </div>
                  </b:if>
                  <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
                </div>
                <div style='clear: both;'/>
              <b:else/>
                <!-- (4) Show snippets and thumbnails -->
                <div class='item-content'>
                  <b:if cond='data:post.thumbnail'>
                    <div class='item-thumbnail'>
                      <a expr:href='data:post.href' target='_blank'>
                        <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                      </a>
                    </div>
                  </b:if>
                  <div class='item-title'><a expr:href='data:post.href'><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>
        <!--b:include name='quickedit'/--></marquee>
      </div>
    </b:includable>
      </b:widget>
  9. Save Template Selesai.
Keterangan kode:
  • marquee direction='down' arah gerakan, bisa diganti dengan up, left, atau right.
  • height='200' tinggi dan width='auto' untuk mengatur tinggi lebar widget entri pupoler yang akan ditampilkan.
  • scrollamount='2' scrolldelay='100' Waktu gerakan.
  • Silakan ganti sesuai dengan yang kalian ingnkan.




۞ الحمد لله ربّ العٰلمين ۞

-----------------------------------------------------------------------

0 comment:

Posting Komentar

۞ MEDIA - SOSIAL ۞