Page 1
Namo Webeditor 6
กอนท�เราจะสรางเวบกตองมการสราง Site กนกอนไมวาจะเปนโปรแกรมตวไหนกสรางเชนกน การสรางใน Namo กเชนกนมาดข )นตอนการทา ข �นตอนการทา
1. กดเลอกท�เคร�องมอ Site Wizard จะมหนาตางข)นมาใหเราเลอกรปแบบของ Site ดงภาพ มรปแบบใมาใหเราเลอกเหมอนกบ Template ของไซตน�นละครบ
2. ข )นตอนตอมาเราจะทาการสราง Site แบบ Design โครงสรางเอาดงน)นใหเราเลอก Blank Site แลวกด Next เพ�อทาข )นตอนตอไปจะมหนาตางข)นมาดงภาพ
Page 2
3. หลงจากท�เราเลอกรปแบบของ Site แลวใหเราเลอก Themes จากตวโปรแกรมไดอกสวนหน�ง แตถาใครไมชอบก Next ผานไปไดเลยกจะมาถงหนาของการกาหนดช�อ site และท�เกบขอมลของ Site ใหเรากาหนดรายละเอยดดงภาพ
4. กมาถงข )นตอนสดทาย เราสามารถเพ�ม และแกไขรายละเอยดได แตถาไมตองการกกด Finish ไดเลย กจบข )นตอนของการ
Page 3
สราง Site
กอนอ�นตองขอกลาวถงโปรแกรมตวน)กนซกเลกนอย โปรแกรม Namo น)เปนโปรแกรมท�ใชในการทาเวบไซตอกตวนง โดยบรษทผผลต SJ Namo Interactive, Inc. เปนโปรแกรมท�นาจบตามองตรงท�วาภายในตวโปรแกรมมส�งอานวยความสะดวกสาหรบ webmaster มากมายไมวาจะเปนรปภาพ หรอ Script ตางๆ เรยกไดวาไมตองมาน�งเขยนเอง แตกตองอาศยการทาความเขาใจกนซกเลกนอย เพราะคอวาหลายคนคงจะคนกบ Dreamweaver กนมานาน กอนอ�นมาดหนาตาตวโปรแกรมกนกอน หนาตาโปรแกรม Namo Webeditor 6
Page 4
เมนโปรแกรม จากภาพจะเหนสวนคลายระหวางเมน Dreamweaver กบ Fontpage เรยกไดวาหากนไมยาก
ลกเลนของตวโปรแกรม ตวเมนเล�อนข)นและลงได ภายในถาลองเลนจะเหนไดวามลกเลนดาน Java และ การสรางเมนและ Media ตางๆ
Page 5
Properties ของตวโปรแกรม จะคลายๆ กบ Dreamweaver มากทเดยว
ทายน)กลองลงโปรแกรม และมาลองใชงานกนดครบ มอกโปรแกรมในเคร�องไมเสยหลาย ^^!
ข �นตอนการทา
1. กอนอ�นมาดรปแบบท�โปรแกรม Namo WebEditor เตรยมไวใหเราใชงาน ดงภาพ
Page 6
2. เม�อไดดรปแบบเบ)องตนแลว มาลองทา Banner โดยเปดหนาเวบเพจ ท�เราตองการจะใส Banner ลงไปข)นมา ดงภาพ
3. คลกเมน Insert -> Smart ClipArt ดงภาพ
Page 7
4. เลอกรปแบบ Banner ท�โปรแกรม Namo WebEditor ไดเลยครบ ดงภาพ
จากน)นกด Ok Banner ท�เราเลอกจะถกใสลงไปยงหนาเวบเพจท�เราไดเลอกไว
Page 8
5. จะสงเกตเหนวาขอความภายใน Banner จะเปนขอความท�โปรแกรม Namo WebEditor ใหมาซ�งขอความน)เราจะสามารถแกไขไดโดย คลกขวาท� Banner และเลอกคาส�ง Smart ClipArt Propertiesหรอ Alt+Enter จะข)นหนาโปรแกรมในการจดการขอความ ดงภาพ
Double คลกท�ขอความท�เราตองการจะแกไข จะมเคร�องมอ Popup ข)นมาใหเราแกไขขอความดงภาพ
Page 9
6. เพยงเทาท�เรากได Banner ใสในหนาเวบเพจ เรยบรอยแลวครบ ดงภาพ
ลองนาไปประยกตใชงานดนะครบ
สาหรบคนท�ใชงาน Dreamweaver แลวอาจจะหนมาใชงาน Namo WebEditor เพ�อประยกตใชงาน Effect บางสวนไปใชงานในหนาเวบเพจ อาจจะไมคนเคยกบเคร�องมอ เราจะจดการโปรแกรมใหมการใชงานคลายกบ Dreamweaver ดวยข )นตอนงายๆ ดงน)
ข �นตอนการทา
1. สรางเอกสาร และเลอกแถบเมนข)นมา ดงภาพ
Page 10
2. จากน)นจะแสดงแถบเคร�องมอข)นมาดงภาพ
3. ตวอยางการกาหนด Link ดงภาพ
Page 11
การทาตาราง Rollover Table
ข �นตอนการทา
1. สรางเอกสารข)นมา แลวสรางตารางข)นมา ดงภาพ
2. จากน)นกคลhกขวาแลวเลอก Make Cell Rollover ดงภาพ
3. จากน)นเรากจะเขาสหนาตางสาหรบสราง ตารางRollover ข)นมาดงภาพซ�งประกอบดวย 2เมนหลกดงน)คอ 3.1 Select the style of Rollover เปนเมนท�ใชสาหรบกาหนดรปแบบใหกบตาราง 3.2 Apply Rollover เปนเมนสาหรบกาหนดวาจะใหแสดงผล Rollover กบแถว หรอ คอลมน
Page 12
4. ในท�น)ผมเลอกใหแสดงผลกบ คอลมน โดยผมตhกในชอง Cell ในเมนท�2 จากน)นกคลhกตรง ป ม Add ในเมนท� 1
5. หลงจากน)นกจะมหนาตางข)นมาแลวใหเราต )งช�อรปแบบของเรา (ต )งเปนภาษาองกฤษเทาน)นหามใชเคร�องหมายใด)
6. เม�อเราต )งช�อเสรจแลว คราวน)เรากจะเขาสหนาตางกานดรปแบบใหกบ ตารางRollover ของเรา และเม�อกาหนดส ตวอกษรและสแบลคกราวไดเปนท�ถกใจแลวกคลhกป ม ok เลย
Page 13
7. หลงจากน)นกจะกลบมาสหนาตางกานดรปแบบใหกบ ตารางRollover อกคร )งแตคราวน)ลองสงเกตดกจะเหน ตาราง Rollover ท�เราสรางข)นมา และเม�อเราเอาเมาไปแตะ ด มนกจะเปล�ยนสไปตามท�เราไดกาหนดไว และจากน)น กคลhกเลอก Finish กเปนอนเรยบรอยครบทาน
8. จากน)นก Save และลอง Preview ดนะครบ
การทาสของเมนเวบไซตใหไดสตามใจผสรางเวบไซต สาหรบมอใหมน)นอาจจะมองเปนเร�องยาก แตสาหรบโปรแกรมจดทาเวบไซต Namo WebEditor น)ชวยทาใหเร�องท�ผมกลาวมาดเปนเร�องงาย โดยมข )นตอนดงน)
Page 14
ข �นตอนการทา
1. เ◌ปดหนาเอกสารท�เราตองการทาสขงเมน และทาการเลอก Script Wizard ท� Panel ดานซายดงภาพ
2. จากน)นเลอกท�แถบเมน Text Menu หลงจากท�เลอก Script แลวใหกด Next ดงภาพ
Page 15
3. ทาการเพ�มเมนท�เราจะใชในหนาเวบไซต โดยกดท�ป ม Add ดงภาพ
Page 16
4. หลงจากท�สรางเมน ถาเราไมถกใจตาแหนงของเมนกสามารถปรบเปล�ยนไดตามตองการ ดงภาพ
Page 17
5. ถาถกใจตาแหนงของเมนแลวใหกดท�ป ม Next เพ�อไปทาข )นตอนของการกาหนดสของเมน ดงภาพ
Page 19
6. หลงจากท�กาหนดสของเมนเรยบรอยแ◌ลวใหกด Next เพ�อทาข )นตอนของการกาหนดรปแบบการแสดงผลเมน ดงภาพ
Page 20
7. ในการทดสอบผมไดเลอกแบบแสดงเมนปกต จะไดผลดงตวอยาง
*ถาตองการแกไขเมนต )งแตตน เม�อเรากด
การแทรก FlashButton ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ Dreamweaver ไดหรอไม ลองมาอานบทความน)ดครบ ข �นตอนการทา 1. เปดหนาเอกสารข)นมา ดงภาพ
ในการทดสอบผมไดเลอกแบบแสดงเมนปกต จะไดผลดงตวอยาง
ถาตองการแกไขเมนต )งแตตน เม�อเรากด Finish ไปแลวใหทาข )นตอนซ)าต )งแตเร�มตนอกคร )ง ระบบจะจาคาท�เราไ
ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ ไดหรอไม ลองมาอานบทความน)ดครบ
ไปแลวใหทาข )นตอนซ)าต )งแตเร�มตนอกคร )ง ระบบจะจาคาท�เราไดสรางไว
ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ
Page 21
2.จากน)นใหเราเขาไปท�เมน Insert --> FlashButtonจะแสดงหนาตางเมนข)นมา ดงภาพ
3.. เลอกป มท�เปนรปท�เราตองการและทาการดบเบ)ลคลhกท�รปหรอจะคลhกok กไดครบ ดงภาพ
Page 22
4.คราวน)เรากจะมายงหนาตางปรบแตงFlashButton ทาการกาหนดลงคและใสสหรอปรบขนาดตวอกษรไดเลยครบ
5.จากน)นกด ok จะไดผล ดงภาพ
Page 23
6. เปนอยางไรกนบางครบ ลองนาไปใชกนด
การทาขอความว�งตามเมาส บางคนอาจจะใช Java Script แตไหนๆ เราตดต )ง Namo ไปแลวตองใชใหเปนประโยชนโดยภายในต )วโปรแกรมจะม Script มาใหอยแลว
ข �นตอนการทา
1. เปดเวบเพจท�เราตองการทาข)นมา หลงจากน)นเลอกเคร�องมอ เคร�องมอน)เรยกวา Layer จากน)นใหเราพมพขอความท�เราตองการใหว�งตามเมาสลงใน Layer ดงภาพ
2. จากน)นใหเราเลอกเคร�องมอ Script Wizard
3. จะมหนาตาง Script ข)นมาใหเราเลอก Script Mouse trails และกด Next
Page 24
4. จากน)นกด Add เคร�องจะบอกวาใหเรา Add Layer ลงมาใน Box ท�โปรแกรมกาหนด จากน)นกดFinish
Page 25
5. หลงจากน)นลงทดสอบดวาไดผลดงภาพ หรอ คลกดตวอยาง