สอนการใช้งานโปรแกรม Dreamweaver CS3 ในขั้นพื้นฐาน : ตอนที่ 10/02 : การ Preview และ upload

การ upload เว็บไซด์ของคุณไปยัง server

หลังจากที่คุณได้สร้างและทดสอบการใช้งานของเว็บไซด์คุณแล้ว ตอนนี้คุณก็คงพร้อมที่จะ upload เว็บไซด์ของคุณไปยัง server ที่คุณเช่าอยู่แล้ว ในบทความนี้ ผมจะไม่พูดถึงวิธีการเลือกเช่า server ที่จะ host เว็บไซด์ของคุณ เว็บไซด์ของผม host อยู่กับบริษัท Yahoo ซึ่งอยู่ในอเมริกา เหตุผลที่เลือกก็เพราะเรื่องราคา ซึ่งถูกกว่าการ host เว็บไซด์กับบริษัทในประเทศไทยพอสมควร รวมทั้งคุณภาพก็ถือว่าดีมากครับ ผมไม่เคยมีปัญหาอะไรเลย ตั้งแต่ทำเว็บไซด์ขึ้นมา แต่ถ้าคุณต้องการที่จะสามารถติดต่อกับบริษัทที่ host เว็บไซด์ของคุณได้อย่างรวดเร็วเวลาที่มีปัญหาหรือมีข้อสงสัยจะถาม ผมแนะนำให้เช่า server กับบริษัทที่อยู่ในประเทศไทย เพราะคุณสามารถโทรศัพท์ไปคุยได้ง่ายกว่า ของผมที่เช่ากับ Yahoo เวลาที่ผมมีข้อสงสัยจะถาม ผมต้องเขียนอีเมล์ไป กว่าเขาจะตอบเมล์มาก็ใช้เวลาประมาณ 1 วัน ราคาของการเช่า host ในประเทศตอนนี้ก็ไม่แพงมาก แต่ผมไม่มีบริษัทไหนที่จะแนะนำเป็นพิเศษ เพราะไม่เคยใช้บริการบริษัทในประเทศเลยครับ ข้อได้เปรียบอีกอย่างของการเช่า server กับบริษัทในไทยก็คือ ถ้าเว็บไซด์ของคุณมีคนในประเทศเป็นเป้าหมายหลักที่คุณอยากให้เข้ามาดู เวลาในการโหลดข้อมูลของแต่ละหน้าก็จะเร็วกว่าการไปเช่า server ของต่างประเทศครับ

หลังจากที่คุณได้ลงทะเบียนใช้บริการ host เว็บไซด์ของคุณกับบริษัท web hosting แล้ว ทางบริษัทก็จะให้รายละเอียดในการเข้าไปยัง server กับคุณดังนี้

1. IP address ที่เป็นตัวเลขหรือที่เป็นตัวหนังสือ เช่น เว็บไซด์ของ Sony //www.sony.com มี IP address เป็น 64.37.182.61
2. FTP address ซึ่งจะเป็นที่อยู่ที่จะให้คุณ upload ไฟล์ในเว็บไซด์ของคุณไปยัง server เช่น ftp.joyluck.com
3. username หรือชื่อของผู้ที่มีสิทธิ์จะเข้าไปเปลี่ยนแปลงเว็บไซด์นั้นได้ ส่วนใหญ่คุณต้องระวังตรงนี้นะครับ เช็คกับผู้ให้บริการรับ host เว็บไซด์ให้ดี username ส่วนใหญ่ชื่อ username ที่ใช้ log-in เพื่อโหลดไฟล์ในเว็บไซด์จะต้องตามด้วยชื่อของ domain name เหมือนกับชื่อ email เช่น joy@joyluck.com ถ้าคุณใส่แค่ joy มันจะ log-in ไม่ได้
4. password หรือรหัสผ่าน

คุณสามารถใช้โปรแกรม Dreamweaver CS3 หรือโปรแกรม FTP ตัวอื่นๆ ซึ่งเป็นโปรแกรมที่ใช้สำหรับ upload ไฟล์ไปยัง server โดยเฉพาะก็ได้ เราจะมาดูวิธีใช้งานทั้งสองแบบกันเลยครับ

