3. จะปรากฏหน้าต่าง Insert FLV ใหค้ ลิกท่ปี ุ่ม Browse เพ่ือเลอื กไฟล์ FLV (สามารถกาหนดค่าตา่ ง ๆ ดังนี)้ จากนั้นคลกิ ทุี่ปมุ่ OK - Video type : วธิ กี ารแสดงวิดีโอ - Skin : รปู แบบของแผงควบคมุ การเล่นวดิ โี อ - Width : ความกวา้ งของวดิ โี อ - Height : ความสูงของวดิ ีโอ - Constrain : คงสัดสว่ นของวิดโี อ เมอ่ื ปรับความกว้างหรอื ความสงู - Auto play : กาหนดให้เลน่ ไฟล์ FLV ทันที - Auto rewind : กาหนดใหเ้ ลน่ ไฟล์ FLV ซา้ 4. ไฟล์ FLV จะแทรกในหนา้ เว็บเพจ ดังรปู
การใสเ่ สยี งเพลง การแทรกไฟลเ์ สยี งในเวบ็ เพจ เชน่ .midi , .wav , .mp3 เป็นตน้ ซ่งึ มีวธิ กี ารดงั นี้ 1. คลกิ เลือกตาแหนง่ ที่จะแทรกไฟลเ์ สียง 2. คลกิ ที่เมนู Insert ให้เลือก Media แลว้ เลือก Plugin
3. จะปรากฏหนา้ ตา่ ง Select File ใหเ้ ลือกโฟลเดอรท์ ี่เก็บไฟล์ 4. เลือกไฟลท์ ต่ี ้องการ 5. คลิกทป่ี ุม่ OK 6. คลิกทป่ี ุม่ Yes เพือ่ บันทึกไฟล์เพลงในโฟลเดอร์จดั เกบ็ เว็บไซต์ 7. จะปรากฏหนา้ ตา่ ง Copy File As ในช่อง Save in ให้เลอื กท่ีจดั เก็บไฟล์ สว่ นช่อง File name ตั้งช่ือไฟลเ์ สียง แล้วกดปุม่ Save
8. จะปรากฏไอคอนขึ้นมา 9. ถา้ ตอ้ งการซอ่ นแถบควบคุมเสียง ให้คลิกทป่ี ุ่ม Parameter 10. ในสว่ น Parameter ใหพ้ มิ พ์ hidden และส่วน Value ใหพ้ มิ พ์true (ถ้าตอ้ งการยกเลกิ แถบควบคุมเสยี ง ใหล้ บค่าออก)
หน่วยท่ี 7การสรา้ งลิงค์ในเวบ็ ไซต์
การเช่ือมโยงในหน้าเว็บเพจในกรณที ี่เว็บเพจมเี นื้อหาและมีขนาดยาวมาก ทาใหต้ ้องใชเ้ มาส์เลือ่ นแถบScroll bar เราสามารถสรา้ งการเชอื่ มโยงภายในเวบ็ เพจเพื่อให้สะดวกในการดเู นอื้ หาในหนา้ เว็บเพจ มวี ธิ ีการดังนี้ก้าหนดจุดเป้าหมาย ที่ต้องการจะเชื่อมโยง 1. คลิกวางเคอร์เซอรต์ รงตาแหน่งท่ีต้องการ 2. คลิกทีเ่ มนู Insert แล้วเลอื ก Named Anchor หรือ กดปุม่ Ctrl +Alt + A 3. หรอื แถบ Insert ให้เลือก Common แล้วคลิก NamedAnchor
4. จะปรากฏหนา้ ต่าง Named Anchor ใหต้ ัง้ ช่อื จดุ เช่ือมโยง แลว้คลกิ ที่ป่มุ OK 5. จะปรากฏสัญลกั ษณ์การเช่อื มโยง ดังรูป
การสร้างจุดเช่อื มโยงไปยังเป้าหมาย การกาหนดตาแหน่งการสร้างจดุ เชื่อมโยง อาจใช้ข้อความหรอื รปู ภาพเปน็ จุดเชื่อมโยงกไ็ ด้ 1. เลือกข้อความหรือรูปภาพท่ีจะสรา้ งเป็นจุดเชอ่ื มโยง 2. คลิกทปี่ ุ่ม HTML 3. ชอ่ ง Link ให้พิมพ์เคร่อื งหมาย # แลว้ ตามด้วยชอื่ จดุ เป้าหมาย(ตามหวั ข้อ ก้าหนดจุดเป้าหมาย ที่ต้องการจะเชื่อมโยง) 4. ทดสอบการแสดงผลจากเวบ็ เบราว์เซอร์ โดยกดป่มุ F12
การเช่ือมโยงภายในเวบ็ ไซต์การจัดทาเว็บไซต์ ซงึ่ ประกอบไปด้วยหลาย ๆ เว็บเพจ แต่ละเว็บเพจสามารถเช่ือมโยงกนั ได้ มวี ิธกี ารดงั นี้ 1. เลือกข้อความหรือรูปภาพทต่ี ้องการใช้เปน็ จดุ เชื่อมโยง 2. ท่ี Properties Inspector ในชอ่ ง Link ใหค้ ลิกที่ปุ่ม Browse เพื่อเลอื กไฟลท์ ่จี ะทาการเชื่อมโยง
3. จะปรากฏหนา้ ตา่ ง Select File ใหเ้ ลอื กโฟลเดอร์ท่เี กบ็ ไฟลเ์ ว็บเพจ4. เลอื กไฟล์เว็บเพจที่ตอ้ งการจะเชอ่ื มโยง5. คลกิ ทป่ี ุ่ม OK
6. ชอ่ ง Link จะปรากฏไฟลเ์ ว็บเพจท่เี ลือก 7. ชอ่ ง Target เปน็ การกาหนดวธิ เี ปิดหน้าเวบ็ ทเ่ี ช่อื มโยง ดงั นี้ _blank ใหเ้ ปิดหนา้ เว็บที่เช่ือมโยงในหนา้ ตา่ งเบราวเ์ ซอร์ใหม่ new ให้เปิดหนา้ เวบ็ ทเ่ี ชื่อมโยงในหนา้ ต่างเบราวเ์ ซอร์ใหม่อกี หนา้ ต่าง _parent ให้เปิดหนา้ เวบ็ ท่ีเชื่อมโยงในหน้าต่างเบราวเ์ ซอร์เดมิ _self ให้เปิดหน้าเว็บทเี่ ชอื่ มโยงในเฟรมเดิม _top ใหเ้ ปดิ หน้าเว็บที่เชอ่ื มโยงในหน้าต่างเบราวเ์ ซอร์เดมิ โดยจัดให้เตม็เฟรม 8. ทดสอบการเชื่อมโยง โดยกดปุม่ F12 เพื่อดูการแสดงผลจากเวบ็เบราว์เซอร์ แลว้ คลกิ จุดเชอ่ื มโยง
การเช่อื มโยงภายนอกเว็บไซต์ การเชื่อมโยงไปยงั เวบ็ ไซต์อน่ื ๆ ทีอ่ ยู่ภายนอก เพ่อื ต้องการใหผ้ ู้ชมเวบ็ ไซต์ของเราสามารถศึกษาขอ้ มลู เพ่ิมเติมได้ มวี ธิ ีการดังนี้ 1. เลอื กข้อความหรอื รูปภาพทีต่ อ้ งการใชเ้ ปน็ จดุ เชื่อมโยง 2. ท่ี Properties Inspector ในชอ่ ง Link ให้พมิ พช์ ื่อ URL ของเวบ็ ไซตท์ เ่ี ราต้องการเชือ่ มโยง โดยพิมพค์ าวา่ http:// แล้วตามดว้ ยชื่อของเวบ็ ไซต์ เช่น http://www.dkd.ac.th
การเชือ่ มโยงไปยงั อีเมลการเช่อื มโยงไปยังอเี มล เปน็ ชอ่ งทางในการสอ่ื สารสาหรบั ให้ผูต้ ้องการจะตดิ ตอ่ผา่ นอีเมลได้อยา่ งสะดวก รวดเรว็ ขน้ึ มวี ิธกี ารดังน้ี 1. เลือกขอ้ ความหรือรูปภาพทต่ี อ้ งการใช้เปน็ จดุ เช่อื มโยง 2. ที่ Properties Inspector ในชอ่ ง Link ใหพ้ ิมพช์ อ่ื URL ของเว็บไซต์ทเี่ ราตอ้ งการเช่อื มโยง โดยพิมพค์ าวา่ mailto: แลว้ ตามดว้ ยชือ่ ของเวบ็ ไซต์ เชน่ mailto:[email protected]
การเชอ่ื มโยงเพื่อดาวน์โหลด การเชื่อมโยงเพอ่ื ดาวนโ์ หลดมีจุดประสงค์ เพือ่ ตอ้ งการเช่อื มโยงไปยงัแฟม้ ขอ้ มูล เช่น ไฟล์รปู ภาพ ไฟล์เอกสาร หรอื ไฟล์อื่น ๆ มีวิธกี ารดงั นี้ 1. เลอื กข้อความหรือรูปภาพทต่ี ้องการใช้เป็นจุดเชื่อมโยง 2. ที่ Properties Inspector ในช่อง Link ใหค้ ลกิ ทปี่ ุ่ม Browse เพอ่ืเลือกไฟลท์ ีจ่ ะทาการเชอ่ื มโยงเพ่ือดาวนโ์ หลด
3. จะปรากฏหนา้ ตา่ ง Select File ให้เลือกโฟลเดอร์ทีเ่ กบ็ ไฟล์4. เลอื กไฟล์ท่ตี ้องการ5. คลกิ ทป่ี ุ่ม OK
การเชอ่ื มโยงด้วย Map Link การเชื่อมโยงดว้ ย Map Link เปน็ การกาหนดขอบเขตของการเชอ่ื มโยงบนรปู ภาพ เฉพาะส่วนท่ีตอ้ งการ ซงึ่ พ้นื ทก่ี ารเชื่อมโยงเปน็ รปู สีเ่ หล่ยี มรูปวงกลม หรือรูปหลายเหล่ียม มีวธิ กี ารดงั นี้ 1. คลิกเลอื กรูปภาพท่ตี ้องการใหเ้ ชอ่ื มโยง
2. คลกิ เลอื กเครื่องมอื ใน Properties Inspector3. กาหนดพืน้ ที่ ท่ีตอ้ งการจะสรา้ งจดุ เชอื่ มโยง4. ในชอ่ ง Link ให้พิมพช์ ่อื เว็บไซตห์ รอื เลอื กไฟล์ท่ตี อ้ งการจะเชื่อมโยง
การเชอ่ื มโยงด้วย Rollover Image Rollover Image เปน็ การสลบั รูปภาพทแ่ี สดง ภาพหนึง่ เป็นภาพกอ่ นวางเมาส์ ส่วนอีกภาพสาหรับให้ปรากฏตอนวางเมาสเ์ หนอื ภาพนน้ั มวี ธิ กี ารดงั น้ี 1. คลกิ เมาส์วางเคอรเ์ ซอรต์ รงตาแหน่งท่ตี อ้ งการ 2. คลกิ ท่ีเมนู Insert คลิกที่ Image Objects แล้วเลือก Rollover Image 3. จะปรากฏหน้าตา่ ง Insert Rollover Image ใหก้ าหนดค่าต่างๆ ดังนี้
Image Name : ชือ่ ของรูปภาพ Original image : การกาหนดรปู ภาพแรกท่จี ะแสดง Rollover image : การกาหนดรูปภาพที่ 2 ท่ีจะแสดง เมอ่ื นาเมาสว์ างเหนอื รูปภาพ Alternate text : การกาหนดข้อความกากับรูปภาพ When clicked, Go to URL : กาหนดไฟลห์ รอื URL ทีต่ อ้ งการจะเช่อื
4. เมอ่ื กาหนดค่าตา่ ง ๆ เสร็จเรียบร้อยแล้ว จะได้ดงั รปู 5. ทดสอบการเชอื่ มโยง โดยกดป่มุ F12 เพ่อื ดูการแสดงผลจากเวบ็เบราว์เซอร์
หน่วยท่ี 8 การตกแตง่ เวบ็ ไซด์ดว้ ยเทมเพลต (Template)
การนา้ เทมเพลตมาใชส้ ร้างเว็บเพจ เมอื่ ได้สรา้ งเว็บเทมเพลตไว้เรียบรอ้ ยแล้ว ขนั้ ตอนต่อไปกค็ อื การน้าเว็บเทมเพลตทส่ี ร้างไวม้ าใช้เป็นต้นแบบเพื่อสร้างเวบ็ เพจขน้ั ตอนการน้าเทมเพลตมาใชส้ ร้างเวบ็ เพจ
การแก้ไขเทมเพลต สา้ หรบั เทมเพลตทีส่ รา้ งขึ้นมาแล้ว สามารถเปล่ยี นแปลงแกไ้ ขในสว่ นพ้ืนทีค่ งที่ในเทมเพลต ได้โดยไมต่ ้องตามไปแกเ้ ว็บเพจทุกหน้าทสี่ ร้างข้ึนเนื่องจากโปรแกรมจะอพั เดทสิ่งทแี่ ก้ไขต่าง ๆ ในเทมเพลตให้กับทุกหน้าเว็บเพจโดยอัตโนมตั ิ
การยกเลิกเว็บเพจให้สามารถแกไ้ ขได้ทกุ ส่วน เวบ็ เพจที่สร้างขึ้นมาจากเทมเพลต หากต้องการแกไ้ ขสว่ นพืน้ ท่คี งทเี่ ฉพาะในหน้าเวบ็ เพจนี้ เท่านน้ั สามารถยกเลิกการใช้เทมเพลตสาหรับเว็บเพจน้นั ได้
ข้นั ตอนการยกเลกิ เวบ็ เพจใหส้ ามารถแก้ไขไดท้ ุกสว่ น
Search