WordPress : Membuat XML Sitemap manual(No Plugins) : Experiment

Tutorial eksperimen ini akan membahas pembuatan sitemap tanpa plugins untuk CMS WordPress

Memberi tidak harus mengasihi, tetapi mengasihi selalu disertai dengan pemberian. Unknown

Tutorial eksperimen ini akan membahas pembuatan sitemap tanpa plugins untuk CMS WordPress

Last Modif at July 10th, 2011

TUTORIAL INI HANYA EKSPERIMEN, DAN BELUM TENTU SESUAI DENGAN APA YANG KITA HARAPKAN! SO SOBAT YANG MEMUTUSKAN

Mohon dibaca dengan seksama–sampai abis dan jangan ambil kesimpulan jika hanya membaca beberapa line saja.

Basa basi : Ini adalah satu dari beberapa Experiment yang saya lalukan di WordPress, sebagian Experiment itu sudah saya publish di indaam.net sebagian pula masih tertanam di memory saya. Jujur saja saya emang sangat suka melakukan experiment, jika di dunia maya ‘saya happy berjibaku dengan script-secript yang bernilai seni tinggi itu’ Dinunia nyata saya suka bongkar perangkat electronik, mulai dari TV, HP, kipas Angin, Dispenser dan perangkat lain yang bisa dibongkar. Tujuanya apa? Yah ‘sama seperti sobat’, saya hanya ingin tahu. Dalam hati, saya selalu bertanya–kenapa sih bisa seperti itu? kenapa, kanapa dan kenapa? Contoh: Kenapa HP bisa dipake untuk nelpon dan SMSan?
Didunia perwebsitan, saya selalu bertanya, kanapa string-tring itu bisa berubah menjadi halaman web yang statis maupun dinamis? Kenapa? Kenapa juga stringnya Harus itu-itu terus? contoh: didalam HTML untuk membuat link, kita menggunakan tag a, nyatanya Dengan CSS dan JS, kita bisa membuat Tag kita sendiri, hanya saja ngga valid! Tentu saja kita tidak bisa mengambil resiko dan melanggar standarisasi w3c, ia kan? Ok, kembali ke Experiment, yang namanya Experiment pasti ada Negatif dan Positifnya, contoh positifnya ialah, jika berhasil ‘kita selangkah berada didepan dan ada rasa bangga sedikit, dampak negatifnya ialah kalo gagal ‘waktu terbuang’, dan bisa menimbulkan kerusakan dsb. Dulu pas masih SMP, saya pernah ledakin sebuah Televisi, ngga gede sih meledaknya, ‘tapi keluar asap’ Saya juga pernah dibanting sama orang tua saya gara-gara Bongkar kipas angin*sampai rusak*, katanya aku kacca’*kata orang bugis bilang*.
Ngga tahu kenapa, yang namanya membongkar itu pasti asik, asik banget malah, ia kan? Coba bongkar laptop/PC sobat, nah nanti pasti berderbar-debar ‘Nah disitulah salah satu keasikanya’, perhatikan isinya ‘pasti sobat bertanya, ini fungsinya apa? Dan masih banyak pertantanyaan lain yang sobat ingin tahu jawabanya. Well, Sekian Basa-basinya, mari kita ke topik utama tulisan kali ini.

Sitemap

Di dunia perwebsite-an atau Perblog-an, kita mengenal yang namanya sitemap? Dan jika diartikan dalam bahasa manusia berarti Peta situs? Terus, Apa itu peta Situs? Fakta-nya, peta situs atau sitemap adalah sekumpulan url yang masing-masing mengarah ke document web kita, sedangkan salah satu fungsinya ialah memudahkan si spider Search Engine untuk memjelajahi web maupun blog kita.

Pertanyaan yang timbul adalah ‘Bagaimana cara membuat sitemap?’ Coba mampir kesini http://sitemaps.org/protocol.php
Disitu jelas Contoh, Sintaks maupun cara pembuatan sitemapnya, sedangkan untuk penulisanya kita menggunakan xml, ya walaupun ngga harus xml*setahuku*