การ upload เว็บไซด์ไปยัง server โดยใช้ Dreamweaver CS3
การใส่ข้อมูล server ของคุณใน dreamweaver CS3 เพื่อที่จะ connect กับ server ทำได้โดย

1. ไปที่ File Panel แล้วเลือก Manage Sites... จาก drop down เมนู ดังรูปตัวอย่างข้างล่าง



2. หลังจากนั้น คุณก็เลือกเว็บไซด์ที่คุณต้องการจะ upload ไปยัง server ซึ่งมันก็จะเลือกเว็บไซด์ที่คุณกำลังทำงานอยู่ เป็นตัว default อยู่แล้ว คลิกที่ปุ่ม Edit… ดังรูปตัวอย่างข้างล่าง



3. มันก็จะเปิด Dialog Site Definition ขึ้นมา คุณก็คลิกที่ tab Advance อย่างในรูป จริงๆแล้วคุณจะใช้ tab Basic ก็ได้ แต่ว่าการใช้ tab Advance จะทำให้ใส่ข้อมูลได้สะดวก และรวดเร็วกว่า



- ตรงหมวด Category เลือก Remote Info
- ช่อง Access: เลือก FTP จาก drop down เมนู
- ใส่ที่อยู่ของ FTP ลงไปในช่อง FTP host: เช่น ftp.joyluck.com
- ในช่อง Host directory: ช่องนี้ส่วนใหญ่แล้วคุณไม่จำเป็นต้องพิมพ์อะไรลงไป หลักๆแล้วคือเขาถามว่า คุณจะเอาไฟล์ในเว็บไซด์ของคุณไปไว้ในโฟลเดอร์ไหนใน server ซึ่งโฟลเดอร์นี้จะเป็นโฟลเดอร์หลักใน server เวลามีคนพิมพ์ //www.joyluck.com ใน address bar ของเว็บ Browser มันก็จะเข้าไปยังโฟลเดอร์นี้เป็นโฟลเดอร์แรก บริษัทที่ให้เช่า host ส่วนใหญ่จะทำโฟลเดอร์นี้ให้เป็นตัว default อยู่แล้ว ผมเช่า host ของ Yahoo ผมไม่ต้องพิมพ์อะไรตรง Host directory: เวลาที่ผม Log-in เข้าไปโดยพิมพ์ ftp.joyluck.com ในช่อง FTP host: มันก็จะเข้าไปยังโฟลเดอร์หลักของเว็บไซด์เลย แต่ตรงนี้คุณต้องถามบริษัทที่ host เว็บไซด์ของคุณ บางแห่งคุณจำเป็นต้องพิมพ์ที่อยู่ของโฟลเดอร์ย่อย ที่เอาไว้เก็บไฟล์ในเว็บไซด์ในช่อง Host directory: เช่น //www.htdocs/ ซึ่งมันหมายถึง การสั่งให้หลังจากที่ log-in เข้าไปใน server แล้ว จะเห็นโฟลเดอร์ชื่อ //www.แล้วในโฟลเดอร์ //www.ก็จะมีโฟลเดอร์ย่อยอีกอันชื่อ htdocs ให้เข้าไปในนั้นอีก จะได้เอาไฟล์ต่างๆของเว็บไซด์ไว้ในนั้น
- ในช่อง Login: ใส่ชื่อ username ของคุณ ซึ่งทางบริษัทรับ host เว็บไซด์ของคุณจะเป็นผู้ที่บอกคุณว่าต้องใช้อะไร ขอย้ำอีกว่า คุณต้องเช็คกับผู้ให้บริการรับ host เว็บไซด์ให้ดี username ส่วนใหญ่ชื่อ username ที่ใช้ log-in เพื่อโหลดไฟล์ในเว็บไซด์จะต้องตามด้วยชื่อของ domain name เหมือนกับชื่อ email เช่น joy@joyluck.com ถ้าคุณใส่แค่ joy มันจะ log-in ไม่ได้
- ช่อง Password: ใส่ password ที่ทางบริษัทรับ host ให้คุณมา ผมแนะนำให้คลิกเช็คที่สี่เหลี่ยมข้างๆ ที่เขียนว่า Save ด้วย เพราะคุณจะได้ไม่ต้องมาใส่ password ทุกครั้งที่คุณจะ upload ไฟล์ไปยัง server
- คุณอาจจะต้องเช็ค Use passive FTP ขึ้นอยู่กับว่าทางบริษัทที่รับ host ของคุณจะแจ้งมาว่าอย่างไร เว็บไซด์ของผมที่ host กับ Yahoo ต้องเช็คตรงนี้ ไม่อย่างงั้นจะเข้าไปยัง server ไม่ได้
- สุดท้ายคือ ตรง Maintain synchronization information ซึ่งจะถูกเลือกโดย default อยู่แล้ว ตรงนี้จะทำหน้าที่เก็บข้อมูลเวลาที่คุณเปลี่ยนแปลงแก้ไขไฟล์ในเว็บไซด์ แล้วก็ save เป็นไฟล์ dwsync.xml ในโฟลเดอร์ชื่อ _notes ซึ่งจะถูกสร้างขึ้นไว้ในเว็บไซด์ของคุณโดยอัตโนมัติ ฟังชั่นนี้จะมีประโยชน์มากสำหรับเว็บไซด์ใหญ่ๆ เช่น ถ้าคุณมีเว็บไซด์ที่มีมากกว่า 100 หน้า เวลาที่คุณแก้ไขไฟล์ เป็นต้นว่า 20 หน้า คุณก็ไม่ต้องมาจำว่าคุณได้เปลี่ยนแปลงหน้าไหนไปบ้าง ก่อนที่จะ upload มันไปยัง server คุณก็แค่ไปที่เมนู Site แล้วเลือก Synchronize Sitewide



