ทำ Welcome Message ตอนบู๊ตเครื่องแบบง่ายๆ

ผมเชื่อว่า พี่ๆ น้องๆ หลายๆ คนคงอยากมีข้อความต้อนรับแบบเก๋ๆ ไม่เหมือนใครเช่น พอเราเปิดเครื่องปุ๊บ ก็เจอ messagebox แสดงข้อความว่า สวัสดีคุณ สยาม
สำหรับ Tips นี้เป็น VB Script ง่ายๆ ไม่ต้องไปยุ่งกับ Register ใดๆของระบบเลย ลองดูนะครับ อาจจะเป็นก้าวแรกของน้องๆ ที่ฝันอยากเป็นโปรแกรมเมอร์ก็ได้ ใครจะรู้

สิ่งที่ต้องมี
1. มันสมอง กับ 2 มือ(มีกันทุกคนอยู่แล้ว)

ขั้นตอนการทำ
1. เปิด NotePad แล้วพิมพ์โค๊ดข้างล่างนี้ลงไป


Rem Welcome Message by Duke

Dim tmpString

tmpString = "Hello Duke" & vbCrlf & "Welcome to my system."

MsgBox tmpString ,vbInformation, "System Info."


2. ทำการบันทึกให้เป็นไฟล์ VBScript โดย คลิกที่ Menu File ของ NotePad เลือกคำสั่ง save as แล้วพิมพ์ชื่อไฟล์ว่า "WellcomeMSG.vbs" บันทึกไว้ที่ ไหนก็ได้แต่ขอให้จำ path ให้ได้ก็พอ
- ต้องใส่เครื่องหมาย " คล่อมหัว ท้าย ด้วยนะครับ ไม่อย่างนั้นเราจะได้ไฟล์ชื่อ WellcomeMSG.vbs.txt แทน
- ตรงชื่อไฟล์เราสามารถตั้งชื่ออื่นก็ได้นะครับ ขอให้เป็นนามสกุล .vbs ก็พอ

3. ทดสอบการทำงานโดย ดับเบิลคลิกที่ไฟล์ของเราเมื่อกี้ ถ้าไม่มีอะไรผิดพลาด เราจะเห็น Message Box แสดงข้อความของเรา

4.คลิกขวาที่ไฟล์ของเราเลือกคำสั่ง Send To > Desktop (Create Shortcut)
5.ไปที่หน้าจอ DeskTop
6.ลาก Shortcut ของไฟล์ที่เราสร้างไปวางที่ Start menu > all Programes > Start Up
- สำหรับคนที่ใช้ Start menu แบบ Classic ให้ไปวางที่ Start menu > Program files > Start Up
(วิธีการวางคือ ลาง ไอคอนไปชี้ที่บริเวณ start menu ตัวเมนูก็จะเด้งขึ้นมา แล้วเราก็ลางต่อไปที่คำสั่ง All Programs แล้วก็ไปที่ Start Up)

เสร็จสิ้นขั้นตอน เพียงเท่านี้ ทุกครั้งที่เราบู๊ตเครื่อง เราก็จะเห็น Message Box ต้อนรับในแบบที่เราต้องการ (หรือจะทำไปอำใครก็คิดดูดีๆนะครับ)
วิธีการเอาออกก็ง่ายๆ เพียงแต่ไปลบ Shortcut ไฟล์ของเราใน Start Up เท่านั้นเอง

