ดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

วิธีการสร้าง Feature Box

วิธีการสร้าง Feature Box
Feature Box

 

     Feature Box จะเป็นการสร้างกล่องข้อความ ที่ใช้ในการแนะนำฟีเจอร์ของโปรแกรมหรือระบบต่างๆ โดยที่ภายในกล่องข้อความนั้นจะประกอบไปด้วย Icon หรือรูปภาพประกอบฟีเจอร์ ซึ่งรูปภาพที่ใช้นั้นควรจะสื่อถึงฟีเจอร์แต่ละตัวด้วย เช่น ระบบของเรามีฟีเจอร์ในการแจ้งเตือนข้อมูลไปยังอีเมล์ ดังนั้น Icon ที่เราจะเลือกใช้ก็อาจจะเป็น Icon อีเมล์ นั่นเองค่ะ ทั้งนี้ก็เพื่อให้ผู้อ่านสามารถเข้าใจและมองเห็นภาพได้ง่ายมากขึ้น และในส่วนด้านล่างของ Icon นั้นจะเป็นข้อความสำหรับอธิบายการใช้งานหรือความสามารถของฟีเจอร์แต่ละตัว สำหรับในบทความนี้เราจะมาแนะนำวิธีการสร้าง Feature Box ไปดูกันเลยค่ะว่ามีวิธีการอย่างไรบ้าง 

 

วิธีการสร้าง Feature Box

1. ในขั้นตอนแรกให้ทำการดาวน์โหลด Icon ที่ต้องการใช้งานมาก่อน โดยเลือกใช้ Icon ที่เหมาะสมและเกี่ยวข้องกับฟีเจอร์ของระบบ

 

2. ตัวอย่าง code สำหรับใส่ Icon

เมื่อทำการดาวน์โหลด Icon มาแล้ว ให้นำ code ด้านล่างไปใส่ โดยเปลี่ยน path รูป และปรับขนาดของ Icon ได้ตามที่ต้องการ

<class="step1naja" style="overflow: unset;">
class="span4" style="margin-left: 0px;">
class="step2naja" style="background-color: white; padding-left: 5px; padding-right: 5px; border: 1px solid #ccc; border-radius: 6px; margin-bottom: 10px; margin-top: 2px;">
class="step3naja" style="padding-right: 10px; padding-left: 10px; margin-top: 10px;">
class="step4naja">

 

3. ตัวอย่าง code การใส่หัวข้อของฟีเจอร์แต่ละตัว

class="step5naja" style="border-top: 1px solid; margin-top: 5px; margin-bottom: 5px; text-align: center;">กำหนดหมวดหมู่สินค้าที่ต้องการแสดง

 

4. ตัวอย่าง code การใส่ข้อความอธิบายฟีเจอร์ (ความสามารถของฟีเจอร์)

class="step5naja" style="margin-top: 5px; margin-bottom: 5px; text-align: center;">

สามารถกำหนดหมวดหมู่สินค้าที่ต้องการให้แสดงได้ โดยสามารถเลือกกลุ่มสินค้าที่ต้องการได้ เช่น สินค้าลดราคา, สินค้าที่ขายล่าสุด

 

5. ตัวอย่างผลลัพธ์

กำหนดหมวดหมู่สินค้าที่ต้องการแสดง

