พัฒนาเว็บไซต์และโปรแกรม « แลกเปลี่ยนเรียนรู้:km tool

archive page

บันทึกใน ‘พัฒนาเว็บไซต์และโปรแกรม’

ศูนย์ศิษย์เก่าเชื่อมกับเว็บเครือข่ายสังคม

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, July 18th, 2010
ศิษย์เก่าโยนก

ศิษย์เก่าโยนก

17 ก.ค.53 ค้นคำว่าศูนย์ศิษย์โยนก พบข้อมูลศิษย์เก่าของมหาวิทยาลัยโยนก เป็นแบบรู้หน้าไม่รู้ใจ งานนี้เป็นการต่อยอดงานที่ทำไว้เมื่อก.ค.52 วันนี้เริ่มเก็บที่อยู่ภาพ และที่อยู่เว็บเพจของศิษย์เก่าใน fb ของแต่ละคนเข้าฐานข้อมูล Microsoft Access แต่ยังไม่เชื่อมรหัสนักศึกษาเข้ากับข้อมูลลิงค์ของ Facebook ปัญหาใหญ่คือ 1) เจ้าของ profile ไม่ใช้ชื่อจริง ไม่ใช้รูปจริง และมากกว่าครึ่งเป็นสมาชิกที่เคลื่อนไหวน้อย 2) รู้สึกไม่มั่นใจในนโยบายของเฟรซบุ๊ค เกรงว่าจะปิดการลิงค์ภาพออกมาจากเฟรซบุ๊ค ถ้าเป็นเช่นนั้นระบบของผมคงแน่ แต่แผนสองคือคัดลอกภาพทั้งหมดไว้ก่อน แต่ถ้าคัดลอกตามรหัสนักศึกษาได้ก็จะปลอดภัยที่สุด .. ดังนั้นการรู้รหัสให้เข้ากับใบหน้า จึงเป็นงานที่ผมอาจทำไม่สำเร็จในเวลาที่รวดเร็ว เพราะบางคนแค่คุ้น ๆ เท่านั้นเอง และอีกไม่น้อยที่ผมไม่รู้ว่าเขาเป็นศิษย์เก่า จึงสังหรใจว่างานนี้ทำคนเดียวไม่สำเร็จเป็นแน


การวาดภาพเพื่อการสื่อสารและแผนที่มโนทัศน์

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Saturday, July 17th, 2010
การวาดเพื่อการสื่อสาร

การวาดเพื่อการสื่อสาร

17 ก.ค.53 เข้าอบรมการวาดเพื่อการสื่อสาร และ การเขียนแผนที่มโนทัศน์ (CMAP = Concept mapping) ณ ห้องประชุม 2 กศน.ภาคเหนือ จัดโดยสถาบันนวัตกรรมกระบวนการเรียนรู้ชุมชน (Community Learning Process Innovation Institute)ในวันนี้มีหลายกิจกรรมเกิดขึ้นที่พอสรุปได้มีดังนี้ 1) เป้าหมายสี่ส่วน 2) เรียงคำย้อนกลับ 3) สี่วงกลมเป็นภาพ 4) การวาดตัวแทน อารมณ์ แขนขา สถานที่ และเส้น 5)วาดภาพนิยาย 6) แผนที่มโนทัศน์