Dari http://sitemaps.org tadi, kita mendapat dua contoh sitemap yang kira-kira seperti ini

Contoh 1

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <!-- required/diperlukan -->
<url><!-- required/diperlukan -->
<loc>http://contoh.com</loc><!-- required/diperlukan -->
<changefreq> daily</changefreq> <!-- optional/ngga harus -->
<lastmod>2011-01-01</lastmod><!-- optional/ngga harus -->
<priority>1.0</priority> <!-- optional/ngga harus -->
</url>
</urlset>

Contoh 2

<?xml version="1.0" encoding="UTF-8"?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <!-- required/diperlukan -->
<sitemap> <!-- required/diperlukan -->
<loc>http://contoh.com</loc><!-- required/diperlukan -->
<lastmod>2011-01-01</lastmod><!-- optional/ngga harus -->
</sitemap>
</sitemapindex>

Untuk keteranganya baca di http://sitemaps.org/protocol.php aja yah, udah lengkap banget kok.

Dari dua contoh diatas, tentu saja kita bisa membuat sitemap dengan cara manual, misal

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>http://www.indaam.net/</loc>
<priority>1.0</priority>
</url><!-- End url -->
<url>
<loc>http://www.indaam.net/page/about/</loc>
<priority>0.8</priority>
</url><!-- End url -->
<url>
<loc>http://www.indaam.net/post/title</loc>
<priority>0.6</priority>
</url><!-- End url -->
<!-- dan seterusnya -->
</urlset>

Pada contoh diatas, saya membuat tiga isi sitemap, yaituh


url > http://www.indaam.net/ | priority > 1.0
url > http://www.indaam.net/page/about/ | priority > 0.8
url > http://www.indaam.net/post/title/ | priority > 0.6

Keterangan
Untuk menambahkan beberapa list url lagi, diawali dengan

  • <url>
  • lalu
  • <loc>url/disini</loc>
  • kalo mau, silakan tambahkan
    <priority></priority> atau <lastmod></lastmod>atau <changefreq> </changefreq>
  • dan akhiri dengan dengan
    </url>

Membuat sitemap yang terisi/update otomatis?

Jika kita menulis sitemapnya secara manual, tentu saja kita sangat direpotkan, ia kan? Ia dong, coba bayangkan kalo abis nulis artikel, trus tuh edit sitemap dan tambahkan url post baru tadi, ribet kan? Nah, bagaimana jika kita membuat sitemapnya terisi otomatis dan sesuai dengan postingan kita? Pertanyaan yang muncul adalah “caranya gimana?”, berikut

Cluenya seperti ini:
Coba perhatikan ini

<url>
<loc>ini-url</loc>
</url>

lalu, coba buka ini juga

  • http://www.indaam.net/wpthemes/simpleindo
  • http://www.indaam.net/wpthemes/CSS3sederhana
  • http://www.indaam.net/wpthemes/sederhanaajah
  • http://www.indaam.net/wpthemes/sayasukacss3

pasti tampilanya beda-beda, ia kan?
kalo tampilnya beda, susunan tag-nya juga pasti beda dong, ia kan? Lah hubunganya apa?
Itu adalah pages-wp yang bisa kita customize seluruh isinya

Dari dua info diatas, Nanti kita akan membuat sebuah pages baru yang isinya xml sitemap, emang bisa? Insha Allah.

Lanjut : sekali lagi, coba perhatikan ini

<sitemap>
<loc>http://www.indaam.net/2011/04/nokia-e-series-e63/</loc>
<lastmod>2011-04-19T00:27:27+00:00</lastmod>
<priority>0.6</priority>
</sitemap>

<sitemap>
<loc>http://www.indaam.net/2011/04/css3-icon-logo-twitter-with-css3-and-html/</loc>
<lastmod>2011-04-18T02:07:14+00:00</lastmod>
<priority>0.6</priority>
</sitemap>

