Namo Webeditor 6

กอนท�เราจะสรางเวบกตองมการสราง Site กนกอนไมวาจะเปนโปรแกรมตวไหนกสรางเชนกน การสรางใน Namo กเชนกนมาดข )นตอนการทา ข �นตอนการทา

1. กดเลอกท�เคร�องมอ Site Wizard จะมหนาตางข)นมาใหเราเลอกรปแบบของ Site ดงภาพ มรปแบบใมาใหเราเลอกเหมอนกบ Template ของไซตน�นละครบ

2. ข )นตอนตอมาเราจะทาการสราง Site แบบ Design โครงสรางเอาดงน)นใหเราเลอก Blank Site แลวกด Next เพ�อทาข )นตอนตอไปจะมหนาตางข)นมาดงภาพ

3. หลงจากท�เราเลอกรปแบบของ Site แลวใหเราเลอก Themes จากตวโปรแกรมไดอกสวนหน�ง แตถาใครไมชอบก Next ผานไปไดเลยกจะมาถงหนาของการกาหนดช�อ site และท�เกบขอมลของ Site ใหเรากาหนดรายละเอยดดงภาพ

4. กมาถงข )นตอนสดทาย เราสามารถเพ�ม และแกไขรายละเอยดได แตถาไมตองการกกด Finish ไดเลย กจบข )นตอนของการ

สราง Site

กอนอ�นตองขอกลาวถงโปรแกรมตวน)กนซกเลกนอย โปรแกรม Namo น)เปนโปรแกรมท�ใชในการทาเวบไซตอกตวนง โดยบรษทผผลต SJ Namo Interactive, Inc. เปนโปรแกรมท�นาจบตามองตรงท�วาภายในตวโปรแกรมมส�งอานวยความสะดวกสาหรบ webmaster มากมายไมวาจะเปนรปภาพ หรอ Script ตางๆ เรยกไดวาไมตองมาน�งเขยนเอง แตกตองอาศยการทาความเขาใจกนซกเลกนอย เพราะคอวาหลายคนคงจะคนกบ Dreamweaver กนมานาน กอนอ�นมาดหนาตาตวโปรแกรมกนกอน หนาตาโปรแกรม Namo Webeditor 6

เมนโปรแกรม จากภาพจะเหนสวนคลายระหวางเมน Dreamweaver กบ Fontpage เรยกไดวาหากนไมยาก

ลกเลนของตวโปรแกรม ตวเมนเล�อนข)นและลงได ภายในถาลองเลนจะเหนไดวามลกเลนดาน Java และ การสรางเมนและ Media ตางๆ

Properties ของตวโปรแกรม จะคลายๆ กบ Dreamweaver มากทเดยว

ทายน)กลองลงโปรแกรม และมาลองใชงานกนดครบ มอกโปรแกรมในเคร�องไมเสยหลาย ^^!

ข �นตอนการทา

1. กอนอ�นมาดรปแบบท�โปรแกรม Namo WebEditor เตรยมไวใหเราใชงาน ดงภาพ

2. เม�อไดดรปแบบเบ)องตนแลว มาลองทา Banner โดยเปดหนาเวบเพจ ท�เราตองการจะใส Banner ลงไปข)นมา ดงภาพ

3. คลกเมน Insert -> Smart ClipArt ดงภาพ

4. เลอกรปแบบ Banner ท�โปรแกรม Namo WebEditor ไดเลยครบ ดงภาพ

จากน)นกด Ok Banner ท�เราเลอกจะถกใสลงไปยงหนาเวบเพจท�เราไดเลอกไว

5. จะสงเกตเหนวาขอความภายใน Banner จะเปนขอความท�โปรแกรม Namo WebEditor ใหมาซ�งขอความน)เราจะสามารถแกไขไดโดย คลกขวาท� Banner และเลอกคาส�ง Smart ClipArt Propertiesหรอ Alt+Enter จะข)นหนาโปรแกรมในการจดการขอความ ดงภาพ

Double คลกท�ขอความท�เราตองการจะแกไข จะมเคร�องมอ Popup ข)นมาใหเราแกไขขอความดงภาพ

6. เพยงเทาท�เรากได Banner ใสในหนาเวบเพจ เรยบรอยแลวครบ ดงภาพ

ลองนาไปประยกตใชงานดนะครบ

สาหรบคนท�ใชงาน Dreamweaver แลวอาจจะหนมาใชงาน Namo WebEditor เพ�อประยกตใชงาน Effect บางสวนไปใชงานในหนาเวบเพจ อาจจะไมคนเคยกบเคร�องมอ เราจะจดการโปรแกรมใหมการใชงานคลายกบ Dreamweaver ดวยข )นตอนงายๆ ดงน)

ข �นตอนการทา

1. สรางเอกสาร และเลอกแถบเมนข)นมา ดงภาพ

2. จากน)นจะแสดงแถบเคร�องมอข)นมาดงภาพ

3. ตวอยางการกาหนด Link ดงภาพ

การทาตาราง Rollover Table

ข �นตอนการทา

1. สรางเอกสารข)นมา แลวสรางตารางข)นมา ดงภาพ

2. จากน)นกคลhกขวาแลวเลอก Make Cell Rollover ดงภาพ

3. จากน)นเรากจะเขาสหนาตางสาหรบสราง ตารางRollover ข)นมาดงภาพซ�งประกอบดวย 2เมนหลกดงน)คอ 3.1 Select the style of Rollover เปนเมนท�ใชสาหรบกาหนดรปแบบใหกบตาราง 3.2 Apply Rollover เปนเมนสาหรบกาหนดวาจะใหแสดงผล Rollover กบแถว หรอ คอลมน

