webpage « แลกเปลี่ยนเรียนรู้:km tool
archive page

คำสำคัญ ‘webpage’

บริการวิชาการ การเขียนเว็บเพจเบื้องต้น ที่ มจร.

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, April 22nd, 2012
mcu lampang

mcu lampang

ผศ.บุรินทร์ รุจจนพันธุ์ และ อ.เกศริน อินเพลา คณะวิทยาศาสตร์สุขภาพและเทคโนโลยี จัดโครงการอบรม “การเขียนเว็บเพจเบื้องต้น” เพื่อบริการวิชาการแก่ชุมชน ทั้งนี้มีหน่วยงานที่มีความต้องการให้คณะจัดฝึกอบรม คือ มหาวิทยาลัยมหาจุฬาลงกรณราชวิทยาลัย วิทยาเขตแพร่ ห้องเรียนบุญวาทย์วิหาร โดยการบริการครั้งนี้ได้ใช้องค์ความรู้ในสาขาวิชาวิทยาการคอมพิวเตอร์ด้านการเขียนเว็บเพจเบื้องต้น ซึ่งเป็นสิ่งที่มหาวิทยาลัยมหาจุฬาลงกรณราชวิทยาลัยใช้เป็นเครื่องมือในการสื่อสารกับโลกภายนอกอยู่ตลอดเวลา และมหาวิทยาลัยโยนกได้ดำเนินการบริการวิชาการแก่ชุมชนในรูปแบบที่หลากหลายมาเป็นเวลากว่า ๒๓ ปี
โดยโครงการอบรม การเขียนเว็บเพจเบื้องต้น มีเนื้อหาการบรรยายเกี่ยวกับ การพัฒนาเว็บไซต์ โฮมเพจ โดเมนเนม และเว็บเพจ เป็นต้น
มีขั้นตอนการดำเนินงานทั้งหมด ๕ ขั้นตอน ดังนี้ ๑) ติดต่อและประสานงานกลุ่มเป้าหมาย ๒) กำหนดเนื้อหา และรายละเอียดของหัวข้อบรรยายที่ผู้เข้ารับอบรมควรรู้ ๓) จัดกิจกรรมบริการวิชาการในชุมชน ๔) ประเมินผลความพึงพอใจของผู้เข้าอบรม ๕) จัดทำรายงานสรุปผลโครงการ
ซึ่งโครงการนี้พบว่าบรรลุตามตัวบ่งชี้ คือ มีความพึงพอใจต่อโครงการ ๔.๒๖ จากคะแนน ๕ ระดับ ซึ่งเป็นระดับมากที่สุด ค่าความคลาดเคลื่อน ๐.๗๒ ซึ่งค่าความพึงพอใจไม่ต่ำกว่าที่ตั้งไว้ในตัวบ่งชี้ ดังนั้นโครงการนี้จึงบรรลุตามตัวบ่งชี้

http://www.facebook.com/media/set/?set=a.115963435181311.19375.115935711850750

คำสำคัญ:, , ,
บันทึกไว้ใน การทำงานและอาชีพ | ไม่มีความคิดเห็น »

ใช้ ckeditor แทน fckeditor

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Friday, July 8th, 2011
ckeditor for webpage editor

ckeditor for webpage editor

8 ก.ค.54 ต้องการใช้ text editor เป็น plug-in ของ textarea จึง download script จาก http://ckeditor.com/download
ได้รุ่น CKEditor 3.6.1, released on 16 June 2011 เมื่อคลาย zip ลงที่ root ก็ได้ห้อง /ckeditor แล้วเขียน code test.htm มีรายละเอียดว่า

<head><script type=”text/javascript” src=”ckeditor/ckeditor.js”></script></head>
<body><form action=”xxx.php” method=”post”>
<textarea cols=”80″ id=”editor1″ name=”editor1″ rows=”10″></textarea>
<script type=”text/javascript”>
//<![CDATA[
CKEDITOR.replace( 'editor1',    {fullPage : true,   extraPlugins : 'docprops'   });
//]]>
</script>
<p><input type=”submit” value=”Submit” /></p>
</form>
</body></html>

แต่ toolbar ที่ได้เป็นแบบ full option จึงกำหนดรูปแบบในแฟ้ม config.js

