こんにちは、WEBデザイナー兼
趣味で社会人バンドを
しているエミリです*
今回は、久々Wixについて
書いていきます。
先日、以下の様な
ご相談を頂きました!
閲覧者がフィルタリングできるリストを作成したいです。何か良い方法はないでしょうか?
相談者Aさんより
こちらのブログで以前
エクセルの表をHTMLに変換し
Wixでテーブル表示させる方法を
紹介しました。
その記事をご覧になったAさんより
ご相談をいただきました。
以下の記事がその内容です。
-
-
Wixで作成したホームページにエクセルのテーブル表を埋め込む方法
こんにちは、WEBデザイナー兼 趣味で社会人バンドを しているエミリです* 初 ...
この記事で作成したテーブルは
HTML(フロント)部分のみを
作成したものになり
フィルタリング機能は
HTMLのみでは表現できない
(プログラム)部分となります。
なので、上記記事の方法では
フィルタリングさせることは
できません。
プログラミング不要で
フィルタリング機能を
もたせることが可能なのか?
もし、その辺で悩まれてる方は
以下より参考になさってください!
Wixで作成したテーブル一覧にフィルタリング機能はつけれるのか?
まず、Aさんからご相談を受け
すぐにWixのサイトで調べてみました。
すると、以下の様に記載が
ありました。
現在、訪問者が「フィルター」をかけたり、「ソート(分類)」できるリストを作成することはできません。
え~、できんのかい!!!
これ大事だろ・・・と思いつつ
もう一つ、違う記載も見つけました。
商品ギャラリーに並び替えとフィルターのオプションを追加し、購入者が探しているものを見つけやすくしましょう。
※並び替えとフィルターメニューはモバイル機器では表示されません。
※並べ替えとフィルターはスライダー商品ギャラリーではご利用いただけず、グリッド商品ギャラリーにのみご利用いただけます。
どうやら、Wixストアの商品リストで
あればフィルター機能を
つけれるようです。
しかし、モバイル機器では表示されない
グリッド表示のみにしか適応しないなど
まだまだ使い勝手はよくなさそうですね。
とまあ、こんな感じで
観覧者側でのフィルタリングは
現在のところできないようです。泣
ただ、WixではWixcodeという
データベースが用意されています。
大量の情報を扱う場合
Wixcodeを使用することで
観覧者側からのフィルタリングは
できませんが管理者側からの
フィルター追加が可能です。
これを利用すれば
ある程度分類させたものを
各ページに表示させることができます。
それでは、その具体的な方法を
以下より紹介していきます。
Wixcodeを使用してみよう!
まずは、Wixcodeを使用する手順と
情報入力~コンテンツ表示までは
以下の記事で紹介しております。
「Wixcodeとは何か?」から
説明しておりますので
ぜひ参考になさってください!
-
-
WixにMySQLのデータをPHPを使用して表示することは可能か?
こんにちは、WEBデザイナー兼 趣味で社会人バンドを しているエミリです* W ...
管理者側でフィルターを
かけるにはWixcodeの使用は
必須となります。
Wixのデータベースの情報にフィルターをかけ表示させる方法
データベースの表示まで完了したら
フィルターをかける準備を
していきます。
カテゴリー分けをしているリストは
カテゴリーを利用して
フィルタリングしていきましょう!
カテゴリー分けをしていない場合
まず、それぞれのリストに
IDをつけていきましょう!
具体的には以下のようにやっていきます。
私が作成したデータベースは
バンドスタッフの一覧です。
この一覧、情報が少ないのですが
スタッフの年齢を
「20代」「30代」「40代」と
分類して表示させるようにします。
データベースに20代のスタッフには
「20」というIDを付与していきます。
30代スタッフは「30」
40代スタッフは「40」・・・
idの付与が完了したら
同期・公開して
エディタに戻ります。
エディタに戻りそれぞれの一覧を
表示させるページを作成します。
では、20代一覧ページに
id「20」のフィルターをかけて
表示したいと思います。
まず、元のテーブルを
20代一覧ページにコピペします。
データベースのアイコンを
クリックしてスタッフ一覧を
選択します。
セットされたデータベースの
「設定」をクリックして
フィルターをかけます。
フィルター追加をクリックします。
次の設定で、
・先ほど作成した「id」というフィールド内から
・等しい「=」もの
・値は「20」をひろう
と選択しました。
プレビューで確認すると
きちんと20代のスタッフのみが
表示されていました。
同じように、別の一覧ページも
作成していきます。
あとは、テーブルの近くに
一覧ページへのボタンを設置し
リンクさせて完了です!
今回の検証は以下のページで
確認することができます!
最後に
上記の方法を使用すれば
観覧者側でフィルターを
かけれなくてもカテゴリー分けした
リスト一覧を表示させることが
できます。
ちょっと、面倒ではありますが
よりあなたの理想の形を
表現できるかもしれません。
また、今回お悩み相談をくださった
AさんはWixのテーブル表示が
スマホだと横スクロールに
なってしまうということで
ブログを使用する方法にしたそうです!
ブログを使用した場合
検索窓がついているので
そこで観覧者に検索を
かけてもらうということが
できますよね!
とても良いアイデアを
いただきました*
もし、今回の方法をトライしてみたいけど
不安だという方はこちらのサービスを
ご利用いただければと思います!
【あなたにおすすめの記事】
■ページ作成のポイントについて
-
-
ホームページをwixやjimdoで自作する上で気を付けたいこと
こんにちは、webデザイナー兼 バンドマンやアーティストの 応援をしているエミリです* 今回 ...
■wixカスタマイズまとめ
wixでツイッターを連動させたい!コンタクトフォームはどう設定するの?といったことを以下でまとめています。これからもどんどん追加していきます。リクエストも受け付けています!
-
-
Wixテンプレートのカスタマイズ方法まとめ
このページでは、Wixで作成したホームページのカスタマイズ方法をまとめました。 随時更新しますので、ホームページ作成を検 ...