สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

ถามตอบ ปัญหาการพัฒนา Extension ไม่ว่าจะเป็น Module plugin Component หรือ แม้แต่ template การปรับแต่งโค้ด Joomla ต่างๆ ทุกเวอร์ชั่น 1.5 2.5 หรือ 3.x

Moderators: mindphp, ผู้ดูแลกระดาน

User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x

สำหรับท่านที่ต้องการมีเว็บไซต์ของตัวเอง และต้องการแสดงข้อมูลทั้งภาษาไทยและภาษาอังกฤษ (หรือภาษาอื่นๆ ก็ได้)
Joomla จะเป็นคำตอบให้ท่านได้ ด้วยระบบบริการจัดการที่ดีและการตั้งค่า 2 ภาษาอย่างง่าย

Joomla คืออะไร คลิกที่นี่

ในกระทู้นี้จะสอนการทำเว็บไซต์ 2 ภาษา บนระบบ Joomla ด้วย 2 วิธี
1. การตั้งค่าให้เป็น 2 ภาษาตั้งแต่ตอนติดตั้ง Joomla
2. การตั้งค่าให้เป็น 2 ภาษาหลังจากติดตั้งไปแล้ว (สำหรับคนที่พลาดไม่ได้ทำตอนติดตั้ง Joomla)



มาเริ่มด้วยการตั้งค่าให้เป็น 2 ภาษาตั้งแต่ตอนติดตั้ง Joomla

ก่อนอื่นต้องมีตัวติดตั้งของ Joomla ก่อน ดาวน์โหลดเวอร์ชั่นล่าสุดได้ที่ http://www.joomla.org/download.html
joomla-multilang01.png
joomla-multilang01.png (76.1 KiB) Viewed 4142 times
หลังจากนั้นแตกไฟล์ zip ที่ได้ไปไว้ใน folder ที่ต้องการ (ในตัวอย่างนี้จะติดตั้งบนเครื่องตัวเอง)
แล้วรันบน Browser จะเข้าหน้าการติดตั้งของ Joomla กรอกข้อมูลต่างๆ ให้ครบ เสร็จแล้วคลิก ต่อไป
joomla-multilang02.png
joomla-multilang02.png (69.5 KiB) Viewed 4098 times
หน้าจอต่อมาจะเป็นการตั้งค่าฐานข้อมูลใส่ข้อมูลที่จำเป็นให้ครบ แล้วคลิก ต่อไป
joomla-multilang03.png
joomla-multilang03.png (64.29 KiB) Viewed 4098 times
หน้าจอต่อมาสำคัญนะครับ ระบบจะให้เลือกติดตั้งข้อมูลตัวอย่าง ซึ่งถ้าเราต้องการใช้ 2 ภาษา ต้องเลือก ไม่ติดตั้ง แล้วคลิกปุ่มน้ำเงินติดตั้งครับ
joomla-multilang04.png
joomla-multilang04.png (74.67 KiB) Viewed 4098 times
รอระบบติดตั้งครับ
joomla-multilang05.png
joomla-multilang05.png (29.48 KiB) Viewed 4098 times
หลังจากหน้าติดตั้งแล้ว อย่าเพิ่งกดอะไรครับ สำหรับคนที่ติดตั้ง Joomla บ่อยจะรู้ว่าหลังจากติดตั้งแล้วจะต้องกดลบโฟลเดอร์ installation ก็จะเผลอกดไปอย่างรวดเร็วทำให้พลาดไม่สามารถติดตั้งระบบหลายภาษาได้ เพราะฉะนั้นให้เลื่อนหน้าจอมาด้านล่างเพื่อกด ติดตั้งภาษา
joomla-multilang06.png
joomla-multilang06.png (118.82 KiB) Viewed 4098 times
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

:arrow:

