SlideShare ist ein Scribd-Unternehmen logo
1 von 3
Downloaden Sie, um offline zu lesen
EDITOR WYSIWYG – Joomla 1.0.X


Kali ini Sifu Azmi akan berikan pula tutorial bagaimana mengendalikan editor

pengarangan WYSIWYG yang digunakan di dalam Joomla. Terdapat banyak jenis

WYSIWYG yang boleh digunakan bersama Joomla antaranya yang biasa dipakai ialah

TinyMCE dan JCE-Joomla.



Dengan menggunakan editor WYSIWYG , seorang penulis dapat menulis dan

memformat teks yang dikarangnya dengan mudah, tanpa perlu mengetahui kod-kod

arahan teks HTML yang sebenar. Walau bagaimanapun editor WYSIWYG perlu benar-

benar dikenali dan difahami untuk membolehkan anda bekerja dengan mudah.



Ini adalah paparan editor WYSIWYG TinyMCE yang dipakai oleh majoriti pengguna

Joomla:



Editor WYSIWYG TinyMCE

yang digunakan di dalam Joomla

1.0.X mempunyai dua bahagian:

       1. Intro Text

       2. Main Text




                                                    Tutorial Joomla - Sifu Azmi Sulaiman   1
Pada “Intro Text” anda hanya perlu masukkan sekadar seperenggan teks sebagai

mukadimah, dan seterusnya pada rungan “Main Text” anda tulislah sepenuhnya artikel

dan informasi yang ingin disalurkan.



Memulakan artikel hendaklah dinyatakan dengan “Title” serta “Title Alias” (masukkan

title alias jika perlu, biarkan kosong jika tidak berkenaan). Kemudian nyatakan artikel ini

dalam kumpulan “Section” dan “Category” mana. Anda boleh gunakan kelengkapan pada

‘tab’ untuk menentukan bagaimana dipaparkan (Published), grafik yang digunakan

(Images), parameter, meta info dan “link to menu” jika perlu. Pastikan anda simpan

(Save) atau batal (Cancel) setiap artikel sebelum memulakan artikel yang baru.




Apabila tajuk, section dan category telah anda masukkan/pilih, mulalah mengulis dan

mengarang artikel anda dengan bantuan ikon-ikon editor untuk menentukan format dan



                                                       Tutorial Joomla - Sifu Azmi Sulaiman   2
aturan teks anda. Kebanyakan ikon dan fungsinya adalah hanpir sama seperti kebanyakan

aplikasi pemprosesan perkataan yang biasa anda gunakan, seperti MSWord umpamanya.




             Menjajarkan teks (Aligment)


        Bentuk huruf Bold, Italic                 Gaya/Style dan Format tertentu terhadap
        Underline atau Bergaris Tengah            teks yang tersedia dan disenaraikan


Indensi barisan teks




                                           Memasukkan kod HTML
         Menjajar Indensi                                               Menentukan styles
                                                                        dan format teks
                                Menyelitkan grafik
Melukis ‘table’/jadual




                         Menyelitkan fail Flash

                                                                Menambah mod ikon

        Format Subscript & Superscript                                  Meletak Sisipan avi

                                     Membuat carian teks tertentu

Anda boleh cari atau cuba ikon-ikon format ini, selamat mengarang, dan jumpa lagi.



                                                          Tutorial Joomla - Sifu Azmi Sulaiman   3

Weitere ähnliche Inhalte

Andere mochten auch

jQuery UI Widgets, Drag and Drop, Drupal 7 Javascript
jQuery UI Widgets, Drag and Drop, Drupal 7 JavascriptjQuery UI Widgets, Drag and Drop, Drupal 7 Javascript
jQuery UI Widgets, Drag and Drop, Drupal 7 JavascriptDarren Mothersele
 
Modular Design with Web Components
Modular Design with Web ComponentsModular Design with Web Components
Modular Design with Web ComponentsC4Media
 
TinyMCE: WYSIWYG editor 2010-12-08
TinyMCE: WYSIWYG editor 2010-12-08TinyMCE: WYSIWYG editor 2010-12-08
TinyMCE: WYSIWYG editor 2010-12-08Andy Gelme
 
Comparaison de plateformes Cloud
Comparaison de plateformes CloudComparaison de plateformes Cloud
Comparaison de plateformes CloudQuentin Apruzzese
 
Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Mark Leusink
 
Pretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerPretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerMaria Clara Santana
 
Using cloud tools to build enterprise mobile apps with APIs fast
Using cloud tools to build enterprise mobile apps with APIs fast Using cloud tools to build enterprise mobile apps with APIs fast
Using cloud tools to build enterprise mobile apps with APIs fast Max Katz
 
