一番簡単にSTUDIOに決済機能をつける方法

広告 ネットショップ開業・運営・集客 ホームページ作成

一番簡単にSTUDIOに決済機能をつける方法!BASEと連携する簡単手順を解説

無料から使えるWEBサイト制作プラットフォーム「STUDIO・スタジオ」に、一番簡単に決済機能を追加する方法についてご紹介します。

これから紹介する方法は、導入費用、固定費などは一切かかりません。初心者でも簡単にできるので、ぜひ挑戦してみてください。

STUDIOに決済機能は搭載されていません

STUDIOの公式ヘルプより抜粋しました

この記事を書いている、2024年3月時点、STUDIOに決済機能はありません。以下に、公式ヘルプへの問い合わせと返答を掲載しました。

STUDIOでカート・決済機能は作れますか?
STUDIOではECサイトなどで利用されるカート・決済機能は提供していません。外部サービスとSTUDIOのカスタムコード機能やEmbedボックスでのコード埋め込みのご利用を検討してください。
https://help.studio.design/ja/articles/4185079

公式ヘルプには、代替え案として、外部サービスとSTUDIOのカスタムコード機能やEmbedボックスでのコード埋め込みのご利用を検討してくださいと記載されています。

今時店長
今時店長
というわけで、STUDIOに決済機能はありません。そこで、一番簡単に決済機能をつけられる一番おすすめの方法をご紹介します。

1番簡単にSTUDIO決済機能をつける方法をご紹介

ズバリその方法とは?STUDIOにBASEの商品を埋め込む

BASE(ベイス)

いくつかのサービスをためして、一番簡単だったのが「BASE」でした。

そもそもBASEとは

7年連続ネットショップ開設数第一位のサービス

BASEは、7年連続でネットショップ開設数第一位を獲得している、初期費用、月額無料から利用できるネットショップ作成サービスです。過去には「ネットでお店を開くなら・ベ・イ・ス」というテレビCMなども放送していました。

BASEは事前審査もなくカード決済などを導入できる

BASEの支払い方法は、フリマアプリなどで採用されているエスクロー決済(仲介)です。この決済は、事前審査もなくクレジットカードを含む複数の決済方法を一括で導入可能です。つまり、今すぐお店をオープンして販売をスタートできます。

BASE(無料ではじめる)

実際に買い物までの流れを動画でチェックする

驚くほど違和感もありません

実際に、STUDIOで作成したページに、BASEの商品を埋め込み、ユーザーがクリックしたと想定したと想定した動画を撮影してみました。

STUDIOに掲載された商品はカーソルをのせると「詳しくみる」というボタンが表示されて「画像をクリック」すると、BASEの商品ページに飛んで買い物ができます。

BASEの商品価格を変更すると、STUDIO上の価格も変更されます

商品を掲載したあとのメンテナンスについて確認しておきましょう。

商品の販売価格を変えたい場合には、BASEの商品価格を変更すれば、STUDIO側に表示されている商品の価格も変更されてます。

つまり、一度貼り付けてしまえば、商品価格のメンテナンスは不要です。

掲載した商品が在庫切れの場合には非表示にすればOK

商品が見つかりませんと表示される

商品の在庫が切れた場合には、BASE側の商品設定を非表示にしましょう。「商品が見つかりません」と表示されて、商品ページへは飛べなくなります。

商品の販売が終了したときには、STUDIOの商品掲載コードも削除しましょう。※「他の商品ページを見る」を掲載したい場合には、そのままで問題ありません。

BASE(無料ではじめる)

今時店長
今時店長
外部カートが使えるECカートであれば、ほかのサービスでも構いません、初期費用、月額無料で、実際にためして違和感がなかったのが「BASE」でした。ぜひ、ためしてみてください。
【完全ガイド】BASEの評判どう?実体験をもとにメリット・デメリットを徹底解説!
【完全ガイド】BASEの評判どう?実体験をもとにメリット・デメリットを徹底解説!

BASEは、無料で利用できるネットショップ作成サービスとして広く知られていますが、その評判は実際のところどうなのでしょうか? 本記事では、BASEを実際に利用した経験をもとに、サービスの魅力的な特長や ...

他にも色々ある、外部カート機能の比較はこちら

主要ECサービスの外部カート機能を徹底比較!WordPressやブログに簡単設置
主要ECサービスの外部カート機能を徹底比較!WordPressやブログに簡単設置

ブログやホームページに、ネットショップ作成サービスに登録した商品を簡単に掲載できる「外部カート機能」が搭載されていることをご存知ですか? では、どのECカートで外部カート機能がつかえるの? このページ ...

STUDIOとBASEを連携して販売する簡単手順

BASEに登録した商品をSTUDIOで呼び出しをする

STUDIOとBASEを連携する方法

それでは、具体的にBASEに登録した商品を、STUDIOのページに呼び出して掲載する手順を解説します。

BASEでショップを開設して商品を登録する

BASEでショップを出店する:BASE

まずは、上のリンクから、BASEにお店を出店して商品を登録してください。BASEは、5分程度あればお店を開設して商品を登録も可能です。

BASE側のソースコードを作成する

赤線部分をBASEの商品ページのURLに書き換えてください。

中サイズ(220x380)はこちら。

<iframe frameborder="0" height="380" width="220" src="【商品詳細ページURL】/widget" ></iframe>

小サイズ(160x220)はこちら。

<iframe frameborder="0" height="220" width="160" src="【商品詳細ページURL】/widget/small" ></iframe>