อธิบายโค๊ด
1. บรรทัดแรก คำสั่ง Rem คือ การประกาศว่า บรรทัดนี้ ไม่ต้องทำการประมวลผล หรือ ภาษาโปรแกรมเมอร์เรียก Comment นั่นเอง
2. ประกาศตัวแปรเพื่อเก็บคำที่ต้องการแสดงใร Message Box ให้ชื่อว่า tmpString
3. กำหนดค่าให้ตัวแปร (ตรงนี้ อยากให้แสดงข้อความว่าอะไรก็ใส่ได้เลยนะครับ)
- ในกรณีที่ต้องการให้ขึ้นบรรทัดใหม่ ให้เราใส่คำสั่ง & vbCrlf ต่อท้ายข้อความที่เราต้องการ ตามด้วยเครื่องหมาย & แล้วก็ข้อความที่เราต้องการต่อ
4. คำสั่งแสดง MessageBox โดยกำหนดพารามิเตอร์ให้มัน 3 ตัวคือ
- tmpString คือ ข้อความที่เราต้องการแสดง
- รูปแบบ Icon ของ Message Box ในที่นี้ให้แสดงเครื่องหมาย i (Inforamation)
- ข้อความที่เราต้องการให้แสดงที่ Title Bar ของตัว Message Box

เหมือนเดิมครับ: ถ้าใครมีอะไรแนะนำก็ยินดีเสมอนะครับ หรืออยากได้ Tips ที่เกี่ยวกับอะไรก็แนะนำมาได้เลยครับ ถ้าผมรู้ ก็จะเสนอเลย ถ้าไม่รู้ ก็จะไปหาวิธี หรือ แนวทางให้นะคร้าาาาบบบบ....

[Tip by: deMODZA]


[Submit to Zickr!]

เปลี่ยน Handy Drive Icon แบบเก๋ๆ

เชื่อว่าพี่ๆ น้องๆ เกือบทุกคนต้องมี Handy Drive (หลายๆคนเรียก Flash Drive, Thump Drive แต่ที่ผมถูกใจที่สุด ก็รุ่นพี่ของผมคนนึงแหละ พี่แกเรียก "ตั้ม" ไดรฟ์)

คราวนี้ ตัว Handy Drive ก็เป็นอุปกรณ์ตัวนึงที่สามารถในการทำ Auto Run ได้ เราก็ใช้ความสามารถตัวนี้แหละ มาทำการเปลี่ยน Icon ให้กับมัน โดยสิ่งที่เราต้องมี คือ
1. Script AutoRun
2. ไฟล์ Icon (.ico) เท่ห์ๆ แบบที่เราต้องการ

ขั้นตอนการทำ
1. เปิด NotePad ขึ้นมา
2. พิมพ์โค๊ดคำสั่งข้างล่างลงไป 2 บรรทัด

[AutoRun]
ICON=myIcon.ico

*โดยแทนที่ myIcon.ico ด้วยชื่อไฟล์ Icon ของเรา อย่าลืม .ico ด้วยนา*

3. เซฟไฟล์ โดยตั้งชื่อไฟล์ว่า AutoRun.inf (วิธีการตั้งชื่อไฟล์ตามที่เราต้องการ ก็ให้ใส่ (" ") คล่อมหัวท้ายไว้ เช่น
"AutoRun.inf" )
4. ก๊อปปี้ ไฟล์ทั้ง 2 ตัวไปไว้ใน Handy Drive ของเรา (ไม่ต้องไปใส่ใน Folder ไหนเลยนะครับ)
5. ถอด Handy Drive ออก แล้วเสียบเข้าไปใหม่ เป็นอันเสร็จขั้นตอนการทำ

คราวนี้เราก็จะมี Icon Handy Drive แบบเก๋ๆ ไว้ใช้บอกความเป็นตัวเองซะที
ปล. วิธีการนี้ ยังใช้ได้กับ Drive อื่นๆในเครื่องได้เหมือนกันนะครับ เพียงแต่ บางครั้งเราต้อง Restart เพื่อที่จะได้เห็นผลของมัน...

[Tip by: deMODZA]


[Submit to Zickr!]

สร้าง Link แบบ Roll Over Image โดยใช้ CSS

เมื่อวันก่อน ผมต้องทำการแก้ไข Link ให้เว็ปเพจนึง โดยที่นี่ เค้าใช้ RollOver แบบ JavaScript โดยที่สร้างจาก DreamWeaver ข้อดีคือง่าย เร็ว สะดวก(คนทำ แต่ลำบากคนแก้) แล้วที่สำคัญมีเกือบ 20 หน้า แล้วพี่แกไม่ได้ Include ผลก็เลยผมต้องมานั่งแก้ทีละหน้า เล่นเอาตาลายเลย (โค๊ดยาวมากกก)