config.toolbar =
[
[ 'Source', '-', 'Bold', 'Italic', syntaxhighlight' ]
];

ซึ่งมีรายละเอียดศึกษาเกี่ยวกับ config ได้ที่

http://docs.cksource.com/ckeditor_api/symbols/CKEDITOR.config.html

คำสำคัญ:, , ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม, เทคโนโลยีรอบตัวเรา | ไม่มีความคิดเห็น »

fb comment แบบมีปัญหา

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, May 22nd, 2011
facebook comments

facebook comments

22 พ.ค.54 หลายเดือนก่อน ผมเคยใช้ comment ของ facebook.com ในเว็บ gallery ขององค์กร มาวันนี้พบเทคนิคคล้ายกัน แต่มีปัญหาในการเลือกแสดงผล .. ต่อไปคงต้องระวังการใช้ระบบ comment ของ facebook.com ที่จะนำไปใช้ในเว็บขององค์กรใดใด เพื่อรับข้อเสนอแนะ แล้วนำไปปรับปรุงแก้ไขตามเนื้อหานั้น
<script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script>
<fb:comments href=”http://www.facebook.com/xxxx”
num_posts=”5″ width=”792″>
</fb:comments>

จากการทดสอบ
กรณีที่ 1 ผมเข้า comment ในเว็บเพจหนึ่ง แล้วก็เห็นผลตามปกติ
กรณีที่ 2 มีเพื่อนเข้า comment ในเว็บเพจหนึ่ง ต่อจากผม ก็เห็นผลตามปกติ
กรณีที่ 3 เข้า fb ในฐานะเด็กผู้หญิง แต่ไม่เห็น comment ของเพื่อนในเว็บเพจเดิม
กรณีที่ 4 logout ออกจาก fb แล้วไม่เห็น comment ของใครเลย
สรุปว่า comment ที่มีใครก็ตามเข้าไปแสดงความเห็น จะไม่ถูกเห็น ถ้ายังไม่เป็นเพื่อนผู้แสดงความเห็น ซึ่งไม่ตรงกับวัตถุประสงค์ของระบบรับ comment โดยทั่วไป เพราะการแสดงความเห็นนั้นมีต่อเว็บเพจโดยตรง มิได้มีความสัมพันธ์ระหว่างเว็บเพจกับเพื่อน ที่ต้องใช้เป็นเงื่อนไขในการแสดง comment

แต่ปัญหานี้ ไม่พบใน fb_comments.htm แสดงว่าอยู่ที่เทคนิคการเรียกใช้ application ของ facebook.com ซึ่งสรุปว่าถ้าเรียกใช้ระบบ comment อย่างถูกต้องก็จะไม่พบปัญหาข้างต้น
http://www.thaiall.com/facebook/fb_comments.htm

คำสำคัญ:, , ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

การสร้างงานและส่งออกไปเป็นเว็บเพจด้วย fireworks CS4

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Thursday, February 17th, 2011
firework

firework

18 ก.พ.54 มีเพื่อนชื่อ ธรณ. สร้างงานไว้ด้วย Adobe Fireworks CS4 และใช้พัฒนาควบคู่ไปกับ Adobe Dreamweaver CS4 ซึ่งมีแนวทางการนำมาแก้ไขปรับปรุง ทั้งเปลี่ยนสี เปลี่ยนภาพ แต่ใช้ theme เดิม ดังนี้
1. เปิดแฟ้มต้นฉบับและทำงานออกแบบให้แล้วเสร็จ ตัวอย่างนี้เป็นภาพขนาด 2000 * 1000 pixels และจะเก็บในสกุล .png ซึ่งเป็นรูปแบบของ fire works ซึ่งขั้นตอนแรกมีรายละเอียดในการออกแบบ และใช้งานมากมายตามความซับซ้อนของเนื้องาน
2. จัดเก็บอีกครั้งด้วยการ save as เป็นแบบ Flattened PNG กำหนดขนาดเป็น 50% ผลคือแฟ้มนี้มีเพื่อนส่งออกไม่สามารถแก้ไขรายละเอียดได้ง่ายเหมือนต้นฉบับ และขนาดภาพคือ 1000 * 500 pixels เพื่อนำไปเป็นเว็บเพจ ซึ่งวางแผนไว้ว่าเว็บเพจกว้าง 1000 pixels และภาพถูกตัดออกเป็นชิ้นให้ download ได้อย่างรวดเร็ว แทนการใช้ภาพใหญ่เพียงภาพเดียว
3. ใช้ select tool สร้างพื้นที่ที่ต้องการตัด แล้วเลือก edit, insert, rectangular slice ผลการ slice จะเกิดขึ้นผลการตัดภาพใน web layer สำหรับเทคนิคตัดภาพนี้คล้ายกับที่เคยพบในโปรแกรม imageready แต่ปัจจุบันถูกรวมเข้าเป็นส่วนหนึ่งของ photoshop ตั้งแต่รุ่น CS2 ไปแล้ว หากจะตัดภาพทำ gif animation ก็ใช้ photoshop ได้เลย
4. ขั้นสุดท้ายส่งงานออกไปใช้ด้วยการเลือก file, export เป็น HTML and images ก็จะได้แฟ้ม html พร้อมภาพอีกหลายภาพ ที่จะไปใช้งานใน dreamweaver หรือควบคุมด้วย php ใน editor ใด ๆ ต่อไป
+ http://www.thaiall.com/fireworks/

คำสำคัญ:, , , , ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

การนำวีดีโอจากเทปใน SONY DCR ลงเว็บ

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Friday, December 3rd, 2010

การนำวีดีโอจากเทปใน SONY DCR-TRV33E MiniDV ลงเว็บแบบ Streaming

1. เปิดตัวเลือก USB Streaming เป็น on ในเมนูของกล้อง
2. ติดตั้ง Driver สำหรับเชื่อม USB จากกล้องเข้าเครื่อง
3. เชื่อมสายจากกล้องเข้าเครื่องคอมพิวเตอร์ แล้วสั่ง play จากกล้อง
4. เปิดโปรแกรม Windows Movie Maker แล้ว Capture from video device
5. เมื่อสั่ง Start, Capture จะถ่ายวีดีโอไปยังแฟ้ม .wmv ทีละเฟรม เทียบเท่าเวลาที่บันทึกในวีดีโอ
6. ใช้โปรแกรม Total video converter หรือ Formatfactory แปลง .wmv เป็น .flv
7. ใช้ FlowPlayer แสดงแฟ้ม .flv แบบ Streaming
+ http://www.thaiall.com/media

<html><head>
<script type="text/javascript" src="flowplayer-3.2.4.min.js"></script>
</head><body>
<a href="http://www.xxx.com/x.flv"
style="display:block;width:425px;height:300px;" id="player"></a>
<script>flowplayer("player", "flowplayer.swf");</script>
</body></html>

คำสำคัญ:, , , , ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

ระบบ Comment ของ fb สำหรับเว็บเพจภายนอก

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Monday, November 15th, 2010
fb comments

fb comments

15 พ.ย.53 มีโอกาสทดสอบระบบ Comment ของ fb ซึ่งสามารถนำมาแปะกับเว็บเพจหน้าใดก็ได้ในเว็บไซต์ของเรา .. จากการทดสอบกับหลายเว็บไซต์ และหลาย Browser ผมยังไม่มั่นใจที่จะนำมาใช้กับมหาวิทยาลัยโยนก เพราะระบบ Comment ที่มีอยู่เสถียรกว่าระบบของ FB มาก ผมทดสอบกับ IE6 จำนวน 3 เครื่อง และ IE7 พบว่า Comment ออกบ้างไม่ออกบ้าง
แม้พยายาม Refresh แล้วก็ไม่ออก .. ตอนผมใช้กับเครื่องบริการนอกมหาวิทยาลัยต้องสร้างเป็น iframe จึงจะทำงานได้ เพราะเรียกใช้ในเว็บเพจที่มี Javascript ของผมจะพบว่าขัดแย้งกัน เมื่อเปลี่ยนไปใช้ iframe ไม่มีปัญหาเรื่องความขัดแย้ง

ถ้าสนใจสามารถ view code แล้วคัดลอกได้เลยครับ
http://www.thaiall.com/facebook/fb_comments.htm

คำสำคัญ:, ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

เหตุที่ผมเลิกออกแบบเว็บไซต์ส่วนตัว แล้วแนะให้จิ้ม

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, November 14th, 2010
ออกแบบเว็บ

ออกแบบเว็บ

14 พ.ย.53 มีเจ้าของธุรกิจคนหนึ่ง อีเมลถามผมว่า เขาชอบเว็บเพจในเว็บไซต์แห่งหนึ่ง แล้วส่งมาให้ผมดู 3 หน้า ถ้าไปจ้างนักพัฒนา เขาจะต้องบอกว่าอย่างไร ซึ่งเว็บเพจทั้ง 3 หน้ามีจุดที่น่าสนใจ คือ รูปภาพ กราฟฟิก และวีดีโอ แสดงว่าเขาให้ความสนใจกับภาพ และวีดีโอในเว็บเพจ ถือเป็นประเด็นสำคัญมากกว่าองค์ประกอบอื่น เพราะทั้งโครงเว็บไซต์ และเทคนิคเชิงโปรแกรมในเว็บเพจที่เขาสนใจนั้นไม่มีความซับซ้อน .. ผมก็บอกว่าถ้าไปจ้างง่ายเลยครับ บอกผู้รับจ้างว่าขอถูก ๆ มีภาพ และแบบให้แล้ว .. แต่ปัญหาคือ content และภาพที่เขาสนใจนั้น เจ้าของธุรกิจมีในมือหรือไม่ เพราะเชื่อได้ว่าถ้าเขาไปจ้างโดยไม่มีแนวคิดหรือภาพในมือ  แล้วนักพัฒนาก็คงทำได้ในเชิงเทคนิค และโครงสร้างเว็บเท่านั้น แต่จะหาภาพที่เขาชอบในมุมของเจ้าของธุรกิจ เรียนรู้กันนาน .. แต่ถ้าเป็นโครงสร้างเว็บกับสีสวย .. ผมก็แนะว่าใช้นิ้วจิ้มครับ ได้เรื่องแน่นอน คือจิ้มไปที่แบบ free template สักแบบหนึ่งที่มีเผยแพร่นั่นเอง .. แค่นั้นคืนเดียวก็เสร็จครับ เพราะไม่ต้องนั่งลองผิดลองถูกอีก

เป็นเหตุให้ผมขุดความทรงจำเรื่อง template มาได้ ว่าเคยจัดอบรมเรื่องเทมเพจเมื่อปี 2548 และผลการอบรมครั้งนั้น ทำให้ผมรู้ว่าโลกนี้มีความสวยงามอยู่มากมายและหลากหลาย ตั้งแต่นั้นผมจึงไม่ให้เวลากับการออกแบบเว็บไซต์อย่างที่ควร เพราะวัตถุประสงค์ของเว็บไซต์ คือ การให้ข้อมูลมิใช่การออกแบบ ถ้าจะออกแบบให้สวยงาม ก็แค่ชี้นิ้วไปยังเทมเพจที่ต้องการ แล้วก็เนรมิตในเวลาชั่วข้ามคืน ซึ่งนักพัฒนาที่รับจ้าง สามารถรับงานพัฒนาเว็บเพจที่สวยที่สุดในเวลาชั่วข้ามคืนเท่านั้น ถ้ารู้จักการใช้ template แต่ถ้ามานั่งออกแบบเองก็คงไม่มีอะไรรับประกันได้ว่าจะถูกใจเจ้าของธุรกิจคนนั้นหรือไม่ .. เพราะอังกฤษ อเมริกา อินเดีย จีน พม่า ต่างก็มองผู้หญิงสวยกันไปคนละแบบ แต่วัตถุประสงค์ของการมีคู่ครองคงมิใช่ความสวยเพียงอย่างเดียว นางงามจักรวาลก็ยังเลิกกับสามีมาแล้วหลายคน เพราะความสวยอย่างเดียวไม่พอ ต้องดูเนื้อหาเป็นสำคัญครับ ว่าจะอยู่กันยืดหรือไม่ .. ดังโบราณท่านว่ารักง่าย หน่ายเร็ว .. เว็บไซต์ขององค์กรหลายแห่งเห็นสวยมาหลายรุ่น เมื่อเปลี่ยนผู้ดูแล ความสวยนั้นก็ถูกหน่ายไปในที่สุด ที่ยังต้องอยู่คือเนื้อหา และวัตถุประสงค์ที่ชัดเจนสอดรับกับแผนกลยุทธ์ขององค์กร
http://www.thaiall.com/template
http://www.freelayouts.com
http://www.templatesbox.com/templates.htm
http://www.steves-templates.com/templates.html

คำสำคัญ:, ,
บันทึกไว้ใน เทคโนโลยีรอบตัวเรา | ไม่มีความคิดเห็น »

การเขียนเว็บเพจ 3 หน้าด้วย DOS

โดย บุรินทร์ รุจจนพันธุ์ เมื่อ Sunday, August 8th, 2010

8 ส.ค.53 จัดทำวีดีโอคลิ๊ปสาธิตการเขียนเว็บเพจ 3 หน้าด้วย DOS Command มีขั้นตอนดังนี้ 1) เว็บเพจแรกชื่อ a.htm มีคำว่า ant และเชื่อมโยงไปยัง b.htm 2) เว็บเพจที่สองชื่อ b.htm มีคำว่า boy และเชื่อมโยงไปยัง c.htm 3) เว็บเพจที่สามชื่อ c.htm มีคำว่า cat และเชื่อมโยงกลับมายัง a.htm 4) เปิดเว็บเพจ a.htm ด้วย explorer ซึ่งบทเรียนนี้ไปเกี่ยวข้องกับการใช้คำสั่งดอส การเขียนแบทไฟล์ การเขียนเว็บเพจ และความรู้เบื้องต้นเกี่ยวกับคอมพิวเตอร์
+ http://www.youtube.com/watch?v=LXRUblip8P4
+ http://www.thaiall.com/assembly/internalcmd.htm

