おすすめ記事

おすすめ記事一覧

Bubble・プラグインエディタ&プラグインの一般的な設定について

Image result for ノーコード bubble

みなさん、こんにちは。いかがお過ごしでしょうか。首都圏中心に緊急事態宣言の動向やCOVIDワクチンのスケジュールが気になりますね。この記事ではノーコードツールbubbleのプラグインエディタとプラグインの一般的な設定について解説していきます。それでは張り切ってLet’s Go!

プラグインエディタ

bubble.io/your_pluginsからプラグインページにアクセスして、 新しいプラグインを作成する ことができます。このページでは、あなたのコントリビュータープロフィールを定義したり、ロゴを設定したり、テンプレートやプラグインを販売している場合はStripeと接続したりすることができます。プラグインの編集アイコンをクリックすると、プラグインエディタに移動します。

プラグインエディタはアプリケーションエディタと同様の構造で、7つのタブで構成されています。

1, 一般タブでは、ライブラリ内でプラグインがどのように見えるかを定義し、可視性を向上させるためのキーワードを定義します。

2, 共有タブはプラグインの共有技術的な側面(共有HTMLヘッダー、アセットなど)を定義することができます。

3, API callsタブは、新しいAPI接続や認証方法を追加する場所です。これはAPIコネクタと非常によく似ています。

4, エレメントタブでは、新しいbubbleエレメントを作成することができます。

5, アクションタブでは、bubbleワークフローで使用できるアクションを追加できます。

6, 設定タブでは、プラグインを公開したり、バージョン履歴を確認したり、ライセンスを選択したりすることができます。

7, レビュータブでは、ユーザーからのレビューを見ることができます。

API接続の追加にはコーディングスキルは必要ありませんが(ただし、REST APIの仕組みをよく理解していること) エレメントやアクションの追加にはJavascriptのコーディングスキルが必要 です。プラグインエディタは、プラグインを修正している間、作業内容を自動的に保存します。エディタはマルチユーザー編集をサポートしていないことに注意してください。

以上ここまでがプラグインエディタに関する説明でした。後半ではプラグインの一般的な設定について説明します。後半も頑張っていきましょう!

プラグインの一般的な設定

プラグインエディタの最初のタブで, あなたのプラグインの一般的な設定を設定することができます. あなたは、プラグイン名、URL、アイコンを変更し、プラグインに関連するいくつかのカテゴリを選択することができます。これは、 あなたのプラグインをBubblersで検索可能にする ために重要です。

共有された技術的な設定

2つ目のタブでは、プラグインの技術的な設定をいくつか定義することができます。

このプラグインはjQuery 3を使用しています。jQuery 3 に依存するエレメントを構築する場合は、このボックスにチェックを入れてください。API を使用すると、jQuery プラグインにアクセスできるようになります。

HTMLヘッダー。このプラグインを使用しているアプリのすべてのページにHTMLを挿入する必要がある場合は、ここにHTMLを入力します。例えば、アナリティクスサービスは通常、すべてのページにHTMLスニペットを追加する必要があります。ユーザーがHTMLスニペットにキーを入力できるようにする必要がある場合(Google Analyticsのトラッキングコードなど)、スニペットにダイナミックキーを_*_の文字列の間に追加することができます。ユーザーがアプリでプラグインを使用すると、このキーはプラグイン タブに入力される設定になり、実行モードではキーは実際の値に置き換えられます。

追加のキー(Additional Keys)。プラグインのユーザーがプラグインタブでいくつかのキーを入力する必要がある場合、このタブにこれらのキー定義を入力することができます。これらのキーは、エレメントやアクションで使用されるすべての関数に送信されるコンテキスト オブジェクトでアクセスできるようになります。 アプリにAPI接続を追加している場合、API呼び出しタブでは、APIが機能するために必要なさまざまなキーを選択できることに注意してください。 

共有されたアセットとリソース(Shared assets and resources)。プラグインの実装でいくつかのアセット(画像、CSSファイル、JSファイル)を必要とする場合は、それらをbubbleのストレージにアップロードして、コード内でそれらのURLを使用することができます。 すべてのアセットは Bubble の CDN を通してアクセスでき、ファイルにアクセスする際の高速性を確保します。 

まとめ

いかがだったでしょうか。今回の記事ではノーコードツールbubbleのプラグインエディタとプラグインの一般的な設定について解説しました。カラーマーカーの部分を中心に、大切なポイントを見落とさないようにしてくださいね。それではまた別の記事でお会いしましょう。See You Soon!

 

 

 

Katsu

Katsu

高校まで日本で育ち、大学からアメリカ・ニューヨークへ。マスメディア、ジャーナリズム、インターネットメディア戦略を専門に修学。コロナ禍でオンライン主体になりつつある世の中で、記事が何かの手助けになれば幸いです。







関連記事

  1. Adalo Resource・キーボードショートカットの使い方、動画や音声の埋め込み方法(YouTu…

  2. Adalo Resource・ワンタイムカードペイメントとサブスクペイメント(Stripe)(スクリ…

  3. 記事画像

    Glide、Adalo、bubbleとは?アプリケーション開発向けノーコードツール3つを比較

  4. 記事作成

    Bubbleのログについて解説!!

  5. 記事作成

    Bubbleのレスポンシブ構築の基礎を伝授!!

  6. SaaSロゴ

    Husky(Jungleworks)

  7. Adalo Resource・ACHペイメントと銀行送金(Stripe)(スクリーンとコンポーネント…

  8. Adalo Resource・フォームとトグル(スクリーンとコンポーネントセクション)について

  9. 記事作成

    BubbleのAgencyプランとテンプレート・プラグイン販売について解説!!

人気記事

  1. topimage
  2. 記事画像
  3. top_image
  4. 特集記事

おすすめ記事一覧

  1. 記事画像
  2. Bubble
  3. Productivity
  4. 勤怠管理
  5. 記事画像
PAGE TOP