5 Feb 2011

Membuat Random Post di Wordpress


Cara membuat random post di Wordpress (Self-Hosted). Website dengan platform wordpress (Self-Hosted) juga bisa menggunakan random post yang sudah pernah saya posting-kan ini. Sebenarnya hampir sama dengan blogger. Perbedaan scriptnya hanya terletak pada url feed.

Posting ini saya buat karena ada salah satu pembaca yang menanyakan tutorial random post ini untuk platform wordpress. Seperti random post di blogger, random post ini juga menampilkan post secara berganti dan berupa slide.

Langsung saja ikuti tutorialnya!

CSS (Cascade Style Sheet)
Pertama yang perlu anda lakukan, yaitu menyimpan css untuk random post ini.
  1. Log in ke situs anda.
  2. Pilih menu Appearance » Editor » Stylesheet (style.css).
  3. Copy kode berikut ke bagian paling bawah.
  4. .gfg-root { width: auto; height: auto; position: relative; overflow: hidden; text-align: center; font-family: verdana, sans-serif;font-size: 12px;padding:2px; background:none;border: 0px solid #363636;}
    .gfg-title {font-size: 16px;font-weight : bold;color : #fff;background-color: none;line-height : 1.4em;overflow: hidden;white-space : nowrap;}
    .gfg-subtitle {font-size: 14px;font-weight: bold;color: #333;background-color: none;line-height : 1.4em; overflow : hidden;white-space : nowrap;margin-bottom : 0px;}
    .gfg-subtitle a {color : #a43434;display:none !important;}
    .gfg-entry {background-color: none;width : 100%;height : 9.9em;position : relative;overflow : hidden;text-align : left;margin-top : 0px;}
    /* To allow correct behavior for overlay */
    .gfg-root .gfg-entry .gf-result {position : relative;background-color:none;width : auto;height : 100%;padding-left : 5px;padding-right : 5px;}
    .gfg-list {position : relative;overflow : hidden;text-align : left; margin-bottom : 15px;display:none !important;}
    .gfg-root .gfg-entry .gf-result .gf-title {font-size: 13px;display:block;color:#a43434;font-weight:bold;line-height: 1.2em;overflow : hidden;white-space : nowrap;text-overflow : ellipsis;-o-text-overflow : ellipsis;margin-top : 4px;}
    .gfg-root .gfg-entry .gf-result .gf-snippet {line-height : 1.3em;color: #333;margin-top : 3px;font-size: 12px;}
    .clearFloat {clear : both;}
    #feedGadget { margin-top: 3px;margin-left: auto;margin-right: auto;width: auto;font-family:verdana, arial;font-size: 10px;color: #333;}
  5. Simpan (Klik Mutakhirkan Berkas).
Script Random Post
Untuk script random post ikuti langkah-langkah berikut.
  1. Pilih menu Appearance » Widget.
  2. Tarik widget teks ke kolom sidebar.
  3. Isi judul widget.
  4. Copy-paste script berikut ke dalam widget tadi.
  5. <script src="http://www.google.com/jsapi/?key=ABQIAAAAcV2jSs52yGHKNXjYTcwvNBQjGizh_00DUHOFTBoYdXcXzGgaZxRGIm148GyVsULR8I1--uCF7hoW2w" type="text/javascript"></script>
    <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>
    <script type="text/javascript">
    function showGadget() {
    var feeds = [
    {title:'title',
    url:'http://www.namablog.com/feed/'},
    ];
    new GFdynamicFeedControl(feeds, 'feedGadget',
    {numResults : 1000, stacked : true,
    title: " "});
    }
    google.load("feeds", "1");
    google.setOnLoadCallback(showGadget);
    </script>
    <div id="feedGadget"><center><img src="http://img80.imageshack.us/img80/1577/loadingtrans.gif" /></center></div>
  6. Ganti nama blog anda.
  7. Simpan widget.
  8. Sekarang lihat website anda! Postingan anda akan tampil secara random (acak) di bagian sidebar.
Dari berbagai sumber
Dapatkan Update Artikel RSS feed yang bermanfaat dari Saya, atau ikuti Saya di Twitter.
Email address:

2 komentar:

wayan mengatakan... at 20 September 2011 pukul 10.37

erorr mass,, ga bsa ngocpy saia, pake text area ajj..

Idin Rohidin mengatakan... at 23 September 2011 pukul 11.28

@wayan: Oke ntar saya coba perbaiki scriptnya

Posting Komentar