หลังจากคลิก ติดตั้งภาษา เข้ามาจะพบข้อมูลภาษาต่างๆ ที่สามารถติดตั้งในระบบ Joomla ได้ ซึ่งปกติ Joomla จะติดตั้งภาษา English อยู่แล้ว ในตัวอย่างจะเลือกติดตั้งเพิ่มแค่ภาษาไทย ก็คลิกทำเครื่องหมายถูกหน้าภาษาไทย แล้วคลิกปุ่มต่อไป
joomla-multilang07.png
joomla-multilang07.png (56.55 KiB) Viewed 4097 times
ในหน้าจอต่อมาให้เลือกเปิดใช้งานคุณสมบัติแสดงได้หลายภาษา ตั้งค่าเป็น ใช่ ให้หมดตามตัวอย่าง นอกจากนี้ในขั้นตอนนี้สามารถกำหนดภาษาหลักในหน้าเว็บ และ หน้าผู้ดูแลได้
joomla-multilang08.png
joomla-multilang08.png (87.22 KiB) Viewed 4097 times
ถึงขั้นตอนสุดท้ายให้คลิก ลบโฟลเดอร์ installation ได้ครับ
joomla-multilang09.png
joomla-multilang09.png (71.24 KiB) Viewed 4097 times
ตัวอย่างหน้าเว็บไซต์ จะเห็นว่าสามารถคลิกเปลี่ยนภาษาได้
Attachments
joomla-multilang10.png
joomla-multilang10.png (47.25 KiB) Viewed 4097 times
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

:arrow:

ต่อมาการตั้งค่าให้เป็น 2 ภาษาหลังจากติดตั้งไปแล้ว
(สำหรับคนที่พลาดไม่ได้ทำตอนติดตั้ง Joomla)


เข้าไปที่หน้าของผู้ดูแลระบบ ก่อนอื่นต้องติดตั้งภาษาเพิ่มเข้าไปให้มี 2 ภาษาก่อน ไปที่เมนู Extensions เลือก Language Manager
joomla-multilang20.png
joomla-multilang20.png (53.4 KiB) Viewed 4139 times
คลิก install language
joomla-multilang21.png
joomla-multilang21.png (32.19 KiB) Viewed 4139 times
ค้นหาภาษาที่ต้องการติดตั้ง ทำเครื่องหมายถูกข้างหน้า แล้วคลิก install
joomla-multilang22.png
joomla-multilang22.png (38.87 KiB) Viewed 4139 times
กลับมาที่ Language Manager จะเห็นภาษาที่เราเพิ่มใหม่
joomla-multilang23.png
joomla-multilang23.png (27.63 KiB) Viewed 4139 times
ให้คลิก Content ที่เมนูด้านซ้ายมือ เมื่อเข้าสู่หน้า Content Languages ให้คลิก New
joomla-multilang24.png
joomla-multilang24.png (42.17 KiB) Viewed 4139 times
กรอกข้อมูลให้ครบถ้วน แล้วคลิก Save & Close
joomla-multilang25.png
joomla-multilang25.png (34.34 KiB) Viewed 4139 times
เพื่อความเป็นระเบียบของเนื้อหาให้สร้าง Categories สำหรับแต่ละภาษาไว้ ไปที่ Content เลือก Category Manager เลือก Add New Category
joomla-multilang26.png
joomla-multilang26.png (48.56 KiB) Viewed 4139 times
ใส่ title ของหมวดหมู่ภาษานั้น และเลือก Language ให้ตรงกัน
ภาษาอังกฤษ
joomla-multilang27.png
joomla-multilang27.png (91.55 KiB) Viewed 4095 times
ภาษาไทย
joomla-multilang28.png
joomla-multilang28.png (92.91 KiB) Viewed 4094 times
Category ที่ได้
joomla-multilang29.png
joomla-multilang29.png (52.68 KiB) Viewed 4138 times
Last edited by tsukasaz on 08/02/2014 10:45 am, edited 1 time in total.
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

:arrow:

หลังจากได้ Category แล้ว ให้สร้างเนื้อหาในแต่ละ Category ไปที่เมนู Content เลือก Article Manager คลิกที่ Add New Article
joomla-multilang30.png
joomla-multilang30.png (62.88 KiB) Viewed 4137 times
ใส่ title และ content ของแต่ะละเนื้อหา ที่สำคัญคือต้องระบุ Category กับ Language ให้ถูกต้อง
joomla-multilang31.png
joomla-multilang31.png (109.29 KiB) Viewed 4093 times
joomla-multilang32.png
joomla-multilang32.png (106.29 KiB) Viewed 4093 times
เนื้อหาของแต่ละภาษาที่สร้างไว้
joomla-multilang33.png
joomla-multilang33.png (128.76 KiB) Viewed 4093 times
ต่อมาจะสร้างเมนูเพื่อคลิกดูเนื้อหาบนหน้าเว็บ วิธีสร้างเมนูให้ไปที่แถบเมนูด้านบน Menus เลือก Menu Manager แล้วคลิก Add New Menu
joomla-multilang34.png
joomla-multilang34.png (47.1 KiB) Viewed 4137 times
สร้างเมนูสำหรับภาษาอังกฤษ
joomla-multilang35.png
joomla-multilang35.png (24.81 KiB) Viewed 4137 times
สร้างเมนูสำหรับภาษาไทย
joomla-multilang36.png
joomla-multilang36.png (24.68 KiB) Viewed 4137 times
สรุปเมนูที่ได้
joomla-multilang37.png
joomla-multilang37.png (30.13 KiB) Viewed 4137 times
หลังจากได้เมนูแต่ละภาษา เราต้องสร้าง items ในเมนูด้วย เริ่มที่เมนูของภาษาอังกฤษ เข้าไปที่ Menus เลือก Main Menu EN แล้วคลิก Add New Menu Item
joomla-multilang38.png
joomla-multilang38.png (43.11 KiB) Viewed 4137 times
Items ของ Main Menu EN ตัวแรกที่ควรสร้างคือหน้าหลักของภาษาอังกฤษ
ส่วนสำคัญที่ต้องกำหนด คือ
Menu Item Type เลือกเป็น Article แล้วเลือก Featured Article
Menu Location เลือก Main Menu EN
Default Page เลือก Yes
Language เลือก English (UK)
joomla-multilang39.png
joomla-multilang39.png (125.11 KiB) Viewed 4093 times
Last edited by tsukasaz on 08/02/2014 12:18 pm, edited 1 time in total.
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

:arrow:

หลังจากบันทึกข้อมูล Item หน้าหลัก ของ Main Menu EN ถ้าทำถูกต้องจะมีรูปธงชาติของภาษาอังกฤษแสดง
joomla-multilang40.png
joomla-multilang40.png (45.75 KiB) Viewed 4093 times
ต่อมาสร้าง Item สำหรับแสดงเนื้อหาภาษาอังกฤษที่เราสร้างไว้
joomla-multilang41.png
joomla-multilang41.png (37.32 KiB) Viewed 4137 times
สำหรับการทำ Item Menu จากเนื้อหา ให้เลือก Menu Item Type เป็น Article แล้วเลือก Single Article ที่สำคัญอย่าลืมเลือก Language
joomla-multilang42.png
joomla-multilang42.png (122.7 KiB) Viewed 4093 times
สร้าง Items Menu ให้ครบตามเนื้อหาที่สร้าง
joomla-multilang43.png
joomla-multilang43.png (32.7 KiB) Viewed 4093 times
เสร็จของภาษาอังกฤษแล้ว ต่อมาทำของภาษาไทย ไปที่ Menus เลือก Main Menu EN แล้วคลิก Add New Menu Item
joomla-multilang44.png
joomla-multilang44.png (50.58 KiB) Viewed 4137 times
Items ของ Main Menu TH ตัวแรกที่ควรสร้างคือหน้าหลักของภาษาอังกฤษ
ส่วนสำคัญที่ต้องกำหนด คือ
Menu Item Type เลือกเป็น Article แล้วเลือก Featured Article
Menu Location เลือก Main Menu TH
Default Page เลือก Yes
Language เลือก Thailand (TH)
joomla-multilang45.png
joomla-multilang45.png (136.09 KiB) Viewed 4093 times
หลังจากบันทึกข้อมูล Item หน้าหลัก ของ Main Menu TH ถ้าทำถูกต้องจะมีรูปธงชาติของภาษาไทยแสดง
joomla-multilang46.png
joomla-multilang46.png (36.92 KiB) Viewed 4093 times
ต่อมาสร้าง Item สำหรับแสดงเนื้อหาภาษาไทยที่เราสร้างไว้
joomla-multilang47.png
joomla-multilang47.png (38.27 KiB) Viewed 4135 times
สำหรับการทำ Item Menu จากเนื้อหา ให้เลือก Menu Item Type เป็น Article แล้วเลือก Single Article ที่สำคัญอย่าลืมเลือก Language
joomla-multilang48.png
joomla-multilang48.png (122.47 KiB) Viewed 4091 times
สร้าง Items Menu ให้ครบตามเนื้อหาที่สร้าง
joomla-multilang49.png
joomla-multilang49.png (31.25 KiB) Viewed 4091 times
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
User avatar
tsukasaz
PHP VIP Members
PHP VIP Members
Posts: 12554
Joined: 18/04/2012 9:39 am

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by tsukasaz »