สามารถกำหนดหมวดหมู่สินค้าที่ต้องการให้แสดงได้ โดยสามารถเลือกกลุ่มสินค้าที่ต้องการได้ เช่น สินค้าลดราคา, สินค้าที่ขายล่าสุด

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
สรุปการประชุมลูกค้าครั้งแรก
โดย natthanit.r2538 จ 01 มิ.ย. 2020 6:46 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
2
จ 01 มิ.ย. 2020 6:46 pm โดย natthanit.r2538
สวนครัวริมระเบียง
โดย natthanit.r2538 จ 01 มิ.ย. 2020 4:42 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
6
จ 01 มิ.ย. 2020 4:42 pm โดย natthanit.r2538
วิธีการเดินทางจาก สงขลา มา กรุงเทพฯ
โดย natthanit.r2538 จ 01 มิ.ย. 2020 1:47 pm บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
11
จ 01 มิ.ย. 2020 1:47 pm โดย natthanit.r2538
งานประจำวันที่ 1 มิถุนายน 2563
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:53 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
1
27
จ 01 มิ.ย. 2020 11:05 am โดย natthanit.r2538
note
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:52 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
5
จ 01 มิ.ย. 2020 10:52 am โดย natthanit.r2538
Work's on Hand ณัฐนิตย์ ร่มบ้านโหล๊ะ M103
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:49 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
0
4
จ 01 มิ.ย. 2020 10:49 am โดย natthanit.r2538
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย natthanit.r2538 จ 01 มิ.ย. 2020 10:48 am บอร์ด M103 - ณัฐนิตย์ ร่มบ้านโหล๊ะ
2
18
จ 01 มิ.ย. 2020 11:08 am โดย natthanit.r2538
B - เข้าเมนูหน้ารวมรายการใน admin ไม่ได้
โดย thatsawan ศ 29 พฤษภาคม 2020 5:58 pm บอร์ด Odoojob.com - Tester
0
1
ศ 29 พฤษภาคม 2020 5:58 pm โดย thatsawan
B - ยังขาดหน้าผลการค้นหา จาก search.php
โดย mindphp ศ 29 พฤษภาคม 2020 6:11 am บอร์ด FDD (Main)
0
1
ศ 29 พฤษภาคม 2020 6:11 am โดย mindphp
B - กล่องค้นหาจากหน้า index ใช้งานไม่ได้ กดแล้วไม่ไปหน้าค้นหา
โดย mindphp ศ 29 พฤษภาคม 2020 5:39 am บอร์ด FDD (Main)
1
1
ศ 29 พฤษภาคม 2020 5:53 am โดย mindphp
B - ไม่ใช่แค่โชว์ icon facebook มันต้องทำลิงค์เพื่อให้คลิกไป
โดย mindphp ศ 29 พฤษภาคม 2020 4:39 am บอร์ด FDD (Main)
1
2
ศ 29 พฤษภาคม 2020 4:51 am โดย mindphp
อัพเดท phpbb 3.3 เเล้ว extenstion ใช้งานไม่ได้
โดย thatsawan พฤ 28 พฤษภาคม 2020 10:08 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
1
94
พฤ 28 พฤษภาคม 2020 10:10 pm โดย thatsawan
วิธีการสร้าง css ที่ใช้งานเฉพาะในบราวเซอร์ safari เท่านั้น
โดย Ittichai_chupol พฤ 28 พฤษภาคม 2020 6:06 pm บอร์ด CSS Knowledge
0
91
พฤ 28 พฤษภาคม 2020 6:06 pm โดย Ittichai_chupol
R - Set Demo เป็น subdomain ของ ตัวนี้
โดย mindphp พฤ 28 พฤษภาคม 2020 6:17 am บอร์ด มารียา ซีฟู้ดส์ - Developer
0
9
พฤ 28 พฤษภาคม 2020 6:17 am โดย mindphp
อยากทราบวิธีการกำหนด ค่า css ให้กับ button โดยกำหนดเฉพาะแต่ละบราวเซอร์
โดย Ittichai_chupol พ 27 พฤษภาคม 2020 8:39 pm บอร์ด HTML CSS
1
30
พ 27 พฤษภาคม 2020 9:15 pm โดย mindphp
อัพเดท Changelog flask framework ของภาษา Python
โดย jirawoot พ 27 พฤษภาคม 2020 12:19 pm บอร์ด Python Knowledge
0
101
พ 27 พฤษภาคม 2020 12:19 pm โดย jirawoot
งานประจำวันที่ 27 พฤษภาคม 2563
โดย yositacha26 พ 27 พฤษภาคม 2020 12:13 pm บอร์ด MP011 - โยษิตา จันทะวงษ์
1
25
พ 27 พฤษภาคม 2020 12:15 pm โดย yositacha26
อยากทราบว่า วิธีการกำหนดการตั้งค่า ภาษาไทย ใน Netbeans
โดย Ittichai_chupol พ 27 พฤษภาคม 2020 10:13 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
96
พ 27 พฤษภาคม 2020 10:13 am โดย Ittichai_chupol
B - บริษัท approve ประวัติที่ส่งมาสมัครเเล้ว เเต่ยังแสดงสถานะเดิมอยู่
โดย thatsawan อ 26 พฤษภาคม 2020 6:27 pm บอร์ด Odoojob.com - Tester
0
4
อ 26 พฤษภาคม 2020 6:27 pm โดย thatsawan
อยากทราบวิธีการแก้ไข ภาษาไทยกลายอักษรแปลกๆ
โดย Ittichai_chupol จ 25 พฤษภาคม 2020 4:35 pm บอร์ด Programming - PHP
2
125
จ 01 มิ.ย. 2020 6:33 am โดย mindphp