Designing Web Interfaces
Designing Web InterfacesDesigning Web Interfaces
Designing Web InterfacesBill Scott
 
Unlock the next era of UI design with Polymer
Unlock the next era of UI design with PolymerUnlock the next era of UI design with Polymer
Unlock the next era of UI design with PolymerRob Dodson
 
Seminar Android - Pengenalan PhoneGap
Seminar Android - Pengenalan PhoneGapSeminar Android - Pengenalan PhoneGap
Seminar Android - Pengenalan PhoneGapNur Hidayat
 
Cordova + Ionic + MobileFirst
Cordova + Ionic + MobileFirstCordova + Ionic + MobileFirst
Cordova + Ionic + MobileFirstRaymond Camden
 
Drag and Drop Application Development with Progress Rollbase
Drag and Drop Application Development with Progress RollbaseDrag and Drop Application Development with Progress Rollbase
Drag and Drop Application Development with Progress RollbaseAbhishek Kant
 
Rapid mobile app development using Ionic framework
Rapid mobile app development using Ionic frameworkRapid mobile app development using Ionic framework
Rapid mobile app development using Ionic frameworkSwaminathan Vetri
 
Ionic - Revolutionizing Hybrid Mobile Application Development
Ionic - Revolutionizing Hybrid Mobile Application DevelopmentIonic - Revolutionizing Hybrid Mobile Application Development
Ionic - Revolutionizing Hybrid Mobile Application DevelopmentJustin James
 
Intro to Ionic for Building Hybrid Mobile Applications
Intro to Ionic for Building Hybrid Mobile ApplicationsIntro to Ionic for Building Hybrid Mobile Applications
Intro to Ionic for Building Hybrid Mobile ApplicationsSasha dos Santos
 
Polymer presentation in Google HQ
Polymer presentation in Google HQPolymer presentation in Google HQ
Polymer presentation in Google HQHarshit Pandey
 

Andere mochten auch (17)

jQuery UI Widgets, Drag and Drop, Drupal 7 Javascript
jQuery UI Widgets, Drag and Drop, Drupal 7 JavascriptjQuery UI Widgets, Drag and Drop, Drupal 7 Javascript
jQuery UI Widgets, Drag and Drop, Drupal 7 Javascript
 
Modular Design with Web Components
Modular Design with Web ComponentsModular Design with Web Components
Modular Design with Web Components
 
TinyMCE: WYSIWYG editor 2010-12-08
TinyMCE: WYSIWYG editor 2010-12-08TinyMCE: WYSIWYG editor 2010-12-08
TinyMCE: WYSIWYG editor 2010-12-08
 
Comparaison de plateformes Cloud
Comparaison de plateformes CloudComparaison de plateformes Cloud
Comparaison de plateformes Cloud
 
Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)Creating mobile apps - an introduction to Ionic (Engage 2016)
Creating mobile apps - an introduction to Ionic (Engage 2016)
 
Pretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and PolymerPretty Matters: Web Components, Material Design and Polymer
Pretty Matters: Web Components, Material Design and Polymer
 
Using cloud tools to build enterprise mobile apps with APIs fast
Using cloud tools to build enterprise mobile apps with APIs fast Using cloud tools to build enterprise mobile apps with APIs fast
Using cloud tools to build enterprise mobile apps with APIs fast
 
Designing Web Interfaces
Designing Web InterfacesDesigning Web Interfaces
Designing Web Interfaces
 
Unlock the next era of UI design with Polymer
Unlock the next era of UI design with PolymerUnlock the next era of UI design with Polymer
Unlock the next era of UI design with Polymer
 
Appery.io - Basic
Appery.io - BasicAppery.io - Basic
Appery.io - Basic
 
Seminar Android - Pengenalan PhoneGap
Seminar Android - Pengenalan PhoneGapSeminar Android - Pengenalan PhoneGap
Seminar Android - Pengenalan PhoneGap
 
Cordova + Ionic + MobileFirst
Cordova + Ionic + MobileFirstCordova + Ionic + MobileFirst
Cordova + Ionic + MobileFirst
 
Drag and Drop Application Development with Progress Rollbase
Drag and Drop Application Development with Progress RollbaseDrag and Drop Application Development with Progress Rollbase
Drag and Drop Application Development with Progress Rollbase
 
Rapid mobile app development using Ionic framework
Rapid mobile app development using Ionic frameworkRapid mobile app development using Ionic framework
Rapid mobile app development using Ionic framework
 
