ให้เรตสมาชิก: 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 สำหรับค้นหา

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

 

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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
การใช้ text-align เพื่อจัดข้อความ
โดย bankjittapol ศ 22 พ.ย. 2019 6:28 pm บอร์ด CSS Knowledge
0
3
ศ 22 พ.ย. 2019 6:28 pm โดย bankjittapol
อยากทราบคำสั่ง joomla ที่จะทำให้ย่อยรูปได้ครับ
โดย jamepiyawat ศ 22 พ.ย. 2019 5:53 pm บอร์ด Joomla Development
0
5
ศ 22 พ.ย. 2019 5:53 pm โดย jamepiyawat
วิธีการการใช้งาน jquery เพื่อปรับเปลี่ยนค่า css ให้กับปุ่มเมื่อมีการคลิก
โดย Ittichai_chupol ศ 22 พ.ย. 2019 5:41 pm บอร์ด Jquery & Ajax Knowledge
0
3
ศ 22 พ.ย. 2019 5:41 pm โดย Ittichai_chupol
การใส่ Intro Outro และการตัดต่อ VDO ด้วยโปรแกรม โปรแกรม Sony Vagas Pro
โดย numtan5839 ศ 15 พ.ย. 2019 1:41 pm บอร์ด Graphic design
0
6
ศ 15 พ.ย. 2019 1:41 pm โดย numtan5839
ข้อดีข้อเสียของ SAP
โดย kanchanok พฤ 05 เม.ย. 2018 9:31 am บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
1
2220
ศ 22 พ.ย. 2019 4:57 pm โดย mindphp
วิธีการเปลี่ยนการแสดงผล ส่วนการจัดการกระทู้ที่ติดตาม ของ phpbb
โดย Ittichai_chupol ศ 22 พ.ย. 2019 4:07 pm บอร์ด PHP Knowledge
0
5
ศ 22 พ.ย. 2019 4:07 pm โดย Ittichai_chupol
.net ถ้าจะใช้ Entity Framework โดยไม่ต้องลงตัว Oracle Data Access Client (ODAC)
โดย jataz2 ศ 22 พ.ย. 2019 3:23 pm บอร์ด Programming - C/C++ & java & Python
0
9
ศ 22 พ.ย. 2019 3:23 pm โดย jataz2
โปรแกรมหาค่าเฉลี่ย, ค่าแปรปรวน และค่าเบี่ยงเบนมาตรฐาน
โดย prmindphp ศ 22 พ.ย. 2019 10:40 am บอร์ด MindPHP News / Feedback
0
17
ศ 22 พ.ย. 2019 10:40 am โดย prmindphp
โปรแกรมคำนวณสแควรูท - โปรแกรมช่วยหาค่า รากที่ สอง สาม สี่... ของจำนวนที่ต้องการ
โดย prmindphp ศ 22 พ.ย. 2019 10:23 am บอร์ด MindPHP News / Feedback
0
37
ศ 22 พ.ย. 2019 10:23 am โดย prmindphp
พาสปอร์ตด่วนพิเศษ บินไวไฟลุก จ่าย 3,000.- รับเล่มภายในไม่กี่ชั่วโมง
โดย promotion ศ 22 พ.ย. 2019 10:19 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
8
ศ 22 พ.ย. 2019 10:19 am โดย promotion
งานประจำวันที่ 22 พฤศจิกายน 2562
โดย numtan5839 ศ 22 พ.ย. 2019 9:36 am บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
6
24
ศ 22 พ.ย. 2019 6:58 pm โดย numtan5839
บันทึกการประชุม OpenERP MD-ERP
โดย rinrada ส 04 ก.พ. 2017 11:52 am บอร์ด OpenERP - MD-ERP (Main)
26
173
พฤ 21 พ.ย. 2019 6:56 pm โดย thatsawan
การใช้ ฟังก์ชัน hsl() และ hsal () กำหนดค่าของสี
โดย bankjittapol พฤ 21 พ.ย. 2019 6:55 pm บอร์ด CSS Knowledge
0
24
พฤ 21 พ.ย. 2019 6:55 pm โดย bankjittapol
วิธีการแยกตัวอักษรเข้าอาร์เรย์ (Array) แต่ล่ะอาร์เรย์ ด้วยคำสั่ง split
โดย jamepiyawat พฤ 21 พ.ย. 2019 6:50 pm บอร์ด Jquery & Ajax Knowledge
0
20
พฤ 21 พ.ย. 2019 6:50 pm โดย jamepiyawat
วิธีการดึงค่าเฉพาะค่าสุดท้ายของ class แม้ว่าจะมี class ชื่อเหมือนกัน หลายคลาส โดย javascript
โดย Ittichai_chupol พฤ 21 พ.ย. 2019 6:39 pm บอร์ด Jquery & Ajax Knowledge
0
27
พฤ 21 พ.ย. 2019 6:39 pm โดย Ittichai_chupol
การติดตั้ง wkhtmltopdf ด้วย terminal บน ubuntu
โดย jirawoot พฤ 27 มิ.ย. 2019 4:00 pm บอร์ด Linux - Web Server
3
719
พฤ 21 พ.ย. 2019 2:49 pm โดย mindphp
การปรับแก้ไข(Overrides) Modules ใน Template
โดย bankjittapol พฤ 21 พ.ย. 2019 2:36 pm บอร์ด Joomla Developing Knowledge
0
19
พฤ 21 พ.ย. 2019 2:36 pm โดย bankjittapol
wkhmtltopdf คืออะไร
โดย jirawoot พ 03 ก.ค. 2019 6:35 pm บอร์ด Share Knowledge
1
229
พฤ 21 พ.ย. 2019 2:34 pm โดย mindphp
อัพเกรด wkhtmltopdf บน Ubuntu 16.04
โดย mindphp พฤ 21 พ.ย. 2019 2:33 pm บอร์ด Linux - Web Server
0
18
พฤ 21 พ.ย. 2019 2:33 pm โดย mindphp
VDO - โปรแกรมแปลงพื้นที่
โดย numtan5839 พฤ 21 พ.ย. 2019 1:59 pm บอร์ด M097 - ตรีเนตร บูรณโพธิ์ทอง
4
29
ศ 22 พ.ย. 2019 6:40 pm โดย numtan5839