ページの任意の場所に検索窓を埋め込むことはできますか?

解決済

表題の通りですが、商品詳細ページや任意制作のページ、ブログの文面上などに検索窓を埋め込みたいのです。

検索をグレードアップするアプリは色々試しましたが、埋め込みようのコードを提供するものは見つかりませんでした。

Googleカスタム検索を埋め込むのもてだとは思いますが、ベストなUXとは思えません。どなたか詳しい方、お助けください!

0 件の「いいね!」
junichiokamura
Community Manager
Community Manager
1040 236 390

公式にはないですが、おっしゃる通りスクリプトを埋め込むことは可能なので、たとえば、search.liquidの検索ページの内容を参考に作ってみるなどはどうでしょう?

Technical Partner Manager, Japan
0 件の「いいね!」

コメントありがとうございます。もう少し詳しくわかりやすく教えていただけないでしょうか。


@junichiokamura さんは書きました:

公式にはないですが、おっしゃる通りスクリプトを埋め込むことは可能なので、たとえば、search.liquidの検索ページの内容を参考に作ってみるなどはどうでしょう?


 

0 件の「いいね!」
junichiokamura
Community Manager
Community Manager
1040 236 390

すいません、search.liquidは、検索結果なので、検索窓自体は共通部分のtheme.liquidの内部かと思いますが、「search」などでヒットするコードの場所をそのまま表示したい箇所テーマファイルにコピーしてみてはどうかと思ったのですが、そもそも

 

> 任意の場所に検索窓を埋め込む

 

この意図がわからないのですが、Shopifyの標準テンプレートは、上記のように共通ヘッダに常に検索窓が表示されるので、何もしなくても全画面に検索窓が出ている状態ですが、具体的にどういったことをされたいのでしょうか? 1つの画面に2つ検索窓があるとわかりずらいかと思いまして。

Technical Partner Manager, Japan
0 件の「いいね!」
junichiokamura
Community Manager
Community Manager
1040 236 390

成功

ちなみにもう1つテーマとは全く関係ない解決方法として検索のURLは

 

https://SHOP_ID.myshopify.com/search?q=検索ワード   

 

のように決まっているので、単純にEnterでValueを上記に渡して遷移するようなtext inputとJavaScriptを書いて任意の場所に埋め込めば良いかと思いますがいかがでしょうか?

Technical Partner Manager, Japan

コメントありがとうございます。ページの任意の場所に検索窓を埋め込む理由は下記になります。

現在商品数が約1500あるサイトを運営していまして、広告のランディングページのわかりやすいところに検索窓を置いて、商品検索をコンバージョンとしたキャンペーンを実施したいと考えています。

従いまして、左上の検索窓とは別に、ページの中央に検索を促すフレーズを添えて入力欄を設けたいと思っています。

何か良い方法はありますでしょうか?

0 件の「いいね!」

ありがとうございます。多分コレで解決だと思います。

JSは詳しくないのですが、少し調べて下記のコードをページに入れたら機能しました。

もし問題があれば教えていただけますと助かります!

 

<form action="/search" method="get">
<input type="text" name="q"> <input type="submit" value="検索">
</form>

 


@junichiokamura さんは書きました:

ちなみにもう1つテーマとは全く関係ない解決方法として検索のURLは

 

https://SHOP_ID.myshopify.com/search?q=検索ワード   

 

のように決まっているので、単純にEnterでValueを上記に渡して遷移するようなtext inputとJavaScriptを書いて任意の場所に埋め込めば良いかと思いますがいかがでしょうか?