テクニカル– tag –

ノーコードツールBubbleでは、エレメントの角を丸くすることができるRoundnessという設定が搭載されています。 初期状態のRoundnessに数字を入れると、エレメントの左上・右上・右下・左下すべての角が丸くなります。 デザインによっては、「左上と右上だ...

ノーコードツールBubbleのPictureUploaderエレメントを、別要素クリック時にクリックさせる方法をご紹介。 一見難しそうですが、なんてことはない、たった数行JavaScriptのコードを書き、トリガーとなるエレメントにidを付与し、ワークフローを軽く設定す...

ノーコードツール「Adalo」のカスタムリストで作った３カラムレイアウトが、謎の表示崩れが発生したときに一瞬で解決できた対処方法をご紹介！ 今回筆者が遭遇した表示崩れは以下です。Columnsを３で指定したカスタムリストの動的データの件数が３の倍数で...

BubbleでInsert dynamic dataを使い、動的データの挿入設定をすると、エディタ上で設定内容が青色で表示されます。 バブラーの皆さんお馴染みのあの青文字部分。Appearanceタブだけでなく、Conditionalタブでも毎プロジェクトで頻繁に使用します。特に、数...

「Figma」で作られたデザインをノーコードツールのBubbleで再現するときに知っておきたい操作方法や考え方をまとめてご紹介します。 テキストの文字間隔や行間を設定するなどは基礎中の基礎ですが、徹底してやっている作業者とそうではない者とでデザイン...

こんにちはEPICs合同会社です！ 今回は多くのチャットツールやSNSで実装されているメンション機能をノーコードツールBubbleで作る方法をお伝えしていきます！ 最初にお伝えしておくと今回のメンション機能は有料のプラグインを使用した実装方法になります...

ノーコードツール「Bubble」で作るアプリにWordPressの個別記事データを表示させるときに、デザインも忠実に再現する強引だけど手軽な方法を紹介します。 一言で解説すると、WordPressで使われているCSS（スタイルシート）を読み込んで、記事本文はHTMLエ...

ノーコードツール「Bubble」で郵便番号検索（住所自動入力機能）を実装する方法を紹介します。 zipcloudさんの郵便番号検索APIを駆使すればサクッと作れるのでぜひ挑戦してみてください！ どんな機能かイメージ湧かない方は次項の実装イメージ動画をご覧く...

ノーコードツール「Bubble」で、複数のInputエレメントの入力値を連結するアプローチ例を紹介します。 プラグイン「Math.js」とArbitrary textが今回の実装のキーマンです。たとえば、５つのInputに入力された数字（各1文字制限）を連結して５桁の数字にす...

ノーコードツールのBubbleで、記事一覧や商品一覧を作成するときに、現在表示している記事や商品を除外するお手軽な方法を紹介します。 詳細ページの終盤でよく見かける、「こちらの商品もおすすめです」「この記事を読んだ人はこれらの記事も読んでます」...