คุณภัทรา มาน้อย ให้ข้อมูลเพิ่มเติมว่า หลักสูตรการวาดเพื่อการสื่อสาร มีองค์ประกอบของหลักสูตรประกอบไป ด้วย 1) กิจกรรมการสร้างจินตนาการ : โดยมีเป้าหมายเพื่อกระตุ้นการทำ งานของสมองซีกขวา โดยการดึงจินตนาการจากจิตใต้สำ นึกผ่านกิจกรรมการวาดวงกลม 4 วงให้สัมพันธ์กันและการฟังเพล งสื่อความหมาย ทั้งนี้ให้ผู้เข้าร่วมอบรมมีความมั่นใจในการใช้จินตนาการของตนเอง 2) กิจกรรมการฝึกทักษะ/เทคนิค/วิธี การวาดรูป: โดยมีเป้าหมายให้ผู้เข้าร่วมนำ เทคนิคที่ได้เรียนรู้ไปผนวก กับจินตนาการที่มี ผ่านการเติมทักษะการวาดรูปร่าง หน้าตา อารมณ์ สถานที่ อาชีพ และการใช้เส้น ลูกศร 3) กิจกรรมการฝึกทักษะการสื่อสาร : โดยเน้นหลักการฟัง จับใจความ และการวาดเพื่อการสื่อสาร ผ่านกิจกรรม นิทานสร้างภาพ 4) กิจกรรมการนำแนวคิดการวาดเพื่อ การสื่อสารไปปรับ : โดยเติมเต็มแนวคิดการทำ CMAP (Conceptual Mapping) เช่น แบบใยแมงมุมหรือดาวกระจาย แบบช่วงชั้นของความคิด แบบ Flow ของงานก่อนหลัง แบบเชิงระบบหรือเชื่อมโยง แบบแผนภาพ และ แบบสามมิติ

การวาดแผนที่มโนทัศน์มีรูปแบบการวาด 6 แบบ ดังนี้ 1) แบบใยแมงมุมหรือดาวกระจาย คล้ายแผนที่ความคิด 2) แบบช่วงชั้นของความคิด คล้ายแผนผังองค์กร 3) แบบโฟลของงานก่อนหลัง คล้ายวงจรพีดีซีเอ หรือขั้นตอน 4) แบบเชิงระบบหรือเชื่อมโยง คล้ายกระบวนการแบบไอพีโอ 5) แบบแผนภาพ คล้ายแผนภาพที่เชื่อมโยงกัน 6) แบบสามมิติ คล้ายความสัมพันธ์ของจังหวัด และมีภาพที่ทีมงานเผยแพร่จำนวน 125 ภาพ
+ http://www.thaiall.com/research/manoi530717/

facebook map

facebook map


การปรับโปรแกรม dm-albums ให้ใช้เป็น album ได้อย่างปลอดภัย

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Saturday, July 10th, 2010
dm-albums

dm-albums

10 ก.ค.53 โปรแกรม dm-albums ซึ่งเป็น plugin ของ wordpress เป็นระบบ Album ที่ดี และช่วยในการทำ Album ตามชื่อ Folder ได้อัตโนมัติทันที โดยเรียกผ่าน URL แต่ความสามารถนี้เสมือนการ Hack เข้าไปในระบบที่ไม่มีการป้องกัน นอกจากจะเปิด Folder แล้วยังสร้างห้อง .cache สำหรับเก็บ Thumbnail และ สร้างแฟ้ม browse.cap สำหรับบันทึก Caption ของแต่ละภาพ
     ในกรณีไม่ต้องการใช้ dm-albums กับ wordpress แต่ต้องการใช้เป็นระบบ Album กับชื่อ Folder โดยตรงสามารถปรับแก้ดังนี้
1. deactive plugin ใน wordpress
2. ลบห้อง .cache ใน folder ที่เคยเข้าไปทดสอบ (ถ้ามี)
3. ลบแฟ้มใน wp-content/plugins/dm-albums/ คือ screenshot-1.jpg – screenshot-8.jpg และลบแฟ้มที่ขึ้นต้นด้วย wp-dm-*
4. เปลี่ยนชื่อ folder ในห้อง dm-albums จาก flash เป็น _flash จาก preview เป็น _preview จาก slidesorter เป็น _slidesorter
5. เปิดแฟ้ม db-albums.php แล้วแก้ไขส่วนท้ายของโปรแกรม
โดยเติม if($LOCAL_DIR != “/../handbill/” && $LOCAL_DIR != “/../actress/”) exit;
ก่อนบรรทัด require(“php/photoalbum.php”);
+ http://www.thaiall.com/handbill/  (frame)


ปัญหา friends list และจำกัด Tag

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Saturday, July 10th, 2010
friends list

friends list

