สมาชิก THTWEB หลายท่านที่ต้องการนำเสนองานเอกสาร บนหน้าเว็บไซต์ แต่ไม่สามารถทำแบบนั้นได้

เพราะจะต้องโหลดไฟล์ ไปเก็บไว้ที่คอมพิวเตอร์ก่อน จากนั้นจึงเปิดภาพโปรแกรมที่สามารถอ่านไฟล์เอกสารนั้นได้
แต่ถ้าคอมพิวเตอร์ ที่ใช้งานอยู่ ไม่มีโปรแกรมที่ใช้อ่านไฟล์งานนั้น คุณก็จะเปิดอ่านงานนั้นไม่ได้

จึงเป็นที่มาของบทความนี้ครับ เรามีวิธีที่จะทำให้สามารถอ่านไฟล์งานเอกสาร จากหน้าเว็บไซต์ได้ทันที โดยใช้เครื่องมือจาก Google Doc Viewer เพื่อเปิดอ่าน เอกสาร PDF งานนำเสนอ PowerPoint เอกสาร Word และยังสนับสนุนประเภทไฟล์อีกมายมาย

• Microsoft Word (.DOC and .DOCX)
• Microsoft Excel (.XLS and .XLSX)
• Microsoft PowerPoint (.PPT and .PPTX)
• Adobe Portable Document Format (.PDF)
• Apple Pages (.PAGES)
• Adobe Illustrator (.AI)
• Adobe Photoshop (.PSD)
• Tagged Image File Format (.TIFF)
• Autodesk AutoCad (.DXF)
• Scalable Vector Graphics (.SVG)
• PostScript (.EPS, .PS)
• TrueType (.TTF)
• XML Paper Specification (.XPS)
• Archive file types (.ZIP and .RAR)

*** แต่ยังมี bug อยู่บ้าง กับ IE ที่บางครั้งอาจยังไม่แสดงเอกสารขึ้นมาทันที วิธีแก้ไขให้ คลิ๊กที่ไอคอน ด้านบนขวา อันสุดท้าย (จะpopup หน้าเอกสารให้ใหม่)

ดูเอกสารออนไลน์ กับ Google Doc

ขั้นตอนที่ 1 : เตรียมงานที่จะนำมาแสดง

1. Login อยู่ในระบบ Webmaster

2. อัพโหลดไฟล์งาน ที่เมนู 5.4 อัพโหลดไฟล์ (หากในเว็บไซต์ มีไฟล์เอกสารอยู่แล้ว ให้ข้ามมาข้อถัดไป ได้เลย)

3. คลิ๊กเมาส์ ที่เมนู 5.2 ไฟล์ประกอบอื่นๆ (.gif .jpg)

4. ในช่อง "ค้นหาชื่อไฟล์" (เลข1) : พิมพ์ นามสกุล ของไฟล์ที่จะใช้งาน ลงไป หรือจะใส่ชื่อไฟล์ ก็ได้ เช่น พิมพ์นามสกุลของไฟล์ word   "doc" ดังภาพประกอบ จะทำให้การค้นหาไฟล์ ทำได้ไวยิ่งขึ้น

5. เมื่อเจอไฟล์ ที่ต้องการแล้ว ดูที่คอมลัมภ์ "ดูผล"

• นำเมาส์ไปชี้ที่ไอคอน
• แล้ว : คลิ๊กขวา + Copy Shortcut (เลข2)

ขั้นตอนที่ 2 : สร้าง code ที่ Google Doc เพื่อจะนำมาใช้ในเว็บไซต์

1. เปิดหน้าเว็บไซต์ Google Doc หรือ

2. วาง code ที่ copy มาจากขั้นตอนที่1 ลงในช่อง (เลข3)

โดย คลิ๊กขวา + Paste

3. ช่อง "ข้อความลิงก์" ปล่อยว่างไว้ 

4. แล้วกดปุ่ม  (เลข4)

5. ระบบจะสร้าง code ให้ ดังภาพประกอบ

• สังเกตุที่ ช่องสุดท้าย
  ให้ copy code ทั้งหมดภายในช่อง (เลข5)

ขั้นตอนที่ 3 : นำ code ที่ได้จาก Google Doc กลับไปวางที่เว็บไซต์

1. กลับมายัง เว็บไซต์ของคุณ

2. เปิดไปยังหน้าเว็บไซต์ ที่จะแสดงไฟล์เอกสาร แล้วแก้ไขหน้านั้น

3. ในหน้าดีไซต์

• 3.1 กำหนดตำแหน่งที่จะแสดง (เลข6)
        โดยคลิ๊กเมาส์ ยังตำแหน่งนั้น ให้ mouse pointer กระพริบ
• 3.2 คลิ๊กที่ ไอคอนเครื่องมือ เพิ่ม/แก้ไข Script (เลข7)
• 3.3 เมื่อหน้าต่าง เพิ่ม/แก้ไข Script แสดงขึ้นมา
        ให้ใส่ code ที่ copy มาจากขั้นตอนที่ 2 Google Doc วางลงไป (เลข8)
• 3.4 เสร็จแล้วกดปุ่ม

4. สุดท้าย  แล้ว ดูหน้าตัวอย่าง

5. ในหน้าเว็บไซต์ จะแสดงดังภาพประกอบ ตามไฟล์ที่กำหนด

ข้อแนะนำเพิ่มเติม : การปรับขนาดความกว้าง และสูง ของการแสดงผลไฟล์งาน

1. กลับเข้าไปยังหน้าแก้ไข

2. นำเมาส์ ไปวางบริเวณ Script ให้สังเกตุว่าพอ mouse pointer เปลี่ยนเป็นรูป ให้คลิ๊ก 1 ครั้ง บริเวณรอบ Script จะมีจุด 8จุด ล้อมรอบ (เลข1)

3. คลิ๊กที่ไอคอนเพิ่ม/แก้ไข Script (เลข2)

4. เมื่อหน้าต่าง เพิ่ม/แก้ไข Script แสดงขึ้นมา แก้ไข code ดังนี้ (เลข3)

• height=ใส่ตัวเลขความสูงที่ต้องการ
• width=ใส่ตัวเลขความกว้างที่ต้องการ

5. เสร็จกดปุ่ม  ออกมา

6. แล้ว  ได้เลย เพื่อดูผลการพัฒนา จากหน้าเว็บไซต์

*** แต่ยังมี bug อยู่บ้าง กับ IE ที่บางครั้งอาจยังไม่แสดงเอกสารขึ้นมาทันที วิธีแก้ไขให้ คลิ๊กที่ไอคอน ด้านบนขวา อันสุดท้าย (จะpopup หน้าเอกสารให้ใหม่)