ให้เรตสมาชิก: 5 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งาน
 

             ในหน้าเว็บไซต์ต่างๆมักจะมีช่องค้นหา หรือ ช่อง Search เพื่อให้ผู้ที่เข้าชมเว็บไซต์ง่ายต่อการค้นหาสิ่งที่ต้องการ ซึ่งในการนำ Joomshopping Thai Edition มาใช้ในการทำเว็บไซต์ขายของออนไลน์ จะมีโมดูลหรือส่วนเสริม Jshopping Module Search ที่ใช้สำหรับทำช่อง Search บทความนี้จึงเป็นการแนะนำการปรับโมดูล Jshopping Module Search ใน Bootstrap 3 มีขั้นตอนดังนี้

 

1.เข้าไปดาวน์โหลด Module Search ที่ https://www.webdesigner-profi.de/joomla-webdesign/shop/modules/module-search.html?lang=en

ดาวน์โหลด Module Search
ดาวน์โหลด Module Search

 

2.เข้า localhost ในส่วนของผู้ดูแลระบบ คลิกเมนู Extensions เลือก Manage เลือก Install

คลิกเมนู Extensions เลือก Manage เลือก Install
คลิกเมนู Extensions เลือก Manage เลือก Install

 

3. Upload ไฟล์ Zip Module Search ที่ดาวน์โหลดมา 

Upload ไฟล์ Zip Module Search ที่ดาวน์โหลดมา
Upload ไฟล์ Zip Module Search ที่ดาวน์โหลดมา

 

4.ในโปรแกรม Netbeans เปิดไฟล์ index.php แทรกโค้ดด้านล่างนี้ ไว้ในส่วนที่ต้องการแสดงช่องค้นหา

<jdoc:include type="modules" name="search" style="xhtml" /> 

 

5.ในส่วนของผู้ดูแลระบบ คลิกเมนู Extensions เลือก Modules

คลิกเมนู Extensions เลือก Modules
คลิกเมนู Extensions เลือก Modules

 

6.คลิกที่ Jshopping Search

คลิกที่ Jshopping Search
คลิกที่ Jshopping Search

 

7.Show Title คลิกปุ่ม Hide เพื่อซ่อนชื่อของโมดูลในหน้าเว็บ , Position คลิกเลือก search เป็นการเลือกตำแหน่งที่จะแสดงโมดูล , Status เลือก Published จากนั้นคลิก Save & Close

Show Title คลิกปุ่ม Hide เพื่อซ่อนชื่อของโมดูลในหน้าเว็บ , Position คลิกเลือก search เป็นการเลือกตำแหน่งที่จะแสดงโมดูล , Status เลือก Published
Show Title คลิกปุ่ม Hide เพื่อซ่อนชื่อของโมดูลในหน้าเว็บ , Position คลิกเลือก search เป็นการเลือกตำแหน่งที่จะแสดงโมดูล , Status เลือก Published

 

8.เลือกเมนู Extensions เลือก Templates จากนั้นคลิกที่ชื่อเทมเพลตที่ใช้งาน

เลือกเมนู Extensions เลือก Templates จากนั้นคลิกที่ชื่อเทมเพลตที่ใช้งาน
เลือกเมนู Extensions เลือก Templates จากนั้นคลิกที่ชื่อเทมเพลตที่ใช้งาน

 

9.คลิกที่เมนู Create Overrides

คลิกที่เมนู Create Overrides
คลิกที่เมนู Create Overrides

 

10. คลิกที่  mod_jshopping_search

คลิกที่  mod_jshopping_search
คลิกที่ mod_jshopping_search

 

11.ในโปรแกรม Netbeans จะได้โฟลเดอร์ mod_jshopping_currencies ที่ถูกสร้างไว้ในโฟลเดอร์ html ให้เปิดไฟล์ default.php ขึ้นมา จากนั้น

ปรับโค้ดจาก

<input type = "text" class = "inputbox input-small" placeholder="<?php print _JSHOP_SEARCH?>" name = "search" id = "jshop_search" value = "<?php print htmlspecialchars($search)?>" />
<input class = "button btn" type = "submit" value = "<?php print _JSHOP_GO?>" />

แก้ไขเป็น

<div class="input-group">
<input type = "text" class = "form-control " placeholder="<?php print _JSHOP_SEARCH?>" name = "search" id = "jshop_search" value = "<?php print htmlspecialchars($search)?>" />
<span class="input-group-btn">
<input class = "button btn" type = "submit" value = "<?php print _JSHOP_GO?>" />
</span>
</div>
    

 

ตรวจสอบการแสดงผลในหน้าเว็บจะได้ช่อง search สำหรับค้นหา

แสดงผลในหน้าเว็บ
แสดงผลในหน้าเว็บ

 