เมื่อเกิดเหตุการณ์อย่างนี้ขึ้น โดยนิสัยโปแกรมเมอร์(ขี้เกียจ)อย่างผม ก็เลยแนะนำพวกพี่ๆเค้าให้ใช้ RollOver Image Link แบบ CSS แทน

สิ่งที่ต้องมี
1.รูปภาพที่ต้องการมาทำ RollOver 2 รูป คือ รูปสถานะปกติ กับ รูป สถานะ Mouse Over (อันนี้แล้วแต่ Idea ใคร Idea มันนะคับ)
2.โค๊ด CSS

ตัวอย่างโค๊ด
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-874" />
<title>.. Roll Over Button sample....by deMODZA. </title>

<style type="text/css">
<!--
.link a { /* <-- Class สำหรับ Link สถานะปกติ */
background: #D9E1E5 url(imgActive.gif); /* ภาพพื้นหลัง */
font: bold 12px tahoma; /* กำหนด Font */
color: #FFFFFF; /* สี Font */
height: 25px; /* ความสูงของ Link */
display: block; /* กำหนดให้มีการแสดงผลเป็น Block ตามความกว้่าง * ยาว ที่เรากำหนด */
line-height: 22px; /* ตำแหน่งตัวอักษร ค่าต้องไม่เกินความสูงของ Link ค่ายิ่งมาก ตัวอักษรยิ่งใกล้เส้นขอบด้านล่าง */
text-decoration: none; /* กำหนดให้ Link ไม่มีเส้นใต้ */
}

.link_2 a:hover {/* <-- Class สำหรับ Link สถานะเม้าท์ชี้ */
background: #D9E1E5 url(imgActive.gif);
font:12 tahoma;
color:#000000;
display: block;
text-decoration: none;
}

/* -- กรณีมีการแสดงผลหลายรูปแบบ เราก็กำหนดชื่อ class ต่างกัน property ตามที่เราต้องการ ในที่นี้ กำหนดสลับสีกับตัวอย่างแรก --*/

.link_2 a {
background: #D9E1E5 url(imgInActive.gif);
font: bold 12px tahoma;
color: #FFFFFF;
height: 25px;
display: block;
line-height: 22px;
text-decoration: none;
}
.link a:hover {
background: #D9E1E5 url(imgInActive.gif);
font:12 tahoma;
color:#000000;
display: block;
text-decoration: none;
}

.link3 a{
font-family: tahoma;
font-size: 12px;
font-weight: bold;
color: #333333;
text-decoration: none;
background-image: url(imgActive.gif);
display: block;
height: 25px;
line-height: 25px;
}
.link3 a:hover{
font-family: tahoma;
font-size: 12px;
font-weight: bold;
color: #333333;
text-decoration: none;
background-image: url(imgInActive.gif);
display: block;
height: 25px;
line-height: 25px;
}
-->
</style>
</head>
<body>
<table width="150">
<tr>
<td align="center" >CSS Class <STRONG>link </STRONG> </td>
</tr> <tr>
<td align="center" class="link"> <a href=# >LINK 1 </a> </td>
</tr> <tr>
<td align="center" class="link"> <a href=# >LINK 2 </a> </td>
</tr> <tr>
<td align="center" >CSS Class <STRONG>link_2 </STRONG> </td>
</tr> <tr>
<td align="center" class="link_2"> <a href=# >LINK 3 </a> </td>
</tr> <tr>
<td align="center" class="link_2"> <a href=# >LINK 4 </a> </td>
</tr> <tr>
<td align="center" class="link3"> <a href=# >LINK 5 </a> </td>
</tr>
</table>
</body>
</html>

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

Tip by deMODZA

[Submit to Zickr!]