ghost finderダウンロード - ghost finderソースコードのダウンロード

ダウンロード

ゴーストファインダー

これは私が作成した便利な 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 セレクター
ホームURL	現在のウェブサイトのURL	あなたのゴーストサイトのURL
contentApiKey	`null`必須	コンテンツAPIキー
結果テンプレート	以下を参照してください	検索結果の結果ラッパーテンプレート
単一結果テンプレート	以下を参照してください	単一の検索結果テンプレート
抜粋の長さ	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`	一致した結果の数