<sitemap>
<loc>http://www.indaam.net/2011/04/bontang-anp-project/</loc>
<lastmod>2011-04-17T17:20:56+00:00</lastmod>
<priority>0.6</priority>
</sitemap>

  • Coba perhatikan string antara <loc>dan </loc>
    Itu adalah permalink
  • perhatikan lagi string antara <lastmod>dan </lastmod>
    itu adalah ‘time’, dan
  • priority bisa kita atur sendiri

Nah dari contoh diatas, muncul pertanyaan lagi, gimana cara menampilkan semua permalink/url_post blog kita ke pages yang baru kita buat tadi?

Jawabanya ada disini : http://codex.wordpress.org/class_Reference/wpdb

Ok, sekarang kita sudah tahu “cara menampilkan semua permalink/url_post“, trus?

Nantinya kita buat page baru yang isinya adalah seluruh url_post/permalink yang disusun berdasarkan sintaks sitemap diatas.

Untuk memudahkan, asumsikan kita sudah tahu ini

  • cara membuat custom pages
  • Juga sudah tahu memanggil semua url_post/permalink
  • Tahu syntax xml dan xml sitemap
  • sedikit paham php/sql
  • tahu ‘apa itu web’
  • pernah mampir ke w3c.org, google.com, php.net, codex.wordpress.org

Jadi pada ininya, Nanti kita buat pages baru yang isinyai xml sitemap dan bukan HTML/CSS lagi.

Proses implementasi

Basa-basi dulu yah, sebenarnya saya bisa saja, membuat tulisan ini sangat singkat, wong cuma dua step saja kok. Tapi, karena alasan berbagi, jadi saya ingin ‘kita sama-sama tahu’–atau kita sama-sama pintar. Kan Rugi banget kalo Ilmu yang kita punya dimakan sendiri, ya kira-kira seperti mayat hidup ‘hidup tapi ngga ada gunanya ‘Berikut step by stepnya

Step 1 : Buat page baru