:arrow:

สำหรับขั้นตอนต่อไป ต้องทำ Module สำหรับแสดง Menu ทั้งภาษาอังกฤษและภาษาไทย ไปที่เมนู Extensions เลือก Module Manager
joomla-multilang50.png
joomla-multilang50.png (54.03 KiB) Viewed 4135 times
คลิกปุ่ม New เพื่อสร้าง Module
joomla-multilang51.png
joomla-multilang51.png (47.2 KiB) Viewed 4135 times
joomla-multilang52.png
joomla-multilang52.png (32.19 KiB) Viewed 4135 times
ใส่ข้อมูล title และข้อมูลที่สำคัญ
Select Menu เลือก Main Menu EN
Language เลือก English (UK)
joomla-multilang53.png
joomla-multilang53.png (111.93 KiB) Viewed 4091 times
ใส่ข้อมูล title และข้อมูลที่สำคัญ
Select Menu เลือก Main Menu TH
Language เลือก Thailand (TH)
joomla-multilang54.png
joomla-multilang54.png (104.56 KiB) Viewed 4091 times
Module Menu หลังจากสร้างเสร็จ
joomla-multilang55.png
joomla-multilang55.png (44.77 KiB) Viewed 4091 times
หลังจากนั้นให้สร้าง Module อีกตัว สำหรับกดสลับภาษา ให้คลิก New แล้วเลือก Language Switcher
joomla-multilang56.png
joomla-multilang56.png (30.54 KiB) Viewed 4135 times
หลังจากสร้าง Module Language Switcher เสร็จแล้วต้องเปิดใช้งาน Plugin ไปที่เมนู Extensions เลือก Plugin Manager
joomla-multilang57.png
joomla-multilang57.png (54.32 KiB) Viewed 4135 times
ค้นหา Plugin ที่เกี่ยวข้องกับ language 2 ตัว ซึ่งปกติจะปิดใช้งานอยู่ต้องทำเครื่องหมายถูกแล้วคลิกปุ่ม Enable
joomla-multilang58.png
joomla-multilang58.png (44.49 KiB) Viewed 4135 times
เสร็จเรียบร้อยครับ ดูหน้าเว็บได้เลย
joomla-multilang59.png
joomla-multilang59.png (26.22 KiB) Viewed 4091 times
The last bug isn't fixed until the last user is dead. (Sidney Markowitz, 1995)
surachanapa
PHP Newbie
PHP Newbie
Posts: 2
Joined: 26/03/2013 5:47 pm

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by surachanapa »

ตอนนี้ ตรงให้เปลี่ยนภาษาได้แต่ภาษาอังกฤษ ต้องไปตรวจสอบตรงส่วนไหนค่ะ เพราะอยากให้แสดงภาษาไทยด้วย ค่ะ
apple_ple
PHP Newbie
PHP Newbie
Posts: 2
Joined: 26/02/2015 4:20 pm

Re: สอนสร้างเว็บไซต์ 2 ภาษา ด้วย Joomla 3.x อย่างละเอียด

Post by apple_ple »

คือลองทำตามขั้นตอนข้างบนแร้วค่ะ .... แต่ภาษาที่โชว์หน้าเว็บโชว์เฉพาะภาษาอังกฤษ แต่สำหรับภาษาไทยมันไม่ขึ้นอ่ะค่ะ เราต้องตั้งค่ายังไงค่ะ ...ขอบคุณค่ะ
Post Reply
  • Similar Topics
    Replies
    Views
    Last post

Return to “Joomla Development”

Who is online

Users browsing this forum: No registered users and 3 guests