Edit Theme WordPress di Localhost

Sejak dua menjak ni ramai pulak yang YM aku tanya macam mana nak edit theme WordPress. Sebenarnya bukan susah sangat pon nak edit theme WordPress. Paling mudah korang edit theme WordPress di Localhost.

Cuma korang kena ada asas coding + image editing, dan tahu struktur asas sesebuah theme WordPress. Itu tips yang paling asas untuk korang edit theme WordPress.

Edit theme WordPress

Aku tengok ramai blogger suka edit theme secara terus di server / hosting diorang. Kemungkinan besar kalau ada error yang berlaku akan menyebabkan blog korang nampak cacat bila pelawat singgah di blog.

Kadang-kadang header jadi tak cukup sifat, button menu jadi tak tersusun, kadang-kadang sidebar jatuh ke bawah.

Buatnya time tu ada pelawat yang first time masuk blog korang, diorang tengok blog korang tengah tunggang langgang. Secara tak langsung pelawat tu akan rasa blog korang dalam kategori MEREPEK!

Kenapa? Sebab error yang berlaku kat blog korang tu la.. Ingat! First impression adalah sangat penting. So, pandai-pandai la ye..

Localhost

Aku amat-amat sarankan supaya korang wujudkan ‘localhost‘ di komputer korang. Localhost ni bermaksud Server di PC / Komputer. Keupayaan localhost ni sama dengan server blog korang yang tengah online dalam rangkaian internet.

Dengan adanya localhost, korang boleh try and error di localhost tu terutamanya untuk proses edit theme WordPress, ataupun untuk menguji sebarang plugin dan juga script.

Apa Pentingnya Localhost?

Korang boleh guna localhost untuk menguji sebarang script, plugin ataupun theme sebelum upload ke server yang sedang online.

Bila korang terus je pasang benda-benda tu kat blog yang sedang online, jika ada sebarang kerosakan pada benda-benda tu secara tak langsung blog korang pon akan jadi rosak punah jahanam jugak.

Biasanya theme, plugin atau script yang rosak akan menyebabkan blog korang tak dapat dipaparkan dengan sempurna atau mungkin juga berlaku perkara-perkara lain yang tak diingini.

Kadang-kadang juga boleh memberi kesan pada dashboard admin! Jangan main giler..

Untuk edit theme di server online korang perlu ada sambungan internet kan? Sebab lepas edit korang nak view hasil yang korang dah buat. Dengan localhost, tiada sambungan internet pon korang boleh edit theme, boleh test plugin, test script.

Pendek kata, localhost membolehkan korang blogging secara offline!

Perisian Localhost

Untuk wujudkan Localhost di komputer, korang perlukan salah satu perisian ni. Pilih salah SATU je.

Lepas dah download perisian tu, install di komputer korang. Lepas dah install, korang boleh akses masuk ke localhost dengan menaip http://localhost/ di web browser.

Localhost XAMPP

Kalau korang rasa susah nak faham dan pening-pening lagi, korang boleh tengok tutorial lengkap kat blog RozaniGhani.com. Dia ada buat screenshot step-by-step macam mana cara pasang localhost (dia pakai XAMPP) beserta dengan tutorial cara pasang WordPress di localhost.

Ada screenshot senang sikit nak faham kan? Tengok-tengok gambar je.

Edit Theme WordPress

Untuk edit gambar yang nak digunakan pada theme wordpress, aku guna perisian Adobe Photoshop. Untuk coding pula, aku gunakan Notepad++.

Benda yang paling banyak membantu aku time tengah edit theme adalah Firebug — addons Firefox (recommended).

Itu saja yang aku nak bagitau tentang edit theme WordPress di localhost. Nak tunjuk cara-cara edit tu aku rasa susah sikit tunjuk kat entri blog. Kena bukak kelas kot. RM300 satu kepala. Amacam? OK tak?

Selamat menggunakan localhost dan selamat mengedit theme WordPress.