10 ก.ค.53 หลายวันก่อน ใช้งานระบบ Friends List โดยกลุ่มเพื่อนแยกออกไปหลายกลุ่ม ตามบทบาทในสังคม ล่าสุดแยกกลุ่มนักศึกษาไว้ 3 กลุ่มในภาคเรียนนี้ และจะเพิ่มอีก 4 กลุ่ม ก็มาพบว่าบริการนี้หายไป ทำให้ไม่สามารถเข้าไปจัดการสมาชิกในกลุ่มได้อย่างที่เคยทำ แต่มีรายการแสดง Friends List ให้สูงสุดเพียง 8 กลุ่ม ก็ต้องลุ้นว่าทาง Facebook จะเปลี่ยนนโยบายให้เข้าจัดการระบบ เพื่อนได้ในเร็ววัน
     มาวันนี้จัดทำข้อมูลจากการสำรวจ นักศึกษา และได้ tag นักศึกษาเข้ากับ Note ที่จัดทำขึ้น ก็มาพบว่า Tag ของ Note จำกัดไว้ที่ 30 สมาชิก ดูได้ที่ [ผลสำรวจ 30 tag จากเป้า 60] แต่ tag ของ photo album ผมเคยทำไปถึง 34 เกินข้อจำกัดใน Note ดูได้ที่ [บุคลากรโยนก ]
+ http://www.thaiall.com/facebook
+ ผลสำรวจ
http://www.facebook.com/note.php?created&&suggest&note_id=407833780868
+ บุคลากรโยนก
http://www.facebook.com/album.php?aid=182776&id=814248894


ปัญหาวีดีโอคลิ๊ปทำให้ต้องแบ่งเป็น 2 เรื่อง

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Wednesday, July 7th, 2010

7 ก.ค.53 เหนื่อยกับตัดต่อวีดีโอคลิ๊ปกว่า 2 ชั่วโมง เหตุเกิดจากถ่ายวีดีโอคลิ๊ปด้วยกล้องมือถือของ MISO ได้แฟ้ม .avi แล้วนำเข้าโปรแกรม Windows Movie Maker พบว่ามีปัญหาขั้นตอนสุดท้ายคือการ Save Movie เป็น .wmv จึงเปลี่ยนไปใช้ Proshow Producer ก็ยังพบปัญหาอีก จึงใช้ Total Video Converter แปลงแฟ้มเป็น .mpg แล้วนำเข้า Proshow Producer อีกครั้ง ก็ยังพบปัญหาเดิมอีก คือวีดีโอหยุดเลื่อนภาพหรือภาพกระด้าง แต่เสียงยังเดินต่อไป แล้วไปเล่น scene ใหม่ .. ที่ใช้เวลากว่า 2 ชั่วโมงเพราะการทดสอบแต่ละครั้งต้องรอหลายนาที ในหลายความเป็นไปได้ที่อาจจะเป็นวิธีแก้ปัญหาที่เกิดขึ้น
     พบว่า แก้ปัญหาโดยการเพิ่ม title slide ก่อนเข้าวีดีโอที่กระด้าง แต่แก้ปัญหาให้กับคลิ๊ปแรกได้ แล้วไปพบปัญหาอีกครั้งในคลิ๊ปสุดท้าย จึงตัดสินใจแยกคลิ๊ปออกไปวิชาละไฟล์ เพราะการ encode หรือ render กับหลาย clip ในไฟล์เดียวกัน ทำให้มีปัญหาคลิ๊ปกระด้างในบางคลิ๊ปเกิดขึ้น
+ http://www.youtube.com/watch?v=90jhnIuWzxs
+ http://www.youtube.com/watch?v=qqZgBTKTbjQ


upgrade wordpress เป็น 3.0

โดย ขวัญชนก รุจจนพันธุ์ เมื่อ Monday, July 5th, 2010
upgrade wordpress 3.0

upgrade wordpress 3.0