มันก็จะมี dialog box ขึ้นมา เมื่อคุณคลิก Preview… มันก็จะไปเช็คไฟล์ต่างๆในเว็บไซด์ของคุณว่า มีไฟล์ไหนบ้างที่เวอร์ชั่นที่อยู่ใน server เก่ากว่าเวอร์ชั่นที่อยู่ในเครื่องคุณ



แล้วก็แสดงให้คุณดูแบบในรูปข้างล่าง



ถ้าคุณจะ upload เฉพาะไฟล์ที่เป็นเวอร์ชั่นใหม่ไปยัง server คุณก็คลิก OK

ส่วนตัว ผมไม่ค่อยได้ใช้ฟังชั่นนี้เท่าไหร่ เพราะเว็บไซด์ของผมมีแค่ประมาณ 10 หน้า ดังนั้นผมจำเองได้ว่าผมเปลี่ยนแปลงไฟล์อะไรไปบ้าง ก่อนที่จะ upload ไปยัง server แต่ผมก็ปล่อยให้มันเลือกเอาไว้ เพราะมันก็บันทึกข้อมูลการเปลี่ยนแปลงในเว็บไซด์ของผมเป็นแค่ไฟล์เล็กๆ ไม่ได้เปลืองเนื้อที่อะไรมาก แล้วในกรณีที่เว็บไซด์ของผมมีจำนวนหน้ามากขึ้นเรื่อยๆในอนาคต ผมอาจจำเป็นต้องใช้ฟังชั่นนี้

- หลังจากที่คุณใส่ข้อมูลทั้งหมดไปในหมวด Remote Info แล้ว คุณก็ลองคลิกที่ปุ่ม Test ดูเพื่อเช็คดูว่า มันสามารถ log-in เข้าไปยัง server ได้หรือเปล่า ถ้าได้มันก็จะมี dialog ขึ้นมาบอกแบบรูปข้างล่าง



แต่ถ้าไม่ได้ คุณก็ต้องเปลี่ยนข้อมูลในช่องต่างๆของหมวด Remote Info ส่วนใหญ่แล้วที่จะมีปัญหาก็ตรงช่อง Login: Password: แล้วก็การเช็คกับไม่เช็ค Use passive FTP ครับ