大サイズ(320x480)はこちら。

<iframe frameborder="0" height="480" width="320" src="【商品詳細ページURL】/widget/large" ></iframe>

特別な理由がなけければ大サイズがオススメです。

STUDIOにソースコードを貼り付ける

STUDIOで左ツールバーの一番下の右矢印をクリックする

STUDIOにて、掲載するページに移動して、ツールバーの一番下「右矢印」をクリックする。

上の一番右にある、追加というタブをクリックして「Embed」→「Blank」とクリックしてください。

上の一番右にある、追加というタブをクリックして「Embed」→「Blank」とクリックしてください。

BASEのソースコードをSTUDIOに貼りつける

「iframe」というボックスが表示されるので、右の上「ボックス」タブにある「Custom」をクリックして、先ほどコピーしたソースコードをそのまま貼り付けてください。※最初に入っているテキストは上書きして消して問題ありません。

きちんと掲載できるように調整して完了です

あとは、ボックスの端などを掴んで、ドラッグ&ドロップをしてサイズなどを調整して、右のスクロールバーを消しましょう。

BASE(無料ではじめる)

今時店長
今時店長
STUDIOで、大量の商品を販売するような使い方には向いていません。STUDIOに注目商品を一品、二品、掲載するのに最適です。BASEは、予約販売、定期販売、など、とにかく多機能です。
BASE × Up-T 連携で実現する!ネットショップの無在庫オリジナル商品販売
BASE × Up-T 連携で実現する!ネットショップの無在庫オリジナル商品販売

無料でネットショップを作成できる「BASE」と、テレビCMなどでもおなじみ「Up-T」を連携して、無在庫でオリジナル商品を販売するネットショップを作る方法について解説します。 はじめに 今回利用する2 ...

まとめ

まとめ

無料から使えるWEBサイト制作プラットフォーム「STUDIO・スタジオ」に、一番簡単に決済機能をつくれる方法をご紹介しました。

「STUDIO」には、決済機能はついていません。「BASE」など、外部カートを作成できるサービスなどを活用して、「STUDIO」でネット販売をはじめましょう。

あわせて読みたい

主要ECカートの外部カート機能の比較はこちら。

主要ECサービスの外部カート機能を徹底比較!WordPressやブログに簡単設置
主要ECサービスの外部カート機能を徹底比較!WordPressやブログに簡単設置

ブログやホームページに、ネットショップ作成サービスに登録した商品を簡単に掲載できる「外部カート機能」が搭載されていることをご存知ですか? では、どのECカートで外部カート機能がつかえるの? このページ ...

BASEに関するメリットはこちら。

【完全ガイド】BASEの評判どう?実体験をもとにメリット・デメリットを徹底解説!
【完全ガイド】BASEの評判どう?実体験をもとにメリット・デメリットを徹底解説!

BASEは、無料で利用できるネットショップ作成サービスとして広く知られていますが、その評判は実際のところどうなのでしょうか? 本記事では、BASEを実際に利用した経験をもとに、サービスの魅力的な特長や ...

無料ネットショップ作成サービスに関する比較はこちら。

2024年版|無料ネットショップ開業サービス徹底比較
【2024年最新版】無料ネットショップ開設サービス徹底比較!おすすめアプリをご案内

いまやネットショップは、無料で開業できる時代になりました。 初期費用は不要、月額固定費は0円、商品が売れたときのみ手数料が差し引きされて入金される仕組みです。 つまり、ノーリスクで誰でもネットビジネス ...

無形商品の販売には「STORES」が一押しです。

下にジンドゥーとSTORESを連携した、ネットでサービスなどを販売する方法について解説しています。※STUDIOは、STORESのボタンは動作しませんでした。

無料で簡単にJimdoに買い物かごをつける方法
ジンドゥーの裏技!?無料プランで登録数無制限!ネットショップ開設方法[STORESボタン設置]

人気ホームページ作成サービスである、ジンドゥー(Jimdo)にて、無料プランなのに無制限で商品を販売する裏技をご紹介します。 裏技と言うと胡散臭いイメージを持たれるかもしれませんが、もちろん規約などに ...

【完全ガイド】STORESの評判どう?実体験をもとにメリット・デメリットを徹底解説!
【完全ガイド】STORESの評判どう?実体験をもとにメリット・デメリットを徹底解説!

STORESは、無料で利用できるネットショップ作成サービスとして広く知られていますが、その評判は実際のところどうなのでしょうか? 本記事では、STORESを実際に利用した経験をもとに、サービスの魅力的 ...

最後まで読んで頂きありがとうございました。
また新しい情報などあれば更新していきます。

\ こちらの記事をシェアする /
  • この記事を書いた人
今時店長

今時店長(ミニクル合同会社)

楽天市場の某大型サイトにて、2005年~2013年まで運営責任者を務める。その経験を活かし、2013年に楽天市場のショップへのサポートを目的に当サイトを立ち上げました。2016年に情報サイトとしてリニューアル、より幅広い層の方々にオンラインビジネスのノウハウやアドバイスを提供しています。

運営企業情報(プロフィール・運営理念)
掲載依頼・お問い合わせ
誤り報告フォーム

【2024年最新】いまチェックしたい!ネットショップ作成サービス

【2024年最新版】ECショッピングカートを完全比較!よくわかる比較表で違いが一目瞭然
実際に利用した経験などをもとにピックアップ!サービスの料金、特徴、感想などを紹介

-ネットショップ開業・運営・集客, ホームページ作成
-,