| |
ก่อนอื่นให้ท่านไปสมัครใช้ อีเมล์ของท่านเองก่อนโดยใช้ชื่อ test
เป็น username แล้วทดลองใช้งานเว็บเมล์ดูก่อน เช่น ส่งอีเมล์ถึงตัวเองซัก
2-3 ฉบับ โดยที่ขณะที่ลองใช้งานอยู่ให้สังเกต ที่ URL ในช่อง address
ของ browser ของท่าน ท่านจะเห็น
http://mail.yourdomain.com/cgi-bin/webmail.cgi?BUTTON=xxxxx&ACTION=xxxxx&LN=xx
ท่านจะเห็นตัวแปรที่สำคัญอยู่ 3 ตัว คือ
- BUTTON คือ หมวดของการดำเนินการของโปรแกรม เช่น login, signup,
folder, compose, read, help,...
- ACTION คือ การกระทำการภายใต้หมวดการดำเนินการต่างๆของโปรแกรม
เช่น login, list, show, save, update,...
- LN คือ ภาษาที่ใช้ในโปรแกรม ถ้าเป็น th คือภาษาไทย, en คือภาษาอังกฤษ
หลังจากทดลองใช้งานโดยละเอียดถี่ถ้วนแล้วให้ท่าน FTP เข้าไปที่ mail.yourdomain.com
แล้วดาวโหลดไฟล์ทั้งหมดมาเก็บไว้ก่อน ท่านจะเห็นว่า ไฟล์ *.html จะบรรจุอยู่ในไดเร็คทอรี่
ตามชื่อภาษาที่ใช้งาน(en,th) โดยโปรแกรมเว็บเมล์ จะดึงไฟล์เหล่านี้มาใช้งานในหน้าที่
ที่ต่างกันออกไป โดยแบ่งไฟล์ *.html ออกเป็น 2 ประเภท คือ
- ไฟล์ภายนอกระบบ คือ ไฟล์ที่เว็บเมล์ดึงขึ้นมาแสดงผลขณะที่ผู้ใช้ยังไม่ได้
Login
- ไฟล์ภายในระบบ คือ ไฟล์ที่เว็บเมล์ดึงขึ้นมาแสดงผลหลังจากผู้ใช้
Login เข้าไปใช้งานแล้ว
อธิบายดังนี้
| ไฟล์ภายนอกระบบ |
ไฟล์ภายในระบบ |
| ชื่อไฟล์ |
การทำงาน |
ชื่อไฟล์ |
การทำงาน |
| index |
หน้าแรก Redirect
ไปยังหน้า main ในภาษาที่ท่านต้องการ |
address |
สมุดบันทึกที่อยู่
แบบรวม |
| main |
หน้าหลัก และ
แบบฟอร์ม Login |
address_group |
สมุดบันทึกที่อยู่
แบบกลุ่ม |
| forgot_password |
แบบฟอร์ม แสดงคำใบ้ |
address_individual |
สมุดบันทึกที่อยู่
แบบบุคคล |
| help |
วิธีใช้งาน |
bookmark |
สมุดจดเว็บ |
| faq |
คำถามที่ถูกถามบ่อย |
compose |
แบบฟอร์ม เขียนจดหมาย |
| tos |
ข้อตกลง |
folder |
รายชื่อโฟลเดอร์ |
| signup |
แบบฟอร์มสมัครสมาชิก |
folder_inbox |
แสดงโฟลเดอร์
กล่องจดหมายเข้า |
| logout |
เลิกใช้งาน |
folder_sentbox |
แสดงโฟลเดอร์
กล่องส่งแล้ว |
| |
|
notepad |
สมุดฉีก |
| |
|
options |
ตัวเลือก/ตั้งค่า |
| |
|
read |
อ่านจดหมาย |
วิธีการออกแบบ
เปิดไฟล์ *.html ที่ท่านดาวโหลดมา ด้วย WebEditor ต่างๆแล้วทำการแก้ไข
เมื่อเสร็จแล้ว ให้ทำการ FTP อัพโหลดไปทับของเดิม เป็นอันใช้ได้
เครื่องมือที่แนะนำให้ใช้ Dreamweaver และ EditPlus
คำแนะนำ
ไม่ว่าไฟล์ๆนั้นจะเป็นไฟล์ภายในหรือภายนอกระบบ ท่านจะเห็นว่ามี
comment ต่างๆอยู่ ต่อไปนี้จะเรียกว่า "หมุด"
หมุดที่พบในไฟล์ทั้งสองแบบคือ <!--LN--> , <!--BANNER-->
, <!--FORM-->
หมุดที่พบเฉพาะไฟล์ภายในระบบได้แก่ <!--SID-->
ส่วนหมุดอื่นๆที่ท่านสามารถเรียกใช้งานได้เพิ่มเติมในไฟล์ภายในระบบคือ
<!--USERNAME--> , <!--EMAIL--> , <!--FOLDER-->
เวลาที่ไฟล์ html ต่างๆถูกโปรแกรมเรียกไปใช้งาน หมุดเหล่านี้จะถูกแทนที่ด้วยค่าต่างๆที่โปรแกรมกำหนดไว้
อธิบายดังนี้
| หมุด |
อธิบาย |
| <!--LN--> |
ย่อมาจาก language คือ ภาษาที่ใช้งานขณะนั้น |
| <!--BANNER--> |
ตำแหน่งของป้ายโฆษณาที่ผ่านโปรแกรมการสุ่มเรียบร้อยแล้ว |
| <!--FORM--> |
จะถูกแทนที่ด้วยแบบฟอร์มต่างๆ
ตามการดำเนินการของโปรแกรม |
| <!--SID--> |
ย่อมากจาก SESSION ID เป็นระบบความปลอดภัยของโปรแกรม
เมื่อผู้ใช้ทำการ Login ผู้ใช้แต่ละคนจะมีค่าๆนี้ต่างกันออกไปโดยไม่ซ้ำกัน
โดยที่ค่าๆนี้จะถูกส่งต่อไปยังหน้าต่างๆของโปรแกรม เพื่อที่ผู้ใช้จะสามารถใช้งานต่อไปได้ |
| <!--USERNAME--> |
ชื่อผู้ใช้ ที่ใช้งานอยู่ขณะนั้น |
| <!--EMAIL--> |
อีเมล์ของผู้ใช้ ที่ใช้งานอยู่ขณะนั้น |
| <!--FOLDER--> |
ชื่อโฟลเดอร์ที่ผู้ใช้ กำลังเปิดดูอยู่ขณะนั้น |
- <!--FORM--> และ <!--MENU--> สามารถย้ายที่ได้ตามการออกแบบที่ท่านคิดไว้
แต่ให้ระวังว่าจะต้องเขียนให้เหมือนกันทุกประการ เพราะในบางครั้งโปรแกรม
Dreamwever จะปรับแก้หมุด ให้ท่านโดยอัตโนมัติเป็น <!--FORM -->
หรือ %3C!--FORM--%3E หรือ <!--FORM-->
- บนทุกๆหน้าจะต้องติดคำว่า " Powered By ApplyMail
" ตำแหน่งใดก็ได้
- ท่านสามารถลองผิดลองถูกได้ในการออกแบบ แต่ควรเก็บไฟล์ต้นฉบับเอาไว้ด้วยในกรณีที่ผิดพลาด
- รูปภาพอื่นๆทุกรูปที่ท่านใส่เพิ่มเติมลงในเว็บเมล์ของท่านจะต้องอ้าง
path ใน scr แบบเต็ม เช่น
<img src="/image/header.gif">
, <body background="/image/bg.gif">
,
<img src="/images/menu.gif">
, <img src="/icon/bullet.gif">
เป็นต้น
ไม่เช่นนั้นโปรแกรมจะแสดงผลผิดพลาด เนื่องจากไฟล์ *.html ถูกไฟล์
webmail.cgi ดึงไปแสดงผล ซึ่งอยู่ใน /cgi-bin
- ปุ่มภาพต่างๆจะบรรจุอยู่ในไดเร็คทอรี่ /image และบรรจุอยู่ในไดเร็คทอรี่ของภาษาที่ใช้งาน
(en,th) อีกชั้นหนึ่ง, ขนาดของปุ่มหรือไอค่อนต่างๆไม่ได้ถูกกำหนดตายตัว
ท่านสามารถออกแบบได้ตามความเหมาะสม
|