งาน blog ที่ 9 ใส่ counter

หากต้องการทราบว่ามีคนเข้ามาอ่าน blog ของเราแล้วกี่คน หรือ กี่ครั้ง เราสามารถทำได้โดยใส่ ตัวนับ (counter)

 

ตัวอย่าง counter ที่ใช้กับหน้า website ของคณะฯ แสดงจำนวนผู้เข้าชม

เริ่มงาน

1. log in เข้า blog ของนักศึกษา

2. เปิดอีกหน้าต่าง ไปที web www.histats.com

3.พิมพ์ค่า URL ของ blog ของนักศึกษาลงในช่องที่กำหนด เพื่อขอ code คำสั่งทำ counter

ตัวอย่าง หากเป็น blog ของผม ก็จะใส่ค่าเป็น http://ac219payap.blogspot.com/

4. เปลี่ยนภาษา (Language) ซึ่งค่าตอนนี้เป็น Italian เปลี่ยนเป็น English (ไม่ต้องหาภาษาไทย มันไม่มีนะ)

5. click ปุ่ม register (เพื่อลงทะเบียน)

6. รอจนจอภาพเปลี่ยนเป็น

 7. กรอกค่าตามที่เขาต้องการเริ่มจาก

กลุ่ม 1 ในภาพ

mail                    ก็ใส่ g-mail ของนักศึกษาลงไป

mail confirm      เขาต้องการยืนยันค่า mail ก็พิมพ์       g-mail  เดิมอีกรอบ

password ก็ใส่รหัสผ่านของ g-mail นั่น

password confirm ก็พิมพ์ยืนยันรหัสเดิม

กลุ่ม 2 ในภาพ

site url มีค่าที่ได้ใส่ไปแล้วปรากฎ

title เป็นชื่อที่ใช้เรียกตัวนับนี้ ให้ตั้งชื่อเอง

description เป็นคำอธิบายที่ใช้กับตัวนับนี้ ให้เขียนคำอธิบายเอง

อีก 2 ค่าที่เป็น 0 ไม่ต้องทำอะไร

กลุ่ม 3 ในภาพ

เป็นการเลือกเวลาประเทศ (ค่าที่ให้มาถูกแล้ว)

กลุ่ม 4 ในภาพ

เป็นการเลือกว่า blog นี้อยู่ใน zone เวลาของประเทศอะไร

ค่าที่ให้มาก็ถูกแล้ว

ช่องต่อไปคือ

type                เลือกเป็น  blog

category        บอกชนิดของเนื้อหา เลือกเป็น personal homepage

language      ภาษา  ก็คงเป็น  english

แล้ว click     continue

8.   รอ

9.  จอภาพเปลี่ยนเป็น

10. สังเกตว่ามีข้อความเขียนในกรอกสี เช่น

      Animated counters

     Counters 1 lines

     Counter 2 lines

     Counter 3 lines   พร้อมภาพประกอบ

เป็นต้น

เป็นการเลือกการแสดงตัวนับ ว่าจะเป็นแบบใด เช่นแบบ

1 บรรทัด,  2 บรรทัด ,   3 บรรทัดเป็นต้น

ของผมจะเลือกแบบ 2 บรรทัด

ก็ click เลือกเลยที่ counter 2 lines

11. รอ

12. เมื่อจอภาพเปลี่ยนไป เป็น รูปตัวอย่างตัวนับแบบต่าง ๆ ให้เลือกมากมาย

13. ให้ click เลือกแบบที่ต้องการโดย click ในวงกลมสีที่ด้านล่างของตัวอย่าง

14. scroll ลงไปจนถึงด้านล่างสุด เพื่อ click คำว่า continue

15.หน้าเปลี่ยนไปเป็นขั้นตอนที่ 4 หน้านี้ไม่ต้องเปลี่ยนค่าอะไร  ให้ click   continue   เลย

16.จอภาพเปลี่ยนเป็น ขั้นตอนที่ 5

17. ก็จะเห็น code คำสั่งที่เขียนในภาษา html ก็ทำการ copy ซะ

18. กลับไปหน้า blog (อย่าเพิ่งปิดหน้าของ histats.com )

19.. มุมบนขวา มีคำสั่ง บทความใหม่ ปรับแต่ง ออกจากระบบ

       เลือก ปรับแต่ง

20. เลือกต่อที่คำสั่ง "เพิ่ม Gadget" (แสดงในภาพด้านล่าง)

21. เลือกต่อที่  HTML/จาราสคริปต์
22. จอภาพเป็น

ให้พิมพ์ ค่าใน หัวข้อ เช่น ตัวนับ (ตั้งชื่อเอง)
แล้ว click ลงในช่องใหญ่ถัดไป แล้ว วางคำสั่ง html ที่ copy มาลงไป
23. เลือกคำสั่ง   บันทึก
24. จะพาท่านกลับออกไปพบจอภาพเดิมก่อนหน้านี้
25. ให้เลือก     บันทึก         
26. ให้เลือก      ดูบล็อก

เสร็จ

ความท้าทาย

การทำ counter หรือตัวนับ จะเป็นการนำคำสั่ง html มาใส่ลงใน blog ของเรา ท่านสามารถหา website ที่มีคำสั่งในลักษณะเดียวกันมาใช้ โดยเริ่มจาก
- ค้นหาคำว่า  free counter ที่ google
- ไปยัง website ที่มีบริการให้ free counter
- ทำตามขั้นตอนที่กำหนด จนไปถึง การ copy ค่า html
- copy ค่า html ที่ได้กลับมาใส่ใน blog ของนักศึกษาเอง

ใครใช้ counter จาก web อื่นที่ไม่ใช่ web ที่กำหนดในตัวอย่างนี้ ก็ถือว่า ท่านพัฒนา ความสามารถขึ้นไปอีกหนึ่งระดับครับ
นั่นคือ "ความท้าทาย"   (ไม่จำเป็นต้องใช้ website เดียวกับที่มีในตัวอย่างก็ได้นะครับ)