เนื้อหาเพิ่มเติม 

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
เครื่องมือในการคำนวณ Bandwidth
โดย prmindphp พฤ 07 พฤษภาคม 2020 6:50 pm บอร์ด MindPHP News & Feedback
0
126
พฤ 07 พฤษภาคม 2020 6:50 pm โดย prmindphp
วิธีตรวจสอบข้อมูลซ้ำ
โดย champp พฤ 07 พฤษภาคม 2020 6:15 pm บอร์ด PHP Knowledge
0
1373
พฤ 07 พฤษภาคม 2020 6:15 pm โดย champp
เขียน CSS ในลักษณะต่างๆ
โดย champp พฤ 07 พฤษภาคม 2020 5:35 pm บอร์ด CSS Knowledge
0
52
พฤ 07 พฤษภาคม 2020 5:35 pm โดย champp
เริ่มเเล้ว "โครงการตู้เย็นข้างบ้านต้านภัย COVID-19" แจกฟรี.. เมล็ดพันธุ์ผักสวนครัวแก่เกษตรกรและประชาชนทั่วไป 10,000 ชุด
โดย thatsawan พ 06 พฤษภาคม 2020 9:55 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
150
พฤ 07 พฤษภาคม 2020 5:05 pm โดย thatsawan
padding ต่างจาก margin อย่างไร
โดย champp พฤ 07 พฤษภาคม 2020 4:49 pm บอร์ด CSS Knowledge
0
131
พฤ 07 พฤษภาคม 2020 4:49 pm โดย champp
IR infrared obstacle detection sensor คืออะไร
โดย champp พฤ 07 พฤษภาคม 2020 4:16 pm บอร์ด IOT - Internet of things
0
45
พฤ 07 พฤษภาคม 2020 4:16 pm โดย champp
ตู้จดหมายแจ้งเตือนผ่านไลน์ได้อย่างไร
โดย champp พฤ 07 พฤษภาคม 2020 3:58 pm บอร์ด IOT - Internet of things
0
110
พฤ 07 พฤษภาคม 2020 3:58 pm โดย champp
วิธีการบันทึกข้อมูลหลายตารางพร้อมกัน
โดย champp พฤ 07 พฤษภาคม 2020 3:39 pm บอร์ด PHP Knowledge
0
1708
พฤ 07 พฤษภาคม 2020 3:39 pm โดย champp
B - รายชื่อผู้สมัครใหม่ ไม่มีชื่อขึ้นที่หน้าเว็บ
โดย mindphp พฤ 07 พฤษภาคม 2020 10:32 am บอร์ด Odoojob.com - Tester
1
11
ศ 08 พฤษภาคม 2020 7:23 pm โดย tsukasaz
R - เครียร์ข้อมูลทดสอบ ออกจากหน้าเว็บ
โดย mindphp พฤ 07 พฤษภาคม 2020 10:24 am บอร์ด OdooJob.com - Developer
0
1
พฤ 07 พฤษภาคม 2020 10:24 am โดย mindphp
เกษตรกรปลูกพืชเตรียมรับเงินเยียวยา มีขั้นตอนตรวจดังนี้
โดย thatsawan อ 05 พฤษภาคม 2020 5:20 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
106
พ 06 พฤษภาคม 2020 7:53 pm โดย arenaofblood
B - หน้า Resumes ใน admin แสดง ID ผิด
โดย tsukasaz อ 05 พฤษภาคม 2020 2:59 pm บอร์ด Odoojob.com - Tester
0
2
อ 05 พฤษภาคม 2020 2:59 pm โดย tsukasaz
อัพเดทแบบดับเบิล! Joomla เวอร์ชั่น 3.9.17 กับ 3.9.18
โดย tsukasaz อ 05 พฤษภาคม 2020 2:18 pm บอร์ด MindPHP News & Feedback
0
103
อ 05 พฤษภาคม 2020 2:18 pm โดย tsukasaz
แนะนำเทคนิคการเล่นกีฬา หัวข้อแบตมินตัน
โดย champp อ 05 พฤษภาคม 2020 12:43 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
37
อ 05 พฤษภาคม 2020 12:43 pm โดย champp
แนวทางสร้าง การจัดเก็บแบบระบุตำแหน่ง
โดย tanapong จ 04 พฤษภาคม 2020 11:41 pm บอร์ด Programming - PHP
4
84
พ 13 พฤษภาคม 2020 8:38 pm โดย tanapong
TIP การใช้ SSL ของ cloudflare คู่กับ Let's Encrypt
โดย mindphp ส 02 พฤษภาคม 2020 8:17 pm บอร์ด Linux - Web Server
0
177
ส 02 พฤษภาคม 2020 8:17 pm โดย mindphp
กรมส่งเสริมการเกษตรเปิด "โครงการตู้เย็นข้างบ้านต้านภัย COVID-19" สนับสนุนเมล็ดพันธุ์พืชผักสวนครัวให้แก่เกษตรกรและประชาชน
โดย thatsawan ส 02 พฤษภาคม 2020 2:58 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
112
ส 02 พฤษภาคม 2020 2:58 pm โดย thatsawan
วิธีการจัดรูปแบบเลขบัตรประชาชนที่กรอกอัตโนมัติ
โดย Ittichai_chupol ศ 01 พฤษภาคม 2020 5:48 pm บอร์ด Jquery & Ajax Knowledge
0
201
ศ 01 พฤษภาคม 2020 5:48 pm โดย Ittichai_chupol
ปัญหา Deprecated: Function ereg() is deprecated ereg_replace()
โดย mindphp ศ 01 พฤษภาคม 2020 2:54 am บอร์ด Programming - PHP
1
1011
ศ 01 พฤษภาคม 2020 4:35 am โดย mindphp
ประวัติความเป็นมาการแข่งเรือยาว
โดย baitoeijr1230 พฤ 30 เม.ย. 2020 9:39 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
173
พฤ 30 เม.ย. 2020 9:39 pm โดย baitoeijr1230