Wix ウェブサイトにイベントカレンダーとウィジェットを追加する方法

この投稿をシェアする

ととも​​に Timely アカウントを使用すると、迅速かつ簡単にアカウントを組み込むことができます。 イベント付きのカレンダー ウィジェットを Wix ウェブページに追加します。コード スニペットをコピーして、Web サイトのバックエンドに貼り付けるだけです。カレンダーやイベントに変更や更新を加えると、すぐに反映されます。さらに、オンラインカレンダーを使用して承認するオプションもあります。 予約、 予約, イベントのチケットを販売する。この投稿では、イベントカレンダーとウィジェットを Wix ウェブサイトに追加する方法を説明します。

1. Wix とは何ですか?

ウィックス はクラウドベースの Web 構築プラットフォームです。さまざまなテンプレートとシンプルなドラッグ アンド ドロップの HTML5 エディターを使用して、Web サイトをカスタマイズできます。 Wix を使用すると、さまざまなアプリ、グラフィック、画像ギャラリー、フォント、ベクター、アニメーションなどを利用できます。さらに、Wix ユーザーはウェブサイトを最初から始めるという選択肢もあります。

Wix 用のオンライン カレンダーをすでに作成している場合、または作成しようとしている場合は、この投稿で追加方法を説明します。 Timely Wix Web ページのイベントカレンダー。さらに詳しく知りたい方は読み続けてください。

2. フルカレンダーとウィジェットの埋め込み

Timely イベントカレンダーソフト Wix でイベントを企画、宣伝するための非常に便利で効率的な方法です。多種多様な カレンダー ビュー 利用可能な場合は、エクスペリエンスをカスタマイズして、本格的なカレンダーを作成したり、ミニ カレンダー ウィジェットを選択したりできます。

通常、実物大のカレンダーは Wix ページ全体に広がります。拡張カレンダー バージョンであるため、日付とキーワードの検索、カレンダーの購読、フィルターなど、いくつかのカレンダー機能を使用できる余地があります。

のプリントスクリーン Timely ポスター ボードの完全なカレンダー ビュー
ポスターボードの完全なカレンダー ビュー

ミニ カレンダー ウィジェット ビューは小さくなり、必要なスペースも少なくなります。通常、限られた数の今後のイベントのみが表示され、検索やフィルター機能はありません。

の例 Timely カレンダー ウィジェット ストリーム ビューまたはミニ カレンダー
ストリームカレンダーウィジェットビュー
の例 Timely カレンダー ウィジェット ストリーム ビューまたはミニ カレンダー
モダンな行カレンダー ウィジェット ビュー

さらに、あなたは使用することができます Timely スライダー および カルーセル Wix サイトのデザインをさらに洗練するためのウィジェット。これらのウィジェットは、イベントを魅力的な方法で紹介するのに間違いなく役立ちます。

すべてのオプションを個別に埋め込むことも、まとめて埋め込むこともでき、Web サイト訪問者にシームレスなエクスペリエンスを提供します。

3. Wix ページに完全なカレンダービューを追加する方法

インストールする前に Timely Wix ウェブサイトのカレンダーで、適切な Wix プランがあることを確認してください。最適な結果を得るには、インストールすることをお勧めします Timely Wix プレミアムプランでのみ利用できる機能であるカスタム要素を使用します。

また、 Timely カレンダーのURLが便利です。あなたはあなたのものを見つけることができます Timely カレンダーの URL をクリックして、 公開カレンダー ダッシュボードの右コーダにあるショートカット。次のようになります。 https://events.timely.fun/xxxxxxx/posterboard.

のプリントスクリーン timely 公開カレンダーの URL ショートカット
Timely 公開カレンダーの URL ショートカット

これらの最初の手順を完了したら、以下の手順に従ってください。

  1. Wix アカウントにログインします。
  2. Wix ウェブサイトエディター内で、埋め込みたいページを選択します Timely カレンダー。
  3. ソフトウェアの制限をクリック 埋め込む、次に カスタム埋め込み。 次に、を追加します カスタム要素。
カスタム要素を追加する場所を強調表示する Wix ウェブサイトの印刷画面
Wix ダッシュボードへのカスタム要素の埋め込み
  1. 選択 ソースを選択。次に、 サーバー URL オプションの値: https://events.timely.fun/embed-wix.js
プリント スクリーン Wix カスタム要素
  1. 選択 属性を設定 少なくとも属性を設定します データソース あなたと Timely 公開カレンダーの URL (例: https://events.timely.fun/xxxxxxx/posterboard)。小さな画面でもカレンダーが応答できるようにするには、データ幅を値「var(–customElementWidth)」で設定します。また、必要に応じて、カレンダー セクションを全幅に引き伸ばして視認性を高めることもできます。
プリントスクリーン Wix 要素
  1. 変更を保存して、Wix サイトのフロントエンドに移動します。そこで、あなたの Timely 埋め込みコード設定に従って、カレンダーが適切にインストールされました。それでもカレンダーが表示されない場合は、Wix からログアウトしてみてください。

4. Wix ウェブサイトにウィジェットを追加する方法

Wix ページまたはウェブサイトでミニカレンダー ウィジェットを機能させるには、まずウィジェットをカスタマイズする必要があります。 Timely カレンダー URL を作成するには、URL の最後のセクションを目的のカレンダー ビューの名前に置き換えます。たとえば、ストリーム ビュー カレンダー ウィジェットを作成する場合、該当するカレンダー URL は次のとおりです。 https://events.timely.fun/xxxxxxx/stream.

スライダー および カルーセル, Wix はコードの埋め込みではなくリンクの埋め込みで動作しますが、最初にこれらのウィジェットに必要な埋め込みコードを設定する必要があります。その方法がわからない場合は、次のユーザー ガイドの投稿に概説されている手順を参照してください。

埋め込みコードの準備ができたら、ビュー名をカルーセルまたはスライダーに置き換えて、公開カレンダーの URL を変更するだけです。例えば、 https://events.timely.fun/xxxxxxx/slider および https://events.timely.fun/xxxxxxx/carousel.

ウィジェットの URL を用意したら、上記のこの投稿と同じ手順に従って、ウィジェットを目的の Web ページに追加します。唯一の違いは、ページの作成時に、埋め込み可能領域のサイズを事前に制限する必要があることです。そうすることで、ウィジェットがページ上の正しい場所に表示されるようになります。

Web サイトにインストールされたカルーセル ウィジェットの例
Web サイトにインストールされたカルーセル ウィジェットの例

このユーザーガイドが Wix ウェブサイトやページにイベントカレンダーを追加する方法を学ぶのに役立つことを願っています。必要に応じて、使用することもできます Timely カレンダーへ 予約を受け付けます および イベントのチケットを販売する、自分のウェブサイトから直接。

ユーザー情報の詳細については、次のサイトをご覧ください。 ヘルプセンター。ご質問がございましたら、お気軽にお問い合わせください Rescale Support。または、以下からサポート チケットを開くこともできます。 Timely アカウント.