Saran * Untuk percobaan lebih baik di localhost ajah dulu, wong di localhost dan versi online-nya sama aja kok, yang beda adalah pada versi online–semua orang bisa akses, jadi kalo error ya ketahuan jua hehehe, lain hal kalo di localhost–yang tahu hanya sobat dan tetangga –kalo ada– >

  • > Aktifkan Wampserver, appserve, Xampp atau sejenisnya
  • > Login > Dashbord > pages > Add New(http://localhost/nama_folder_wp/wp-admin/post-new.php?post_type=page) Untuk Judulnya *wajib* diisi dengan “SITEMAP“(tanpa tanda kutip!), ingat yah harus sitemap!.
  • kenapa harus sitemap? sebenarnya bebas mau kasih nama apa, akan tetapi page inikan mau di customize, jadi ikut aja dulu yah, beberapa baris lagi, sobat juga akan tahu kenapa harus dikasih nama ‘sitemap‘.
  • Setelah itu klik publish, ia publish > trus > klik view page
  • Tampilnya sama sengan page-page lain, hanya saja contentnya ngga ada, lanjut

Step 2 : Buat File untuk custom page

  • masuk ke > > Dashbord > appreance > themes > CATAT NAMA THEME YANG ACTIVE! harus!
  • setelah di catat, masuk ke > …wp-content > themes > NAMA FOLDER THEME YANG ACTIVE
  • setelah masuk ke NAMA FOLDER THEME YANG ACTIVE, klik kanan di area kosong
  • pilih > new > text document > rename menjadi > “page-sitemap.php” *ekstensinya harus [dot]php > bukan [dot]txt!*

*Sejujurnya saya ragu, apakah file page-sitemap.php yang sobat buat ber-ekstensi [dot]php atau [dot]txt, bagaimana kalo kita buktikan dulu? Apakah itu file php atau txt, caranya

  • > klik kanan pada page-sitemap.php > pilih > edit pilih notepad atau text-editor
  • setelah itu klik file(kanan atas) > pilih > save as(CTRL + ALT + S) > perhatikan pada save as type > pilih > all files > dan pada file name ketik > page-sitemap.php > klik save > selesai
  • sekarang coba masuk ke …wp-content > themes > NAMA FOLDER THEME YANG ACTIVE, disitu ada berapa file yang memiliki nama page-sitemap.php? kalo ada dua, hapus yang berekstensi [dot]txt

Next, coba buka browser trus reload pada page sitemap yang dibuat tadi. Kalo tampilanya jadi putih polos, berarti ngga ada yang salah dan jika tampilanya tetap sama, berarti salah total. Jadi, silakan baca ulang.
Ok, kita asumsikan semua sudah benar.
Sekarang, coba masuk ke …wp-content > themes > NAMA FOLDER THEME YANG ACTIVE > lalu > renama page-sitemap.php menjadi page-ajah.php > save > lanjut, reload page sitemap tadi, kalo ngga ada yang salah maka tampilanya akan berubah seperti page-pege yang lain.
Sekarang, rename kembali page-ajah.php menjadi page-sitemap.php

Cara kerja Custom pages

Jika page blog wordpress di load maka di server–CSM wordpress secara otomatis akan mencari file di folder theme yang sesuai dengan nama page-slug-nya dan jika ngga ada, maka page.php yang dijalankan dan jika lagi page.php ngga ada maka index.php yang dijalankan dan jika lagi index.php ngga ada, maka musatahil themenya bisa diaktifkan.

Nah, sekarang udah tahukan kenapa title page-nya harus ‘SITEMAP‘?
Ini berlaku jika sobat ingin membuat sebuah page yang berbeda dengan yang lain, misal sobat ingin merubah secara total halaman about, buat saja file baru dengan nama page-about.php
*penting : yang harus disesuikan adalah slug-permalinknya, bukan titlenya. Lebih lengkap baca ini http://codex.wordpress.org/pages

Step 3 : Memasukkan script

Sekarang kita akan membuat isi sitemapnya, silakan edit kembali page-sitemap.php
lalu > copas script ini lalu letakkan pada line(baris) pertama

<?php echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?> \n "; ?>

Jika sobat bertanya, apa fungsinya, silakan mampir kesini http://w3.org/xml
Ok, saya jawab simple aja yah : Karena file yang akan kita buat adalah xml. Dan sitemap-nya ber-Type file xml, maka untuk mendeklarasikan–harus dimulai dengan itu, hah

sekarang pilih struktur sitemap kita, pilihanya ada dua yaitu

<urlset>
...
</urlset>

dan


<sitemapindex>
...
</sitemapindex>

Untuk kasus saya, saya memilih

<urlset>
...
</urlset>

Jadi silakan tambahkan ini pada baris kedua

<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> <!-- line 2 -->
<?php /*line 3*/
/* line 4*/
/* line 5*/
/* line 6*/
/* line 7*/
/* line 8*/
/* line 9*/
/* line 10*/
/* line 11*/
/* line 12*/
/* line 13*/
/* line 14*/
/* line 15*/
/* line 16*/
/* line 17*/
/* line 18*/
/* line 19*/
/* line 20*/ ?>
</urlset>

Lanjut, sampai disini muncul pertanyaan lagi, bagaimana cara menanpilkan semua url_post/permalink blog kita dengan skema sperti ini?

<url>
<loc>http://url_post/prmalink</loc>
<!-- lainya -->
</url>

<url>
<loc>http://url_post/prmalink</loc>
<!-- lainya -->
</url>
<!-- dan seterusnya--hingga semua permalink/url_post kita muncul -->

Terselesaikan!, kita bisa mengunakan wordpress class $wpdb atau $wp_Query atau juga get_posts. Dan setelah saya telaah ketiga referense tadi, lebih baik dan asik, kita pake $wpdb ajah, kanapa? ini karena settingnya yang mudah dan syntaks-nya mirip dengan sql.

Lanjut lagi, ganti/replace /* line 4*/
dengan script ini


$untukpost = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' ORDER BY post_date DESC");/* line 4*/

ket* baca disini: http://codex.wordpress.org/class_Reference/wpdb
Pada intinya, fungsi varible yang kita buat ialah ingin menampilkan data dari database > table wp_post dangan post_status–publish, post_type–post dan diurut berdasarkan waktu post dari yang terbaru ke yang terlama, sebaliknya gunakan ASC jika ingin menampilkan dari yang terlama ke yang terbaru.

Dangan variable tadi kita bisa manampilkan permalink, atau bahkan content, title dsb. Tapi, karena yang ingin kita tampilkan hanya permalink jadi kita pakai get_permalink() saja, caranya?

Disini kita ingin menampilkan semua permalink/post_url, maka fungsi yang digunakan adalah
foreach dan pada statement-nya adalah get_permalink()

jadi silakan ganti/replace /* line 5, 6 , 7, 8 dan 9 */ dengan script ini

foreach ($untukpost as $post) {/* line 5*/
/* line 6*/
echo " <loc>".get_permalink($page-> ID)."</loc>\n";/* line 7*/
/* line 8 */
}/* line 9*/

Coba save, buka browser > lalu reload page sitemap yang dibuat tadi > kemudian tekan CTRL + U, terlihatkan semua url_post/permalink blog sobat?

Dari contoh diatas, ditampilakan hanya text biasa, sekarang mari kita ubah ke bentuk/format xml

huhhhh > cape aku, ngantuk pula … besok dilanjutin okey … Nice dream ZZz -,-
Oia, hasilnya nanti seperti ini : http://www.indaam.net/sitemap

————-******************————

Pages: 1 2 3 4

Indam

A geek, frontend developer. Like you, coding & experiment.
#web #design #ui #ux #standard #dreamer
#welding #interisti #beer #coffee

19 thoughts on “WordPress : Membuat XML Sitemap manual(No Plugins) : Experiment”

  1. aandroid says:

    ya Allah, rumitnya bikin sitemaps,,,
    ni saya lagi bertanya-tanya,,

    pas pake plugin Google Sitemap Xml malah muncul tulisan ginian,”There was a problem writing your sitemap file. Make sure the file exists and is writable. Learn more
    There was a problem writing your zipped sitemap file. Make sure the file exists and is writable. Learn more”

    itu knapa ya?
    saya cek via http://uhuhduahidahdiahknsjd.com/sitemap.xml ke browser muncul:

    “Kesalahan memuat stylesheet: Kesalahan pada jaringan terjadi saat memuat stylesheet XSLT:http://uhuhduahidahdiahknsjd.com//wp-content/plugins/google-xml-sitemaps-with-multisite-support/sitemap.xsl

    demikian,,,

    kira-kira bagaimana ya solusinya?

    1. There was a problem writing your sitemap file : Gak bisa nulis sitemap ke server karena previlage gak diijinkan (gak ada previlage).
      Kemungkinan besar masalahnya :
      1. CHMOD diset ke read only (misal CHMOD 444)
      2. Pihak penyedia Hosting memang tidak mengizinkan pembuatan file oleh script (biasanya untuk menghindari hack)

  2. Djawa says:

    maaf gan mo nanya., sitemap ieu pungsinya untuk apa ya.,? ma’lum newber :D

    1. Fungsi sitemap.xml untuk memberitahu list halaman website kita ke search engine seperti google, yahoo, bing. Fungsinya supaya semua halaman web terindeks di search engine.
      sitemap tersebut nantinya yang kita registrasikan di http://www.google.com/webmasters supaya web kita bisa terindeks dalam hitungan detik.

  3. WEBGILA.COM says:

    wow…. sumpah lengkap bgt….. thx for this post bos…^^

  4. Champ Pride says:

    Mantab bro,,,,,,, bisa sbg referensi…… Saluuttttttt……………….

  5. putripetry says:

    ctrl+d
    thanks for share…

  6. Mengapa saya tdk bisa membuat sitemap.xml seperti persis punya anda ?
    Setiap saya membuat sitemap.xml selalu saja isinya tidak langsung menuju ke link artikel saya,selalu saja didalamnya berisi link file *.xml lagi,yang mana jika file *.xml lain itu diklik akan membawa meunuju ke link artikel ( dibagi menurut arsip).Lihat : http://www.luxindotechno.com/sitemap.xml
    Mengapa bisa demikian ? Saya ingin membuat file sitemap.xml yang langsung j ke link artikel persis seperti punya anda.mohon bantuannya.
    Saya menggunak plugin google xml sitemap generator versi 4 beta,karena saya tidak bisa mengggunakan versi 3.2.6 dengan alasan plugin sudah terlalu lama(kedaluarsa).
    Terimakasih.

    1. indam says:

      Maaf mas, saya tidak pernah menggunakan plugin tersebut secara online. Dulu pernah coba di localhost ketika wordpress 2.9 tapi sudah lama sekali. Dan itu tentu sudah tidak membantu.
      Saran saya: Pluginsya di nonakttifkan saja dulu, nanti jika sudah rilis final–dicoba lagi.

  7. onesetia82 says:

    ga usah bertele-tele numpang sedot script dan ilmunya …
    semoga saja ketularan pinter walaupun hanya nyontek …
    salam kenal mas … :)

  8. hulkshare says:

    keknya sitemapnya butuh ini di palanya biar tampilanya ky list ;) :

    header(‘Content-Type: text/xml’);

  9. Malam ini PR (baca: pekerjaan rumah) untuk membuat XML dilaksanakan master.

  10. fuadi_04 says:

    wowww bagus artikel sitemaps nya bro, mumet kepalaku…. ijin sedot yahh mudah-mudahan nyantol ke otakku….

  11. walah aku kok malah bingung mAS

  12. indra says:

    Mas Indam, sebelumnya saya mohon izin pakai script di articel ini.. dan terimakasih banyak sudah membuat tutorial yg sangat membantu ini.

    salam kenal :)

  13. lengkap bro, bagus untuk referensi saya, thanks

  14. Fay says:

    Thanks Mas Bro..Tutorial Yang Lengkap & Mantap. Saya Sangat Terbantu Dengan Artikel Anda Ini.Salam Kenal

  15. Fay says:

    Thanks Mas Bro..Tutorial Yang Lengkap & Mantap.Salam

  16. Nice tutorial gan..
    terus berkarya dan berbagi ilmu..

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Disclaimer, FAQ & License