Ionic - Revolutionizing Hybrid Mobile Application Development
Ionic - Revolutionizing Hybrid Mobile Application DevelopmentIonic - Revolutionizing Hybrid Mobile Application Development
Ionic - Revolutionizing Hybrid Mobile Application Development
 
Intro to Ionic for Building Hybrid Mobile Applications
Intro to Ionic for Building Hybrid Mobile ApplicationsIntro to Ionic for Building Hybrid Mobile Applications
Intro to Ionic for Building Hybrid Mobile Applications
 
Polymer presentation in Google HQ
Polymer presentation in Google HQPolymer presentation in Google HQ
Polymer presentation in Google HQ
 

Mehr von Azmi Sulaiman

Mehr von Azmi Sulaiman (17)

Tmk 2-2
Tmk 2-2Tmk 2-2
Tmk 2-2
 
Tmk 1-3
Tmk 1-3Tmk 1-3
Tmk 1-3
 
Tmk 1-2-1-2-1-1-2-2
Tmk 1-2-1-2-1-1-2-2Tmk 1-2-1-2-1-1-2-2
Tmk 1-2-1-2-1-1-2-2
 
Tmk 1-1
Tmk 1-1Tmk 1-1
Tmk 1-1
 
06 scheme ictf5 2015 -smkppm
06 scheme ictf5 2015 -smkppm06 scheme ictf5 2015 -smkppm
06 scheme ictf5 2015 -smkppm
 
05 scheme ictf4 2015 -smkppm
05 scheme ictf4 2015 -smkppm05 scheme ictf4 2015 -smkppm
05 scheme ictf4 2015 -smkppm
 
Manual pembangunan cms 25
Manual pembangunan cms 25Manual pembangunan cms 25
Manual pembangunan cms 25
 
Tutorial editor wysiwyg
Tutorial editor wysiwygTutorial editor wysiwyg
Tutorial editor wysiwyg
 
Belajar & praktik joomla15 -Manual Kursus
Belajar & praktik joomla15 -Manual KursusBelajar & praktik joomla15 -Manual Kursus
Belajar & praktik joomla15 -Manual Kursus
 
Joomla! - Manual Bagi Admin
Joomla! - Manual Bagi AdminJoomla! - Manual Bagi Admin
Joomla! - Manual Bagi Admin
 
Ppladap1010
Ppladap1010Ppladap1010
Ppladap1010
 
Aplikasi Ict Dalam PnP
Aplikasi Ict Dalam PnPAplikasi Ict Dalam PnP
Aplikasi Ict Dalam PnP
 
Taklimat Guru Cemerlang
Taklimat Guru CemerlangTaklimat Guru Cemerlang
Taklimat Guru Cemerlang
 
Web2point0b
Web2point0bWeb2point0b
Web2point0b
 
Mowes
MowesMowes
Mowes
 
Manager Joomla
Manager JoomlaManager Joomla
Manager Joomla
 
Kursus Asas Ictl
Kursus Asas IctlKursus Asas Ictl
Kursus Asas Ictl
 

Kürzlich hochgeladen

Bab 1 : Tujuan Perniagaan dan pemilikan perniagaan
Bab 1 : Tujuan Perniagaan dan pemilikan perniagaanBab 1 : Tujuan Perniagaan dan pemilikan perniagaan
Bab 1 : Tujuan Perniagaan dan pemilikan perniagaanErnaKasran1
 
Group Project (1).pdf pendidikan moral tingkatan 1
Group Project (1).pdf pendidikan moral tingkatan 1Group Project (1).pdf pendidikan moral tingkatan 1
Group Project (1).pdf pendidikan moral tingkatan 1nurulaidahashim1
 
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptx
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptxBahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptx
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptxkedekut1
 
Mesyuarat kokurikulum sjk t bukit darah.
Mesyuarat kokurikulum sjk t bukit darah.Mesyuarat kokurikulum sjk t bukit darah.
Mesyuarat kokurikulum sjk t bukit darah.gs69955
 
Bab 2 Sebatian Karbon new copy kimi.pptx
Bab 2 Sebatian Karbon new copy kimi.pptxBab 2 Sebatian Karbon new copy kimi.pptx
Bab 2 Sebatian Karbon new copy kimi.pptxFarid Salleh
 
Slaid Taklimat Program NILAM 2021 malaysia
Slaid Taklimat Program NILAM 2021 malaysiaSlaid Taklimat Program NILAM 2021 malaysia
Slaid Taklimat Program NILAM 2021 malaysiaLUKTZECHINMoe
 