5 ก.ค.53 การ upgrade wordpress ของ aclalumni.com จาก 2.9 เป็น 3.0 จะมีการตรวจสอบรุ่นของ plugin และเปิดให้มีการ upgrade automatically ก่อนทำกับตัวหลัก ซึ่งการดำเนินการควรทำการ backup ข้อมูลใน mysql ทั้งหมดเก็บไว้ก่อน เผื่อพลาด .. เพราะอะไรอะไรก็ล้วนเป็นไปได้ทั้งสิ้น .. กันไว้ดีกว่าแก้ แย่แล้วจะแก้ไม่ทัน ..
     แล้วผมก็ upgrade akismet ช่วยกรอง spam ใน comment เป็นรุ่น 2.3.0 พบว่าต้องใช้ API key ที่ลงทะเบียนจากผู้ให้บริการ มองหาให้ดีจะพบว่าใช้บริการฟรีแบบ non profit ได้ ลงทะเบียนใน akismet.com แล้ว เขาจะส่ง apikey มาให้ทางอีเมล โดยไม่ต้อง verify อีเมลด้วย gthaiall ครับ
     ส่วนการ upgrade เป็น รุ่น 3.0 ซึ่งปรับจาก 2.9 เป็น 3.0 ผมทดสอบแล้วไม่พบปัญหาแต่อย่างใด เนื่องจากไม่มี plugin พิเศษ หากท่านใช้ plugin หลายตัวก็ต้องพิจารณาแต่ละตัวอย่างระมัดระวัง เพราะถ้ารุ่นเดิมดีอยู่แล้ว ผมก็ไม่แนะนำให้ upgrade ครับ


4 ขั้นตอนกับการทำ sitemap ของสถาบัน

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Friday, July 2nd, 2010

sitemap ของมหาวิทยาลัย รุ่น 1

2 ก.ค.53 ใช้เวลา 2 วัน เริ่มจากวางโครงของ sitemap โดยใช้ template ที่เป็นคำแนะนำของคุณธรณินทร์ สุรินทร์ปันยศ แล้ววาง tag html จากที่ศึกษาในเว็บไซต์เดิม และจัดให้มีการแสดงผลตามความต้องการของผู้กำหนด  แล้วนำไปใช้ต่อโดยใช้ php script ดูดเว็บเพจไปแสดงผลเพียงบางส่วน ขั้นตอนที่ 3 คืออ่าน html มาแปลงเป็น xml ตามมาตรฐานของ sitemap 0.9 ที่ต้องใช้กับ google.com ขั้นตอนที่ 4 คือส่งแฟ้ม xml เข้าระบบของ google analytics หรือ webmaster tools ทำให้ google.com ยอมรับเว็บเพจทั้งหมดของเว็บไซต์เรา (คุณเคี้ยงนำรายงาน google มาเสนอ และอ.บอย เป็นผู้คุมนโยบายของเว็บไซต์ creative) โดยมีเงื่อนไขตามที่เรากำหนดเข้าไปใน sitemap ซึ่งผมกำหนดเป็น monthly ในการปรับปรุงแต่ละเว็บเพจของเว็บไซต์ .. ได้คุณอนุชิต ยอดใจยา คอยให้กำลังใจอยู่ใกล้ชิด และถามว่าผมทำอะไร .. ชื่นใจที่ยังมีคนสนใจห่วยใยครับ .. รูปสึกเป็นครั้งแรกในรอบหลายปีที่ถูกถาม เพราะปกติผมมักจะเป็นฝ่ายถาม .. แต่ผมถามตัวเองทุกชั่วโมงอยู่แล้ว
+ http://www.yonok.ac.th/intranet
+ http://www.yonok.ac.th/sitemap
+ http://www.yonok.ac.th/sitemap/sitemap.xml
+ http://www.google.com/webmasters/tools/


แก้ code ของ dm-albums plug-in ใน wordpress

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Friday, July 2nd, 2010

ภาพจาก YONOK movie

 

2 ก.ค.53 ในระบบของ wordpress ซึ่งมี gallery ที่เพื่อนนำมาติดตั้ง แต่ใช้งานไปสักพักพบว่า ผู้ใช้ไม่สามารถนำภาพไปใช้ได้ จึงได้ศึกษาและนำ code มาเพิ่มลิงค์ให้ผู้ใช้สามารถ download ภาพถ่ายจาก dm-albums plug-in ใน wordpress ซึ่งเป็นระบบ Photo Gallery ที่ขับเคลื่อนด้วย Flash ซึ่งตัวต้นฉบับไม่มีลิงค์ให้เปิดภาพไปใช้ หรือ Save As จึงเปิด Script ชื่อ album.php มาแก้ไขบรรทัดที่ประมาณ 693