100 Comments

  1. wah menarik..thanks for sharing :tongue:
    .-= Post terbaru yanmie di blog beliau.. Bersara dari Klik-klik Nuffnang =-.

  2. mantap… akan dibuat..tungguew.. nanti ada prob, tolong tau…kalau tak habisla aku nak buat macam ne… huhu
    .-= Post terbaru zik di blog beliau.. Sambut Program Earth hour di kampung baru. =-.

  3. aku akan masukkan benda ni dalam seminar aku..
    hehe..
    .-= Post terbaru Jaws di blog beliau.. Empayar Rom Tidak Terbina Dalam Sehari =-.

  4. aku xbaca post tp aku baca komen..best btul baca komen..hahaha..apa kata bt ebook psl ni then jual..pergh konfem terbaik..jual 9ringgt pn jadila..hahaha..2bg sapa yg pentingkan diri sendiri la..kita ni sbg blogger perlu share info..dulu aku pakai xampp..tp lps format guna win7 aku xinstall2 lg..edit direct je..
    .-= Post terbaru Een di blog beliau.. Kids are even smarter than adults =-.

    • @Een: kalo confirm takkan ade error time edit direct, takpe laa.. lagipon, ko kan power.. tak kisah sangat edit2 direct ni kan.. huhu.. aku takut.. :dizzy:

  5. Ada lagi stau da.. Universal Server (Uniserver)..
    .-= Post terbaru kertaz di blog beliau.. Nak pegi ke x nak.. Hmm.. =-.

  6. tq for sharing bro..haku pun ingat nk edit theme kat localhost nnt.. kena tunggu haku betul2 free..huhuh
    .-= Post terbaru marki di blog beliau.. You ajak you bayar, i ajak pun you bayar .. =-.

  7. memang tak habis kalau nak ajar dalam ni. kelas? 1 kepala 300 pun tak berbaloi. agak rumit bagi yang tak ada basic. aku pun penah belajar nak guna locallhost. guna easy php. itu pun, erk..boleh tahan la..sekarang tengah nak siapkan projek menggunakan easy php. saya student IT, degree. aha. memang ada belajar la bende ni.. nice info. thanks
    .-= Post terbaru hBz di blog beliau.. anda harus : manusia bertopengkan manusia =-.

    • @hBz: 300 tu saje je buat umpan.. hehe.. mane la ada masa nak ajar2 org ni.. aku dulu pon belajar sendiri tentang localhost, wordpress, html, php ape sume tu.. takde pon sape2 ajarkan.. belajar sendiri je dengan bantuan Pakcik Google.. nasib baik la ade basic html.. basic tu la yg banyak membantu utk improve diri.. yg penting, rajin try and error, rajin buat rujukan.. kat database Google tu macam2 boleh baca utk belajar.. tinggal niat nak atau taknak je.. :happy:

  8. Bagus Anarm. Lenkali kalo ada orang tanya aku nak edit theme WordPress, aku boleh refer post ni. Akan ku bookmark post ni. Hehe.
    .-= Post terbaru Baloot di blog beliau.. Service: Tempahan Laman Web Untuk Website Hotel (Online Booking dan Reservation) =-.

    • @Baloot: hehe.. saje je post pasal bende ni sebab ramai sgt yang YM suruh aku ajar camne nak edit theme.. suruh diorang belajar localhost dulu.. dah pandai localhost apa sume, baru senang skit nak edit2 theme, try and error.. tapi sekarang ni ramai yang nak try and success je.. diorang tanak error2 ni.. hahaha..

      • @Anarm: Setuju, aku dulu pun macam tu jugak. Nak edit pastu terus nak ‘sukses’ je. Kalu tiba2 layout jadi problem mula la serabut kepala otak nak undo balik tang mana yang kena ubah. Hahahahaha. Lagipun nak install XAMPP ni nampak macam rumit bagi newbie sbb tu dorang jadi taknak wat kot. Sebenarnya senang saja kalau kena caranya. :wink:
        .-= Post terbaru Baloot di blog beliau.. Service: Tempahan Laman Web Untuk Website Hotel (Online Booking dan Reservation) =-.

        • @Baloot: ingat lagi 1st time nak pasang xampp.. wat tu wat ni sampai jem laptop.. aku tak tau ape aku buat time tu.. last2 reformat terus laptop aku.. abis ilang fail2 yang tak sempat backup.. hahaha..

          sape2 yg baca komen ni jgn la takut plak.. dengar format laptop je terus takut.. hehe.. sape2 yang rasa nak pakai localhost, pastikan ikut setiap step yang ada dalam tutorial.. tak kira la xampp ke, wampserver ke, easyphp ke, bitnami ke.. tutorial belambak kat intenet.. cari dan follow je.. senang sangat2.. nampak je payah tapi memang sangat senang..

  9. aku ni, reti guna xampp tu n boleh lah nak edit2 ni tapi pemalas giler.hahaha. tak senonoh kan? :P
    .-= Post terbaru lizz di blog beliau.. Menjadi Blogger Tegar. Layakkah Anda? =-.

      • @Anarm, kehkehkeh.tak apa.biar tlg jawabkan.tak senonoh abis :P
        anyway, nice blog ni. banyak info! gud luck ye
        .-= Post terbaru lizz di blog beliau.. Menjadi Blogger Tegar. Layakkah Anda? =-.

    • @beliamuda: tengah2 test pastu error, pastu tenet plak jadi bengong.. fuuhh.. memang gelabah tak ingat laa.. aku penah rasa dulu.. huhu :cwy:

  10. KONAMI tu game la. Bitnami lagi senang dari XAMPP cuma tinggal klik, klik, klik sampai finish. Kalau ikutkan, aku tak perlu buat screenshot untuk bitnami sebab senang bitnami tu. Cuma kena focus kat IP address 127.0.01 supaya jadi betul-betul localhost or offline.

    • @RozaniGhani: konami tu mmg game.. haaha..
      oo.. sama mcm pasang wordpress guna xampp jugak la kn? cume bitnami just Next Next next sampai siap..

  11. Anarm :

    Aku ingat benda apa kau taip kat entri ni. By the way, terima kasih promote.

    Zaryl:

    Better cari windows 7 OEM. OEM tu biasanya dah siap crack validation, tinggal letak serial nombor. OEM tu advantagenya dia install driver automatic complete kecuali driver graphic, sound dengan LAN.

    Lain-lain:
    Ada cara mudah buat localhost wordpress offline guna Bitnami.
    .-= Post terbaru RozaniGhani di blog beliau.. Bitnami Cara Mudah WordPress Offline =-.

    • @RozaniGhani: macam2 localhost ade sekarang ni ek.. bitnami plak muncul.. hmm.. penah gak dengar dulu.. aku ingat Bitnami tu bende lebih kurang macam KONAMI.. KONAMI yg game tu.. noob btol aku ni.. *dush* :tongue:

  12. aku baru je selesai install tadi. sebelum ni teragak2 sbb guna win7 pirate.. maleh nak buat ulangkali
    kalau ada masalah..

    skarang bila dah guna ori baru la selesa nak godam :devil:
    .-= Post terbaru zaryl di blog beliau.. 404 Error Pages, Make It Useful =-.

  13. wah! nice sharing. banyak membantu aku yg newbie ni. thanks. :D
    .-= Post terbaru penyubiru di blog beliau.. Bumi Tengah Sakit, Apa Salahnya Padamkan Lampu =-.

  14. alakah seronoknya kalo teror bab2 gnie.. fuh!
    teringin nak teror bab2 it nie… tapi tapi tapi.. T___T :sleeping:
    .-= Post terbaru yash di blog beliau.. Buat YM (Yahoo Messenger) Lebih Dari 1 =-.

  15. aku kena tangguhkan pengajian aku dulu la nam..dah nak dekat final ni..hehe :blush:
    .-= Post terbaru aizuddin di blog beliau.. Konsert Live Streaming Sempena Perasmian HSBB =-.

  16. nice….aku lebih suka edit terus di hosting je…xde la error sangat…
    tapi mcm best gak guna local host ni…pernah dgr dah..dan pernah download dah xampp ni…lepas install, terus unistall balik….hahaha..

    cuma konpius skit, bila pasang dekat blog, mcm guna mozilla/IE/chrome…dia berubah x….? maksud mungkin ada brwser yg tak support…buka je, jadi lain theme..

    • @syin: dulu aku pon edit kat hosting.. tp lepas kena byk error yg ada kat theme, kat plugin, terus aku pkai localhost.. lagi senang nk edit2 sbb bende sume dok dlm komputer kita.. takde intenet pon bleh edit2 theme..

      bende2 yg ko edit pkai localhost, apa yg ko nampak ka localhost, camtu la yg akan kuar lepas publish kat blog.. masalah browser tu aku rasa mozilla dgn chrome takde masalah.. cuma IE jela yg selalu ada masalah.. tu pon kalo ko pkai IE zaman batu/IE6.. hahaha.. IE yg baru dah ok skit..

  17. owhh baru aku tau diorang banyak duk edit website guna yg nih sebelum upload kat http://ftp..tq anarm..bookmark siap :cheerful:
    .-= Post terbaru Nine di blog beliau.. Apa Itu RSS (Really Simple Syndication) ?? =-.

    • @Nine: localhost ni biasanya web developer yang selalu guna sebelum diorang publish hasil yang dah siap 100%.. blogger pon main dengan web jugak, so rasanya perlu la ada benda ni.. tapi kalau taknak pon takpe..

  18. yeah, aku pengguna setia WampServer, daa 2 tahun guna kot..waktu minat edit2 theme niee.. skang nie dah tak jenguk pun localhost tue.. hahaha

    • @samanosuke_04: aku jenguk2 localhost time ade nk edit2 theme.. lagi 1 time nk publish entri baru.. test publish kt localhost dulu tgk kuar cmne..

      • @Anarm, samalah anarm aku dulu pakai wampserver oklah senang,lepas 2 kawan cakap pakai Xampp lagi ok lepas 2 aku terus create blog pakai hosting pc muhaha lepas moderm dah rosak x buat hosting ke pc aku,kalau x on 24 hourlah jawabnya + bil eletrik berlambak :),sekarang pinjam subdomain dari kawan jelah nak pakai hosting + domain berbayar x mampu lagi dah bergelar studeng full time :)

  19. Dah dekat 2 tahun aku tinggal localhost.Mungkin lepas ni aku akan cuba balik,maybe ade features yg menarik. :)
    .-= Post terbaru Luke di blog beliau.. Ghathering Blogger di Dataran Pahlawan Melaka pada 28 Mac =-.

    • @Luke: rasanye blogger yg pakai self-hosted patut ada localhost sendiri.. utk test bende2 yg nak masuk dlm blog.. kalau terus masuk kat blog takut ada error apa2, kang tak pasal2 blog rosak..

  20. haha.. localhost.. dulu aku tercirit nak buat localhost.. mula2 aku google, jumpa XAMPP, LAMP (linux), Appserve, WAMP, EasyPHP bla bla bla..

    biasanya aku pakai localhost apabila aku berhadapan dengan script2 yang baru aku download..

    bro.. plugin jenis apa bro pakai smpai sume pics nie slow2 fade in?
    .-= Post terbaru Frantz-Senpai di blog beliau.. Serupa tapi tak sama: ReactOS =-.

    • @Frantz-Senpai: mula2 tu memang tercirit gak la nk buat localhost.. tp lepas dh reti camne nak buat, memang rasa senang sangat2.. aku pernah guna WampServer, EasyPHP dengan XAMPP je.. sekarang stick dengan XAMPP..

      pics fade? aku pakai plugin jQuery Image Lazy Load..

      • @Anarm, jQueary LAZY LOAD?? nakal nme tuh.. btw, thanx bro.. nak apply kat AMX TechFusion.. huhu
        .-= Post terbaru Frantz-Senpai di blog beliau.. Ber’debate’ dan ber’disqus’ =-.

    • @mancai: aku pon pernah buat mcm tu.. tp sayang lak rasanye nak abiskan space just utk test.. sebab tu pkai localhost je.. hehe..

  21. wah. terima kasih anarm. info yang sangat baik.

    tapi nak edit theme pun saya tak reti sebab tak reti guna pun photoshop, illustrator, etc. coding asas reti la. susah2 dah tak reti dah
    .-= Post terbaru zahida di blog beliau.. Kalau Anda Jadi Saya, Apa Yang Akan Anda Buat? =-.

    • @zahida: photoshop illustrator tu sebagai contoh je.. software2 lain utk edit image pon boleh guna.. gimp ke, photoscape ke.. tu pon kalau nk edit gambar2 yg guna kat layout theme.. tau coding asas kire ok la.. bleh improve lagi tu.. hehe..

  22. aku dulu sebelom guna wordpress,
    aku pernah guna local host ni..Nak tau camne rasanya ada wordpress self hosted =P
    Nice entri.. =)
    .-= Post terbaru MrRollies di blog beliau.. Widgets Yang Wajib Untuk Semua Bloggers =-.

    • @MrRollies: waahh.. bagus la camtu.. 1st time aku mula pkai domain dan hosting sendiri, tak penah tau pon tentang localhost.. nasib baik ada free hosting.. kat free hosting tu la aku belajar wordpress.. lepas dh yakin baru aku beli blog self-hosted.. lama lepas tu aku terbaca pasal localhost ni kat blog AzmanIshak.. terus bertambah skit ilmu aku tentang wordpress lepas pkai localhost..

      Thanks to AzmanIshak.com :happy:

  23. kan best kalau aku ni terer bab2 mcm ni.. semuanya akan menjadi mudah. tp apakan daya, satu apa pun aku tak tahu. huhu..

    • @- azizwan -: tak tahu bleh belajar bro.. aku dulu pon tak tau sepatah haram tentang hosting2, server2, domain2 ni.. tp niat nk belajar, rajin explore, rajin bertanya, alhamdulillah ada la dpt ilmu skit2 tentang bende2 tu sume..

  24. aku dah install xampp kat laptop aku lepas baca entri ko. ikut sebijik2 panduan dari bro Rozani. tapi tu la. aku ni buta coding. install benda tu pun tetap tak boleh nak edit theme. setakat nak main-main boleh la. haha
    .-= Post terbaru zaiMi di blog beliau.. Tips Memeriksa Trafik Ke Blog Anda =-.

    • @zaiMi: dah try guna Firebug? Firebug tu cara yg paling senang, dapat tengok struktur coding dalam theme wordpress.. kalau dah paham coding header kat mane, coding content kat mane, sidebar kat mane, insyaallah nnt lama2 tau la bahagian mane yg kena edit utk ubahsuai theme..

      aku banyak belajar coding kat web http://www.w3schools.com/

  25. blurrgggh. tak phm kottt. hahah. mybe sbb bc tanpa hati n perasaan kot. haha. but i think this is a nice tutorial. nanti akn dphmkan lg. hehe~
    .-= Post terbaru ayong.qiela di blog beliau.. Smile ; Uncle Kraker =-.

    • @pear: nampak je macam complicated.. sebenarnye senang je.. kalau dah biasa dengan wordpress, biasa dengan hosting/server, tak jadi masalah sangat nak bermain dengan localhost ni.. kalau ade tak paham apa2, boleh bertanya.. insyaallah akan membantu sedaya yang mampu.. :happy:

  26. ceh anarm~link2 kat orang lain jek~last terpaksa aku tengok semua page yang die link hahaha~
    err aku nak tanya pasal XAMPP nie ~boleh tak aku amik folder didalam filezilla didalam directory public_html>blog
    mula aku copy yang kat dalam filezilla then aku paste ke desktop kemudian masukkan ke XAMPP ni ..boleh tak agak2?
    hehe :cool:
    .-= Post terbaru nizam6281 di blog beliau.. BELAJAR FUNGSI GOOGLE READER =-.

    • @nizam6281: haha.. aku ingat nak buat tutorial kat sini je.. tapi takut jadi panjang melampau2 plak entri ni.. sebab tu aku masukkan link2 yang berkaitan.. senang skit keje aku.. keh3…

      nak copy directory ke? boleh je.. cuma kat xampp tu kena create database baru untuk run fail2 dari directory tu.. localhost aku, aku just masukkan fail wordpress kat xampp, buat database.. pastu kat blog, aku copy directory plugins dgn theme je masuk dlm xampp.. entri2 aku export dr blog online, upload kt xampp.. sebijik jadi mcm blog yang tgh online..

      kat localhost nak buat apa2 pon takyah takut2 dah.. try and error bagus utk pembelajaran.. :wink:

      • @Anarm, lagi satu ~adakah ini sama dengan windows live writer?? aku baru gak terbaca tadi pasal windows live writer
        dan
        macam mana nak buat kotak biru klau pergi kat link macam ko buat tu aku nak gak hehee
        :heart:
        .-= Post terbaru nizam6281 di blog beliau.. TUTORIAL MEMBUAT SCREENGRAB SELURUH PAGE =-.

        • @nizam6281: windows live writer tu software utk tulis dan publish entri ke blog.. localhost ni Server kat dalam komputer.. Server = Hosting..

        • @nizam6281, kotak biru tu ko cari plugin tooltips kalu xsilap aku..bk setakat biru, pink hijau kuning pun boleh..

  27. wah nice info.
    lepas nih tak susah lah lagi ak nak edit2 theme.
    slalu guna ftp jer on9 plak tuh.
    terima kasih :pinch:

    • @elyaszbha: dulu aku pon tak tau benda ape localhost ni.. lepas baca ebook yg AzmanIshak buat, baru la aku tau.. dulu aku pakai WampServer.. sekarang ni pakai XAMPP.. senang skit nak belajar edit theme ke, nak belajar CSS ke..

    • @wazy: kalau jenis yg suka edit2 theme, suke usik coding2, memang patut ada localhost ni.. supaya tak mengganggu blog yang sedia online.. theme blog aku ni pon dh banyak aku tukar kat localhost.. tunggu masa je nak upload dan replace kat theme ni..

  28. perghh dasat siap ramai org nak berguru dgn ko…huhu
    smpai skrng x reti nak edit2 theme stakat guna default theme je..mybe next time aku cuba tutor kat sini…geee~
    .-= Post terbaru khairil di blog beliau.. Jom Membeli Belah Secara Online =-.

    • @khairil: aku pon tak reti sangat nak edit theme secara besar-besaran.. just gunakan benda yang ada, tukar ke bentuk yg aku suke.. tukar kaler ke, ape2 ke.. tu je.. lebih dari tu aku dah tak reti.. huhu

  29. haha..bru nk try gune XAMPP..huhuhu..byk tol spower nk edit theme nih,dah la xpandai plak tue nak gune sume tuh..huuhuhu..baik amik yg sedia-ada jer..huhuhu :silly:
    .-= Post terbaru apiih di blog beliau.. Hotel Di Atas Awan!! =-.

    • @apiih: software edit theme bleh guna software2 hok biaso guna.. xampp tu utk jadi server kt PC.. bleh jugok guna utk backup entri2 kt blog, backup database, main2 dgn database.. selamat la skit blog online doh tu..

    • @topo: hahaha.. mcm la ko tak penah rogol theme..
      aku tak try rogol lagi theme cisdel.. ari cuti ni aku try..
      bleh aku pkai utk next project.. tp nk kena tukar lain drpd cisdel.. huhu

  30. Emmm manthop entry kali ni. aku salah satu daripada sorang dok suka edit theme kat edit theme di wordpress. selain dari tu aku suka buat blog test, utk testing2 sebab tak tau localhost la apa la tuu..

    tq.. nt godek2 lg theme.. :heart: :heart:
    .-= Post terbaru Luth Textile di blog beliau.. Kenapa anda perlu miliki domain .com? =-.

    • @Luth Textile: edit theme pakai editor kat dashboard admin tu ke? huhuu.. seram~
      papehal jangan lupa backup.. kalau rasa nak pakai localhost, install ikut tutorial dalam blog RozaniGhani.com tu.. pastu nanti ko export je theme dari server masuk dalam localhost.. kat localhost boleh edit theme secara besar-besaran.. tanpa ragu2.. :lol:

  31. Terima kasih, Anarm. Good job! Mari sama-sama kita berkongsi.
    .-= Post terbaru RozaniGhani di blog beliau.. Cara Exit XAMPP WordPress Offline =-.

  32. hoho…nice entri bro…
    erm,aku dh gune firebug tu brape bln dh dgn hasil bantuan dr sifoo anarm nie..sgt best..
    leh rembat coding kt internet..haha..

    bro..ko tau x cmne nk wt form on9?kiranya gune database la..
    .-= Post terbaru oh!dawie di blog beliau.. Kemalangan Maut di MRR2 =-.

Leave a Reply

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