คำสำคัญ:, ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

การปรับปรุงเว็บเพจแบบ static จำนวน 100 เว็บเพจ

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

filezilla

24 มิ.ย.53 มีโอกาสต้องแก้ไขแฟ้มจำนวน 100 เว็บเพจที่เป็นแบบ static และอยู่ใน folder แตกต่างกัน จึงใช้วิธีเปิดแฟ้มผ่านโปรแกรมแบบ batch เพื่อเปิดแฟ้มทั้งหมดพร้อมกัน ด้วยการสั่งให้ editplus เปิดแฟ้มทั้งหมด แล้วจัดการทุกแฟ้มพร้อมกันได้ง่าย (ต้อง regist โปรแกรมก่อนนะครับ ไม่งั้นเปิดทีเดียว 100 แฟ้มไม่ได้) สิ่งที่ต้องการจัดการคือ sponsor frame ผลการทดสอบใช้ editplus พบว่า editplus สามารถรองรับแฟ้มจำนวน 100 แฟ้มได้ เมื่อแก้ไขจนแล้วเสร็จ ก็ใช้ filezilla สั่ง upload folder ทั้งหมด พบว่า สามารถส่งแฟ้มที่ใหม่กว่าเข้าไปทับแฟ้มเก่าได้อัตโนมัติ ผมเพียงแต่เลือก folder ทั้งหมด แล้ว upload ด้วยโปรแกรม filezilla ซึ่งทำหน้าที่เลือกเฉพาะแฟ้มที่ใหม่กว่าในแต่ละ folder ไปทับแฟ้มเก่ากว่าใน folder ของเครื่องที่ทำการ remote เข้าไป .. มีผลถูกต้อง
เช่น “C:\Program Files\EditPlus 2\editplus.exe” d:/thaiall.com/thai/kingsong.htm

