วิธีสร้าง Google gadget
Gadget สำเร็จรูปที่สร้างไว้ให้คุณแทรกมันลงไปใน
Google Sites คุณรู้ไหมว่า คุณก็สร้างมันขั้นมาเองได้ อย่างง่าย ๆ ด้วย Gadget builder!
คุณเคยได้ยิน คำว่า Gadget มาบ้างไหมครับ เจ้า Google Gadget เป็นเหมือนโปรแกรมเล็กๆ ที่มีไว้สำหรับอำนวยความสะดวก ในการสร้างเว็บบน google sites นะครับ ประโยชน์ที่ชัดเจนมากของมัน ที่ผมพบก็คือ มันช่วยแก้ไขปัญหาการแทรกโค๊ด ภาษา Java หรือสคริปต์ทีเขียนขั้นมา แล้ว google sites จะฟ้องมาว่า ไม่อนุญาตให้แทรกโค๊ดลงไป ด้วยเหตุผลด้านความปลอดภัย แล้วก็จะลบโค๊ดเหล่านั้นออกไปโดยอัตโนมัติ
และด้วยเหตุนี้ อาจทำให้คุณไม่ชอบ google sites ก็ได้ เจ้า Gadget builder ของ Google ช่วยแก้ปัญหานี้ได้
แล้วผมจะสาธิตใด้ดู รออีกสักหน่อยนะครับ
ระหว่างที่รอ ให้คุณลองศึกษา Help ของ Google ตามลิงก์นี้ไปก่อนนะครับ
Google Gadgets for your page
- Where can I find the Developer Guide?
- What are gadgets for your webpage?
- How do I add a gadget to my own blog or webpage?
- Is there a way to add gadgets to my page without editing the source code?
- Why do I get a weird HTML message when I add my gadget to my Blogger page?
- Why do I sometimes get a scroll bar along with the gadget on my page?
- How can I create my own border?
- How can I get rid of the links and buttons outside the frame of the gadget?
- How can I make these gadgets work on my MySpace page?
- What if a gadget on my page is broken or displays offensive or inappropriate content?
- What should I do if I get a copyright notice for a gadget I have on my page?
- How can I create my own gadgets?
มาดูตัวอย่าง Gadget ตัวอย่างต่อไปนี้นะครับ
http://hosting.gmodules.com/ig/gadgets/file/116504078390102548848/gadget_for_example_1.xml
ลิงก์ที่อยู่ข้างบนนี้ เป็นลิงก์ที่อยู่ของ gadget ที่ผมสร้างขึ้นมาตามตัวอย่าง ต่อไปนี้นะครับ
คงจำได้นะครับว่า gadget ก็คือไฟล์นามสกุล xml หากคลิกดูลิงห์ข้างบน ก็จะเห็นโค๊ดข้างใน ดังนี้
<?xml version="1.0" encoding="UTF-8" ?>
- <Module>
<ModulePrefs title="hello world example" />
- <Content type="html">
- <![CDATA[
ตำแหน่งที่สำหรับใส่ข้อความและภาษา HTML หรือโค๊ด Script ภาษาต่างๆ เช่น Java Script ตัวอย่างเช่น <a href="http://sites.google.com/rpm6kku">ลิงก์ไปเว็บไซต์สิงห์มอดินแดง</a> <b><font color="red">ข้อความนี้สีแดงตัวหนา</font></b>
]]>
</Content>
</Module>
วิธีสร้าง Gadget ของคุณเอง ดูตัวอย่างต่อไปนี้
ภาพที่ 1 เริ่มต้นสร้าง Gadget ด้วยเครื่องมือ(โปรแกรม) Gadget Editor
1. Login เข้าสู่ระบบก่อน
2. ไป ที่นี่
http://code.google.com/intl/th/apis/gadgets/docs/legacy/gs.html
3. เลื่อนแถบด้านข้างหา Gadget eidtor ตามภาพที่ 1
ภาพที่ 2 แก้ไข หรือแทรกข้อความ โค๊ด HTML หรือ Java Script หรือ embed code ตามใจคุณ (แทนคำว่า Hello, World!) ในแถวที่ 5
ภาพที่ 3 เสร็จแล้วทำการบันทึก
1. คลิกที่ File
2. กด Save As
3. ใส่หรือตั้งชื่อไฟล์ ตามภาพที่ 3 ด้านล่างนี้
4. กด OK
ภาพที่ 3 บันทึกไฟล์
ภาพที่ 4 คัดลอก URL ของไฟล์ไปเก็บไว้ก่อน
1. คลิกขวาตรงไฟล์ (สังเกตุชื่อไฟล์ gadget_for_example_1.xml สีแดง มุมบนขวา)
2. คลิก Copy Shortcut (สำหรับ IE Browser)
3. เอาไปเก็บไว้ก่อน แนะนำว่าควรใช้ Note pad เก็บข้อมูลไฟล์เหล่านี้ไว้ต่างหากก่อนนำไปใช่
(URL ในข้อ 2 นี้ก็คือ http://code.google.com/intl/th/apis/gadgets/docs/legacy/gs.html )
4. เสร็จแล้วครับ ต่อจากนี้ไปก็เป็นการนำไปใช้แล้วครับ
ดูการนำไปใช้กันหน่อยครับ
1. เข้าสู่ edit mode
2. คลิก insert เลื่อนแถบไปล่างสุด เลือก More gadgets
3. คลิกที่ Add gadget by URL
4. ใส่ URL ไฟลร์ที่เราก๊อปมา วางลงไป แล้วกด Add ภาพภาพข้างบนนี้
5. ใส่ค่าต่างๆ ตามต้องการ หรือจะยังไม่ปรับอะไรก็กดปุ่ม OK เลยก็ได้
6. จะกลับมาหน้า edit mode กดปุ่ม Save เพื่อบันทึก
ส่วนขนาดและตำแหน่งที่วางในเว็บ google sites นี้ ก็จัดวางตำแหน่งใหม่ได้ตามใจชอบ ตัวอย่างข้างบนผมปรับขนาดแล้ว ตามภาพข้างล่างนี้
จบแล้วครับ
อาจจะงงๆ หน่อย ขออภัยในการสื่อสารที่ไม่ค่อยเอาไหน แต่ลองๆ แกะดูนะครับ เจ้า Gadget Editor ตัวนี้ใช้ประโยชน์ได้เยอะ สำหรับ Google Sites และประยุกต์ใช้ได้อย่างดีเยี่ยมหลายสถานการณ์ ผมว่าทำให้เว็บเราไม่น่าเบื่อ พบกันคราวต่อไปเกี่ยวกับ การแก้ไข gaddget นะครับ