イベントカルーセルの埋め込みコードを設定する方法

とともに Timely アカウントを使用すると、Web サイトにイベントカルーセルを簡単に作成して、オンラインでイベントを表示できます。カルーセルウィジェットをインストールすると、選択したイベントに加えられたすべての変更が Web サイト上のカルーセル上で自動的に更新されます。この投稿では、イベントカルーセルの埋め込みコードを設定するすべての手順を学習します。

1. Web サイトにイベントカルーセルを設ける利点

オンラインカレンダーの作成ウェブサイトのイベントウィジェットは簡単に作成できます。 Timely.

楽しく注目を集める方法で特定のイベントを強調表示するには、Web サイトにイベントカルーセルを追加することを検討してください。と Timely カルーセルビューでは、一度に最大 12 つのイベントを連続して最大 4 件のイベントを表示できます。ライブでご覧くださいイベントカルーセルウィジェットのデモページ.

カルーセルオファーにイベントを表示すると、Web サイトがより興味深く魅力的なものになります。実際、イベントを含むカルーセルは、Web ページのデザインと、視聴者がイベントコンテンツと対話する方法を改善できます。

2. コンテンツ管理システム (CMS) をサポート

Timelyのイベントプラットフォームとウィジェットは、公開または非公開の Web サイトやモバイルアプリケーションに埋め込むことができます。これらは、以下を含む (ただしこれらに限定されない) 多くの Web サイトコンテンツプラットフォームと完全に連携します。

WordPress
HTML
Shopifyサービス
ウィックス
SquareSpace
Joomlaの
Drupal
マジェント / アドビコマース
Adobe Experience Manager
Weeblyの
GoDaddyは
Microsoft SharePoint / Power Pages
アジリティ

使用する CMS に関係なく、イベントカルーセルの埋め込みコードを設定する一般的な手順は同じです。さらに詳しく知りたい場合は、読み続けてください。

3. イベントカルーセル埋め込みコードの設定

Web サイトのバックエンドにイベントカルーセル埋め込みコードを追加すると、視覚的に魅力的なカルーセルウィジェットに限られた数のイベントを公開できるようになります。カルーセルに表示したい特定の種類のイベントがある場合は、ウィジェット埋め込みコードをカスタマイズすることをお勧めします。

以下の詳しい手順を参照してください。

にログインします Timely アカウント.
メインのナビゲーションメニューで、設定、次に 埋め込みコード。 ダッシュボードの右上隅にあるショートカットを使用することもできます。
次に、新しいページが開き、すべての埋め込みコードのオプションと設定が表示されます。現在、カレンダー、カルーセル、スライダー、イベントボタンの追加の 4 つの埋め込みコードタイプから選択できます。
この投稿はイベントカルーセルの埋め込みコードを設定する方法に関するものであるため、 埋め込みタイプを選択してください 回転木馬 オプションを選択します。

のプリントスクリーン Timely イベント管理ソフトウェアカルーセル埋め込みコードオプション

埋め込みコードをカスタマイズしたくない場合は、以下のウィジェットコードセクション (6. カルーセル iFrame 埋め込みコードの設定) に直接進むことができます。それ以外の場合は、この投稿を読み続けて詳細を確認してください。

4. カルーセルの詳細設定

すぐ下に 回転木馬 コードタイプを埋め込むオプションを選択すると、 詳細設定 ドロップダウンメニュー。これらの設定は、選択した埋め込みコードの種類によって異なります。

イベントカルーセルウィジェットの埋め込みコードの詳細設定を編集する方法は次のとおりです。

表示する最大イベント数

この機能を使用すると、カルーセルに最大 12 個のイベントを表示することを選択できます。希望するイベント数をボックスに入力するだけです。

のプリントスクリーン Timely イベント管理ソフトウェアカルーセル最大イベントを表示するオプション

ページあたりの最大イベント数

必要に応じて、カルーセルに複数のイベントを同時に表示することもできます。同時に表示できるイベントの最大数は 4 です。

スライダーディレイタイム

必要に応じて、スライダーに表示される各イベント投稿の遅延時間を選択できます (秒単位)。

のプリントスクリーン Timely イベント管理システムのスライダー遅延時間の設定

日付範囲

カルーセルに表示されるイベントの特定の日付範囲を選択するには、日付範囲オプションを使用します。オプションは次のとおりです。

今後のイベント
今日のイベント
明日から
カスタムの日付範囲
次のn日
次の n 件のイベント

注目のイベント

カレンダーで注目としてマークされているイベントのみをカルーセルに表示したい場合は、ボックスをチェックするだけです。 注目のイベント。

のプリントスクリーン Timely イベント管理システムカルーセルの注目イベント設定

5 フィルター

上記で説明した詳細設定に加えて、フィルターされたイベントを含むカルーセルを表示することもできます。カテゴリ、タグ、組織、会場、および作成したその他すべてのカスタムフィルターを選択できます。

のプリントスクリーン Timely イベント管理システムの埋め込みコードフィルター設定

6. カルーセル iFrame 埋め込みコードのコピー

カルーセル埋め込みコードの詳細設定とフィルターをカスタマイズしたら、埋め込みコードの生成に進むことができます。以下の指示に従ってください。

クリック ウィジェットコード (Web サイトにコピーします) フィルタリングしてオプションを選択します iFrame 埋め込み - JavaScript。
クリック スニペットをコピー ボタンをクリックして埋め込みコードをコピーします。

のプリントスクリーン Timely イベント管理システム埋め込みコードジェネレーター

次に、Web サイトのバックエンドにコードを貼り付けて、 Timely イベントカルーセル。以下のリンクをクリックすると、次のコンテンツ管理システムにカルーセルウィジェットコードを埋め込む方法の詳細な手順が表示されます。

インストール方法については、 Timely 他の CMS またはモバイルアプリケーションのカレンダーとウィジェットを使用してください。カスタマーサポートに連絡する.

ユーザーガイドの詳細については、次のサイトをご覧ください。ヘルプセンター。ご質問がある場合、または追加のサポートが必要な場合は、お気軽にお問い合わせください。 Rescale Support。または、以下からサポートチケットを開くこともできます。 Timely アカウントのダッシュボード.

イベント カルーセルの埋め込みコードを設定する方法

1. Web サイトにイベント カルーセルを設ける利点