Hello Gaes, untuk tujuan apapun semua content text di blog ini dapat di copas, tanpa harus menulis sumbernya. Namun content yang berupa gambar--harus Anda periksa kembali lisensinya.

Adapun(mungkin) sebagian content blog ini sudah kadaluarsa atau sudah tidak relevan, contoh :'Theme default WordPress 3+ adalah Twentyten 'apakah selamanya Twentyten?' ngga kan? Indam selaku pengelolah berharap melaporkan jika menemukan content basi yang mungkin dapat menimbulkan salah persepsi tentang content dan konsep itu sendiri. Oia, karena blog ini bersifat pribadi dan bukan untuk komersil, mungkin anda juga akan menemukan tulisan tentang aku dan hal-hal rancu yang sama sekali ngga ada hubungan dengan web dan blog-blogan. Perlu dicatat: Indam selaku pengelolah tidak bertanggung jawab atas kerugian materi, waktu, tenaga, pikiran yang mungkin ditimbulkan dari sini. So, pandai-pandai yah dalam memilah informasi. Thanks for reading.

Quote

Ketika Anda melihat orang lain mengangkat dirinya dengan cara merendahkan orang lain, sebenarnya orang itu lebih rendah dari mereka yang direndahkan. Phidias--greece filsuf

+
-