バージョン選択

フォーラム

メニュー

オンライン状況

90 人のユーザが現在オンラインです。 (61 人のユーザが フォーラム を参照しています。)
登録ユーザ: 0
ゲスト: 90
もっと...

サイト内検索

質問 > 管理機能 > デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方

管理機能

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
anna...
投稿日時: 2019/11/27 18:17
対応状況: −−−
半人前
登録日: 2019/7/17
居住地:
投稿: 19
デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
▼テンプレート
[EC-CUBE] EC-CUBE4
[レンタルサーバ] sakura
[OS] Mac
[ブラウザ] Chrome

デフォルトで表示されている検索窓をカスタマイズしたいと思っております。
イメージ的には、一般的にあるような少し丸いフォームと虫眼鏡アイコンがついたようなものにデザインを変更したいと思っています。
その場合、どのようにカスタマイズをしていったらいいのでしょうか。検索窓のデザインなどは他サイトでサンプルが多くあると思うのですが、そこからEC-CUBEの検索に紐づけるやり方がわかりません。

どなたかご教示ください。
umebius
投稿日時: 2019/11/28 8:55
対応状況: −−−
登録日: 2016/7/22
居住地: 東京日本橋
投稿: 1414
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
EC-CUBEの検索に紐づける方法としては、デフォルトではform_widgetという関数が使われていますが、静的にHTMLをコーディングすることも可能です。

URLが下記のようにnameというパラメーターが入ればひもづきます。
https://demo4.ec-cube.net/products/list?category_id=&name=%E3%82%AD%E3%83%BC%E3%83%AF%E3%83%BC%E3%83%89

ですので、キーワード入力欄のinputに「name」というname属性をつくようにコーディングしてやればよいかと思います。

<input type="search" name="name" maxlength="50" class="search-name" placeholder="キーワードを入力">
anna...
投稿日時: 2019/11/28 10:09
対応状況: −−−
半人前
登録日: 2019/7/17
居住地:
投稿: 19
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
丁寧なご説明、誠にありがとうございます。
コーディングを行なっていたのですが、検索ボタンを押すと、パラメーターは付与されるのですが検索はされませんでした。何が原因かわかりますでしょうか。
umebius
投稿日時: 2019/11/28 10:53
対応状況: −−−
登録日: 2016/7/22
居住地: 東京日本橋
投稿: 1414
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
検索ボタン押すとそんなURLに飛んだか教えていただけますか?
(ドメイン部分は伏せてもらって大丈夫です)
anna...
投稿日時: 2019/11/29 11:14
対応状況: −−−
半人前
登録日: 2019/7/17
居住地:
投稿: 19
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方

ご連絡が遅くなり、申し訳御座いません。

/user_data/test_page_layout?name=タオル#
検索すると、上記のようなURLになり画面は変わらないままとなっています。
紐付けなどが上手くいっていないんだろうなとは思いますが、どこを直したらいいかがわかっておりません。

Web上にあるテンプレートの検索ボックスデザインを使用しております。
umebius
投稿日時: 2019/11/29 11:18
対応状況: −−−
登録日: 2016/7/22
居住地: 東京日本橋
投稿: 1414
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
どのようにコーディングされているかわからないので何とも言えないのですが、検索ボタンを押した時は
/user_data/test_page_layout?name=タオル#ではなく、

/products/list??name=タオル というURLに遷移しなくてはいけません。

formタグのaction属性には/products/listを指定する必要があります。

(例)
<form method="get" id="searchform" action="{{ path('product_list') }}">
anna...
投稿日時: 2019/11/29 11:51
対応状況: −−−
半人前
登録日: 2019/7/17
居住地:
投稿: 19
Re: デフォルトの検索窓のデザイン・カスタマイズ方法、EC-CUBEの検索窓への紐付け方
ご連絡ありがとうございます。
actionの記載ができておらず、追加したところ上手くいきました!
ありがとうございます。
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン


EC-CUBEペイメント

公式ストアEC-CUBE4系デザインテンプレート続々リリース中

統計情報

総メンバー数は54,400名です
総投稿数は94,215件です

投稿数ランキング

1
seasoft
7332
2
AMUAMU
2712
3
nanasess
2015
4
468
1918
5
yuh
1610
6
umebius
1414
7
red
1376
8
h_tanaka
940
9
fukap
907
10
tsuji
856
11
shutta
835
12 ramrun 789
13
tao_s
781
14 karin 656
15 sumida 641
16
homan
633
17 DELIGHT 571
18
patapata
502
19
flealog
483
20 tonton 437


ネットショップの壺

EC-CUBEインテグレートパートナー

Copyright© EC-CUBE CO.,LTD. All Rights Reserved.