หลังจากที่คุณกดปุ่ม Test ผ่านแล้ว คุณก็คลิกปุ่ม OK ตรงหมวด Remote Info แล้วก็มาคลิกที่ icon Expand to show local and remote sites ใน Files Panal ดังรูปตัวอย่างข้างล่าง



มันก็จะขยาย Files Panel จนกินพื้นที่เกือบทั้งจอ คุณจะเห็นว่ามันจะแบ่งพื้นที่เป็น 2 ซีก ทางด้านซ้ายจะเป็นส่วนของ Remote Site ซึ่งจะเป็นส่วนที่แสดงไฟล์ที่อยู่ใน server ทางขวาจะเป็นส่วนที่แสดงไฟล์ที่อยู่ในเครื่องของคุณหรือ Local Files คุณก็คลิกที่ icon connects to remote host ดังรูปข้างล่างครับ



หลังจากที่ connect ได้ คุณก็จะเห็นไฟล์ใน server อย่างรูปตัวอย่างข้างล่าง แต่ตัวอย่างที่ผมทำ มันจะมีไฟล์ทางฝั่ง server อยู่แล้วเพราะผมเคย upload ไฟล์ไปไว้ใน server แล้วก่อนหน้านี้ ถ้าคุณยังไม่เคย upload ไฟล์ไปยัง server เลย ทางฝั่ง Remote Site ก็จะว่างอยู่ จากนั้นคุณก็เลือกไฟล์ที่ต้องการจะ upload จากฝั่ง Local Files ทางขวา แล้วคลิกที่ icon Put File สีน้ำเงินแบบรูปตัวอย่างข้างล่าง เพื่อ upload ไฟล์ไปยัง server หลังจากที่ไฟล์โหลดเสร็จแล้ว คุณก็คลิกที่ icon Expand to show local and remote sites เพื่อย่อขนาดของ Files Panel ให้กลับไปเท่าเดิม



ก็เสร็จแล้ว สำหรับการ upload ไฟล์ไปยัง server ตอนนี้คุณก็ลองพิมพ์ที่อยู่ของเว็บไซด์คุณในช่อง address ของ Browser เช่น //www.joyluck.com เพื่อเช็คดูว่าเว็บไซด์ของคุณสามารถดูได้ทาง internet หรือยัง ซึ่งส่วนใหญ่ก็สามารถดูได้เลย แต่บางครั้งก็ต้องรอสักระยะ ถึงจะดูได้ โดยเฉพาะถ้าคุณเปลี่ยนแปลงไฟล์ใหม่จากตัวเดิมที่มีอยู่แล้วใน server บางครั้งก็ต้องรอสักระยะถึงจะเห็นการเปลี่ยนแปลงครับ

ตอนต่อไปผมจะพูดถึงเรื่องการ upload เว็บไซด์ไปยัง server โดยใช้โปรแกรม FTP ตัวอื่นๆครับ

สำหรับผู้ที่ต้องการจะเรียนรู้โปรแกรม Dreamweaver CS3 ในแบบที่สอนเป็นวีดีโอ คุณสามารถไปดูรายละเอียดได้ที่เว็ปไซด์นี้ //www.dw3thai.com ซึ่งจะมีดีวีดีสอนการใช้งานโปรแกรมโดยลินดาดอทคอม เป็นเวอร์ชั่นภาษาไทย (พากษ์ไทย) ด้วยความยาวกว่า 10 ชั่วโมง ในราคาเพียง 150 บาท (รวมค่าส่งทางไปรษณีย์ลงทะเบียน) และตอนนี้ก็มีทางเลือกอีกทางในการชำระเงิน โดยใช้บริการเรียกเก็บเงินปลายทางจากกรมไปรษณีย์ ซึ่งก็ช่วยให้คุณสะดวกและมั่นใจยิ่งขึ้น คุณสามารถเข้าไปดูรายละเอียดได้จาก link นี้ครับ

Create Date : 15 กรกฎาคม 2551		1 comments
Last Update : 15 กรกฎาคม 2551 16:37:53 น.
Counter : 2946 Pageviews.
Share Tweet