4. ในท�น)ผมเลอกใหแสดงผลกบ คอลมน โดยผมตhกในชอง Cell ในเมนท�2 จากน)นกคลhกตรง ป ม Add ในเมนท� 1

5. หลงจากน)นกจะมหนาตางข)นมาแลวใหเราต )งช�อรปแบบของเรา (ต )งเปนภาษาองกฤษเทาน)นหามใชเคร�องหมายใด)

6. เม�อเราต )งช�อเสรจแลว คราวน)เรากจะเขาสหนาตางกานดรปแบบใหกบ ตารางRollover ของเรา และเม�อกาหนดส ตวอกษรและสแบลคกราวไดเปนท�ถกใจแลวกคลhกป ม ok เลย

7. หลงจากน)นกจะกลบมาสหนาตางกานดรปแบบใหกบ ตารางRollover อกคร )งแตคราวน)ลองสงเกตดกจะเหน ตาราง Rollover ท�เราสรางข)นมา และเม�อเราเอาเมาไปแตะ ด มนกจะเปล�ยนสไปตามท�เราไดกาหนดไว และจากน)น กคลhกเลอก Finish กเปนอนเรยบรอยครบทาน

8. จากน)นก Save และลอง Preview ดนะครบ

การทาสของเมนเวบไซตใหไดสตามใจผสรางเวบไซต สาหรบมอใหมน)นอาจจะมองเปนเร�องยาก แตสาหรบโปรแกรมจดทาเวบไซต Namo WebEditor น)ชวยทาใหเร�องท�ผมกลาวมาดเปนเร�องงาย โดยมข )นตอนดงน)

ข �นตอนการทา

1. เ◌ปดหนาเอกสารท�เราตองการทาสขงเมน และทาการเลอก Script Wizard ท� Panel ดานซายดงภาพ

2. จากน)นเลอกท�แถบเมน Text Menu หลงจากท�เลอก Script แลวใหกด Next ดงภาพ

3. ทาการเพ�มเมนท�เราจะใชในหนาเวบไซต โดยกดท�ป ม Add ดงภาพ

4. หลงจากท�สรางเมน ถาเราไมถกใจตาแหนงของเมนกสามารถปรบเปล�ยนไดตามตองการ ดงภาพ

5. ถาถกใจตาแหนงของเมนแลวใหกดท�ป ม Next เพ�อไปทาข )นตอนของการกาหนดสของเมน ดงภาพ

6. หลงจากท�กาหนดสของเมนเรยบรอยแ◌ลวใหกด Next เพ�อทาข )นตอนของการกาหนดรปแบบการแสดงผลเมน ดงภาพ

7. ในการทดสอบผมไดเลอกแบบแสดงเมนปกต จะไดผลดงตวอยาง

*ถาตองการแกไขเมนต )งแตตน เม�อเรากด

การแทรก FlashButton ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ Dreamweaver ไดหรอไม ลองมาอานบทความน)ดครบ ข �นตอนการทา 1. เปดหนาเอกสารข)นมา ดงภาพ

ในการทดสอบผมไดเลอกแบบแสดงเมนปกต จะไดผลดงตวอยาง

ถาตองการแกไขเมนต )งแตตน เม�อเรากด Finish ไปแลวใหทาข )นตอนซ)าต )งแตเร�มตนอกคร )ง ระบบจะจาคาท�เราไ

ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ ไดหรอไม ลองมาอานบทความน)ดครบ

ไปแลวใหทาข )นตอนซ)าต )งแตเร�มตนอกคร )ง ระบบจะจาคาท�เราไดสรางไว

ลงในเวบเพจ หลายคนคงจะไดลองเลนดแลว แตอาจจะมบางคนอาจจะสงสยวาจะแทรกป มคลายๆ

2.จากน)นใหเราเขาไปท�เมน Insert --> FlashButtonจะแสดงหนาตางเมนข)นมา ดงภาพ

3.. เลอกป มท�เปนรปท�เราตองการและทาการดบเบ)ลคลhกท�รปหรอจะคลhกok กไดครบ ดงภาพ

4.คราวน)เรากจะมายงหนาตางปรบแตงFlashButton ทาการกาหนดลงคและใสสหรอปรบขนาดตวอกษรไดเลยครบ

5.จากน)นกด ok จะไดผล ดงภาพ

6. เปนอยางไรกนบางครบ ลองนาไปใชกนด

การทาขอความว�งตามเมาส บางคนอาจจะใช Java Script แตไหนๆ เราตดต )ง Namo ไปแลวตองใชใหเปนประโยชนโดยภายในต )วโปรแกรมจะม Script มาใหอยแลว

ข �นตอนการทา

1. เปดเวบเพจท�เราตองการทาข)นมา หลงจากน)นเลอกเคร�องมอ เคร�องมอน)เรยกวา Layer จากน)นใหเราพมพขอความท�เราตองการใหว�งตามเมาสลงใน Layer ดงภาพ

2. จากน)นใหเราเลอกเคร�องมอ Script Wizard

3. จะมหนาตาง Script ข)นมาใหเราเลอก Script Mouse trails และกด Next

4. จากน)นกด Add เคร�องจะบอกวาใหเรา Add Layer ลงมาใน Box ท�โปรแกรมกาหนด จากน)นกดFinish

5. หลงจากน)นลงทดสอบดวาไดผลดงภาพ หรอ คลกดตวอยาง