【Adalo】image sliderを使ってスライドショーを作る方法

【Adalo】image sliderを使ってスライドショーを作る方法

こんにちは!ノーコードツールに特化したアプリ開発を行っています。

EPICs合同会社です!

今回はAdaloで「image sliderを使ってスライドショーを作る方法」を解説していきます!

動画解説バージョンはこちら!

また、本メディアを運営する「EPICs株式会社」は、ノーコードを活用したアプリ・システム開発を行っております。大手ノーコードツールであるBubbleからも、公式代理店として認定されています。

従来のスクラッチ開発に比べ、ノーコードツールを活用した開発には以下のメリットがあります。

  • 開発期間をおよそ1/3に抑えられる → 検証や新規事業に向いている
  • 開発費用をおよそ1/3に抑えられる → 浮いた費用を別の領域に利用できる
  • リリース後の改修スピードも早い → PDCAを早く回せる

日本最大級のノーコード開発実績を持つ弊社なら、高度なものもスピーディーに開発することが可能です。ぜひご相談ください。

EPICs株式会社の特徴
  • 日本最大級のノーコード開発実績 → 高度な開発もスピーディー
  • 複数のノーコードツールに対応 → 最適なツール選びで開発費用・期間を最大限抑えられる
  • マーケティングまで支援が可能
目次

実装イメージ

データベースに登録した画像が手動もしくは自動でスライドショーのように表示がされる実装をしていきたいと思います!

実装手順

以下の手順で実装します。

  1. image slider(プラグイン)のインストール
  2. データベースの追加
  3. image sliderの設定

image slider(プラグイン)のインストール

最初にimage slider(プラグイン)をインストールしましょう。

  • 「Market place」の項目にある「EXPLORE MARKETPLACE」を開く
  • 「image slider」と検索しましょう
  • 「image slider」をインストール

データベースの追加

次にImage sliderに表示させるデータベースを追加していきます。

データベースを開き「ADD COLLECTION」で「image slider」というデータベースを作りましょう。

image sliderのデータベースができたら「ADD PROPERTY」で「image」のデータを追加します。

作成したimageデータ部の「Records」を押し、次の画面の「ADD IMAGE SLIDER」よりimage sliderでスライドショーのように表示をさせたい画像データを追加していきます。

データの追加が出来たら「DONE」で画面を閉じましょう。

こちらでデータの準備は完了です!

image sliderの設定

最後にimage sliderの配置とデータ設定をしていきます。

「Installed」から先ほどインストールした「image slider」を選択して、画面に配置しましょう!

次に配置したimage sliderに下記の設定を加えていきます。

What image should be displayedimage slider
FilterAll image slider

基本的にはこちらの設定のみで問題なく画像は表示されますが、

現状の設定だと自動で画像が切り替わることはないため、一定時間が経つと自動的に画像をスライドさせたい場合は「Auto Play」を設定しましょう!

以上で設定も完了です!
最後に検証をしてみましょう!

いかがでしたでしょうか?

設定した画像がimage sliderに表示がされて、スライドショーのように手動もしくはAutoで画像が切り替わるようになっているかと思います!

今回の解説は以上です!

本記事が開発力の向上や開発を検討している方のお役に立てておりましたら幸いです。

【日本最大級のノーコード開発実績】
無料でアプリ・システム開発の相談を受付中

    氏名

    法人名

    メールアドレス

    日中繋がりやすい電話番号

    お問い合わせ詳細 ※分かる範囲でご記入ください

    フォームの送信によりGoogleのプライバシーポリシー利用規約に同意したものとみなされます。

    日本最大級のノーコード開発実績!アプリ・システム開発サービス
    「勉強になった!」「役に立った!」と思っていただけたら、是非シェアもお願いします!
    ノーコード開発ツールを使ったアプリ・システム開発にお困りですか?
    1からの開発も、途中からの開発も、お気軽にEPICsにご相談ください!
    著者・監修者
    大熊滉希
    日本最大級のノーコード開発実績を誇るEPICs株式会社の代表。株式会社DRAFT役員として新規事業のコンサルティングに従事した後、EPICsを創業。ノーコード開発の顧問として上場企業に支援も行っている。
    監修者
    石森裕也
    EPICs株式会社CTO。サイバーエージェントのグループ会社での経験を経てEPICsに参画した。これまでで100件以上のノーコード開発に従事。開発経験は10年。
    目次