ghost finder
v3.1.2
นี่คือแพ็คเกจ npm ที่เป็นประโยชน์ที่ฉันทำ ส่วนเสริมนี้ช่วยให้คุณสามารถรวมคุณสมบัติการค้นหาเข้ากับธีมผีของคุณได้อย่างง่ายดายและไพเราะ มันทำงานโดยใช้ Ghost Content API
npm install ghost-finderดาวน์โหลดรุ่นล่าสุด
รวมสคริปต์
< script src =" {{asset " ghost-finder /dist/ghost-finder.js"}}" > </ script >ตั้งค่ามาร์กอัป
< div >
< input id =" search-input " type =" text " placeholder =" Type to search " />
< div id =" search-result " > </ div >
</ div >เปิดใช้งานปลั๊กอิน
new GhostFinder ( {
input : '#search-input' ,
showResult : '#search-result' ,
contentApiKey : //CONTENT API KEY...,
} )หากต้องการดูว่าคุณสามารถรับ contentApiKey ได้อย่างไร คลิกที่นี่
| ชื่อ | ค่าเริ่มต้น | รายละเอียด |
|---|---|---|
| ป้อนข้อมูล | จำเป็นต้องระบุเป็น null | ตัวเลือก DOM ของอินพุตการค้นหา |
| แสดงผล | จำเป็นต้องระบุเป็น null | ตัวเลือก DOM ที่จะเสียบปลั๊กผลการค้นหา |
| homeUrl | URL ของเว็บไซต์ปัจจุบัน | URL ไซต์ผีของคุณ |
| เนื้อหาApiKey | จำเป็นต้องระบุเป็น null | คีย์เนื้อหา API |
| ผลลัพธ์เทมเพลต | ดูด้านล่าง | เทมเพลต wrapper ผลลัพธ์สำหรับผลการค้นหา |
| เทมเพลตผลลัพธ์เดียว | ดูด้านล่าง | เทมเพลตผลการค้นหารายการเดียว |
| ข้อความที่ตัดตอนมา_ความยาว | 250 | จำนวนคำที่จะแสดงในตัวแปร ##excerpt |
| เวลา_รูปแบบ | 'MMMM dd yyyy' | สตริงรูปแบบเวลาสำหรับตัวแปร ##published_at รูปแบบที่มีอยู่ |
เทมเพลตผลลัพธ์
< ul class =" search-results-wrapper " >
< p > Search match(es): ##resultCount </ p >
##results
</ ul >เทมเพลตผลลัพธ์เดียว
< li > < a href =" ##url " > ##title </ a > </ li >| ชื่อฟิลด์ | วัตถุประสงค์ |
|---|---|
##title | ชื่อโพสต์ |
##url | โพสต์ URL |
##primary_tag_name | ชื่อของแท็กหลัก |
##primary_tag_url | URL ของแท็กหลัก |
##primary_author_name | ชื่อผู้เขียนหลัก |
##primary_author_url | URL โปรไฟล์ของผู้เขียนหลัก |
##primary_author_avater | รูปโปรไฟล์ของผู้เขียนหลัก |
##excerpt | แสดงคำบางส่วนของเนื้อหาโพสต์ จำนวนคำเริ่มต้นคือ 15 |
##published_at | วันที่โพสต์เผยแพร่ รูปแบบสามารถเปลี่ยนแปลงได้ตามตัวเลือก time_format |
##feature_image | โพสต์ URL รูปภาพเด่น |
##resultCount | จำนวนผลลัพธ์ที่ตรงกัน |