แก้บรรทัดเดิมจาก document.getElementById …… ถึง anchor_close;
เป็นของใหม่ โดยเพิ่ม + “<hr><a target=_blank href=’php/image.php?image=” + image + “&width=” + width + “‘>open</a>”; ต่อจาก anchor_close;
มีผลให้การแสดงภาพมี link ให้คลิ๊กแล้วเปิดภาพแบบขยาย
+ http://yoso.yonok.ac.th/category/featured
+ http://www.thaicai.com/album
+ http://studio-c-bellevue.com/floor-plans/
+ http://www.thaiall.com/wordpress


เข้ารหัสภาษา php ป้องกันลูกค้าแก้ไขด้วย zend

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Wednesday, June 30th, 2010

zend on phpinfo

30 มิ.ย.53 กรณีที่โปรแกรมเมอร์ (Programmer) ต้องการพัฒนาเว็บไซต์ด้วยภาษา PHP และไม่ต้องการให้โปรแกรมเมอร์คนอื่น หรือลูกค้าที่ตนเองรับเงินมานำ Script ไปแก้ไขในภายหลัง จึงใช้โปรแกรม Zend Guard สำหรับเข้ารหัส (Encode) และใช้ Zend Optimizer สำหรับประมวลผล (Decode) เช่น นาย A เป็นโปรแกรมเมอร์รับเงินจากนาย B มาพัฒนาระบบด้วยภาษา PHP แต่ใช้โปรแกรมเข้ารหัสภาษา PHP ซึ่งตัว หนึ่งที่นิยมใช้กันมากคือ Zend Guard และจะประมวลผลได้กับเครื่องที่ติดตั้ง Zend Optimizer
     ตัวอย่าง Script ที่พัฒนาคือ <?=5;?> เมื่อใช้ Zend Guard จะได้แฟ้มใหม่ที่ใช้ editor เปิดอ่านแล้วไม่เข้าใจ และมีขนาด 2267 Bytes แต่ถ้าเปิดผ่าน web server ที่ติดตั้ง Zend Optimizer ก็พบกับเลข 5 ตามปกติ แต่จากการทดสอบใช้ Zend Guard 5.0.0 รุ่นทดลอง และใช้ Zend Optimizer 3.3.0 หลังจาก 14 วันผ่านไปจะพบคำว่า Fatal error: This file has expired. in C:\thaiabc\apache2\htdocs\zend_encode.php on line 0
     ในกรณีที่ใช้ Zend Guard 5.0.0 และใช้ Zend Optimizer รุ่นต่ำกว่า ก็พบว่ามีปัญหา หากจะใช้งานได้ต้อง Upgrade ตัวที่ใช้ Decode จากการทดสอบ Optimizer รุ่น 3.2.6 ไม่รองรับรุ่น 5.0.0 ซึ่ง Optimizer นั้นสามารถ Download มาใช้งานได้ฟรี แต่ Zend Guard มีราคาประมาณ 20,000 บาทต่อปี
+ http://www.zend.com/en/products/guard/downloads
+ http://www.brothersoft.com/zend-optimizer-274181.html
+ http://www.ioncube.com/


พัฒนา sitemap ไว้ใน intranet

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Tuesday, June 29th, 2010

เผยแพร่ sitemap ในระบบอินทราเน็ต

29 มิ.ย.53 ได้หารือกับ คุณธรณินทร์ แล้วทราบว่า sitemap ที่น่าสนใจ เป็นแบบของ tu และผมมีเวลาช่วงบ่าย จึงเข้าไปปรับเว็บเพจ sitemap ใน http://www.yonok.ac.th/intranet และเก็บรูปแบบนี้ไว้แยกออกมาอีกรุ่นหนึ่ง ที่ http://www.thaiall.com/yonok/intranet_530629.htm 
.. ดู ๆ ไปก็สวยนะครับ เป็นระเบียบเรียบร้อยดี แต่เผยแพร่ไม่ได้ เพราะปัญหาเชิงนโยบาย ทำให้ต้องเก็บไว้ดูในพื้นที่จำกัด ซึ่งขัดกับแนวคิดของอินเทอร์เน็ต