Kürzlich hochgeladen (6)

Bab 1 : Tujuan Perniagaan dan pemilikan perniagaan
Bab 1 : Tujuan Perniagaan dan pemilikan perniagaanBab 1 : Tujuan Perniagaan dan pemilikan perniagaan
Bab 1 : Tujuan Perniagaan dan pemilikan perniagaan
 
Group Project (1).pdf pendidikan moral tingkatan 1
Group Project (1).pdf pendidikan moral tingkatan 1Group Project (1).pdf pendidikan moral tingkatan 1
Group Project (1).pdf pendidikan moral tingkatan 1
 
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptx
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptxBahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptx
Bahaya vape dan rokok (Seminar Remaja Kebangsaan)-1.pptx
 
Mesyuarat kokurikulum sjk t bukit darah.
Mesyuarat kokurikulum sjk t bukit darah.Mesyuarat kokurikulum sjk t bukit darah.
Mesyuarat kokurikulum sjk t bukit darah.
 
Bab 2 Sebatian Karbon new copy kimi.pptx
Bab 2 Sebatian Karbon new copy kimi.pptxBab 2 Sebatian Karbon new copy kimi.pptx
Bab 2 Sebatian Karbon new copy kimi.pptx
 
Slaid Taklimat Program NILAM 2021 malaysia
Slaid Taklimat Program NILAM 2021 malaysiaSlaid Taklimat Program NILAM 2021 malaysia
Slaid Taklimat Program NILAM 2021 malaysia
 

Editor Wysiwyg

  • 1. EDITOR WYSIWYG – Joomla 1.0.X Kali ini Sifu Azmi akan berikan pula tutorial bagaimana mengendalikan editor pengarangan WYSIWYG yang digunakan di dalam Joomla. Terdapat banyak jenis WYSIWYG yang boleh digunakan bersama Joomla antaranya yang biasa dipakai ialah TinyMCE dan JCE-Joomla. Dengan menggunakan editor WYSIWYG , seorang penulis dapat menulis dan memformat teks yang dikarangnya dengan mudah, tanpa perlu mengetahui kod-kod arahan teks HTML yang sebenar. Walau bagaimanapun editor WYSIWYG perlu benar- benar dikenali dan difahami untuk membolehkan anda bekerja dengan mudah. Ini adalah paparan editor WYSIWYG TinyMCE yang dipakai oleh majoriti pengguna Joomla: Editor WYSIWYG TinyMCE yang digunakan di dalam Joomla 1.0.X mempunyai dua bahagian: 1. Intro Text 2. Main Text Tutorial Joomla - Sifu Azmi Sulaiman 1
  • 2. Pada “Intro Text” anda hanya perlu masukkan sekadar seperenggan teks sebagai mukadimah, dan seterusnya pada rungan “Main Text” anda tulislah sepenuhnya artikel dan informasi yang ingin disalurkan. Memulakan artikel hendaklah dinyatakan dengan “Title” serta “Title Alias” (masukkan title alias jika perlu, biarkan kosong jika tidak berkenaan). Kemudian nyatakan artikel ini dalam kumpulan “Section” dan “Category” mana. Anda boleh gunakan kelengkapan pada ‘tab’ untuk menentukan bagaimana dipaparkan (Published), grafik yang digunakan (Images), parameter, meta info dan “link to menu” jika perlu. Pastikan anda simpan (Save) atau batal (Cancel) setiap artikel sebelum memulakan artikel yang baru. Apabila tajuk, section dan category telah anda masukkan/pilih, mulalah mengulis dan mengarang artikel anda dengan bantuan ikon-ikon editor untuk menentukan format dan Tutorial Joomla - Sifu Azmi Sulaiman 2
  • 3. aturan teks anda. Kebanyakan ikon dan fungsinya adalah hanpir sama seperti kebanyakan aplikasi pemprosesan perkataan yang biasa anda gunakan, seperti MSWord umpamanya. Menjajarkan teks (Aligment) Bentuk huruf Bold, Italic Gaya/Style dan Format tertentu terhadap Underline atau Bergaris Tengah teks yang tersedia dan disenaraikan Indensi barisan teks Memasukkan kod HTML Menjajar Indensi Menentukan styles dan format teks Menyelitkan grafik Melukis ‘table’/jadual Menyelitkan fail Flash Menambah mod ikon Format Subscript & Superscript Meletak Sisipan avi Membuat carian teks tertentu Anda boleh cari atau cuba ikon-ikon format ini, selamat mengarang, dan jumpa lagi. Tutorial Joomla - Sifu Azmi Sulaiman 3