คำสำคัญ:, , , ,
บันทึกไว้ใน พัฒนาเว็บไซต์และโปรแกรม | ไม่มีความคิดเห็น »

สร้าง fan box ของ facebook ไปใส่ในเว็บเพจ

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

fan box ของ facebook

9 มี.ค.53 การสร้าง fan box แล้วเปิดให้เพื่อนที่เป็นสมาชิกของ facebook สมัครเข้าเป็น fan ใน box ของเรา มีขั้นตอนดังนี้ 1) เข้า facebook widgets หรือ Create a Profile Badge อยู่ล่างสุดท้างซ้ายของ profile 2) เข้า Page Badges แล้วคลิ๊ก created a Page จนแล้วเสร็จ 3) เข้า Widgets Home ตามด้วย Fan Box แล้วเลือก Other ก็จะมี javascript ให้ 4) นำ javascript ไปวางในเว็บเพจ ของผมไปวางไว้ใน thaiall.com/members ก็สำเร็จตามที่เคยเห็น yoso ใช้งานนั่นเอง 5) ผมเป็น creator ยังต้องเปลี่ยนตัวเองเป็น fan จะได้เข้าไปอยู่ใน fan Box ถ้าเข้าดู box ก็เข้าผ่าน profile และ boxes ในเมนูบาร์ด้านบน
+ http://www.thaiall.com/members/

คำสำคัญ:, , , , ,
บันทึกไว้ใน เทคโนโลยีรอบตัวเรา | ไม่มีความคิดเห็น »