bubbleで別のページに移行する設定

ノーコードでWEBアプリ、ネイティブモバイルアプリ開発が出来るbubbleで、別のページへ移行する方法を解説します。

アクションを使ったページの移行

とても簡単です。アクションを使ったページの移行設定になります。

ワークフローのアクションの【Navigation】>【Go to page】アクションを使って

bubble内の移動したいページを選択するだけです!

bubble以外のページに移動したい場合

Open an external websiteアクションを使って、DestinationにURLを入れればOKです。
その際に、Open in a new tabにチェックを入れると、新しいタブで開かれるようになります。

リンク要素を使う

デザインを作成するときに、リンクの要素を使います。これもまた、とても簡単なページ移行の設定になります。

リンク要素を使うと、

  • link destination ー bubble内のページに移動するか、外部ページに移動するか設定
  • Destination page ー bubble内のページに移動する場合、ここで移動先のページを選択
  • Destination URL ー 外部ページへ移動するを選択した場合、こちらに外部URLを入力します

bubble内のページへ移動する場合

パラメーターを付与することが出来ます。
Send more parameters to the pageにチェックを入れ、付与したいパラメーターを設定します。

パラメーターの設定については、シングルページアプリケーションの作り方で解説をしています!

テキスト要素にリンクを追加する

テキストの一部にリンクを追加したい場合はこのやり方になります。

テキストエレメントの右下にある【Rich text editor】をクリックして、エディタを立ち上げます

リンクを貼りたいテキストをハイライトして(選択)リンクのアイコンをクリックして、リンクを追加します。

このような変数が付与され、指定したテキストにリンクを付けることが出来ました。

URLとメールをリンクと認識させる

テキスト内にあるURLとメールアドレスをリンクとして認識させたい場合は【Recognize links and emails】にチェックを入れたらおしまいです!

愛を分かち合いましょう