UNIVERSE for BASE

BASEデザインテーマ「UNIVERSE / ユニバース」ユーザーマニュアル

Instagramフィードを表示する

デザイン設定項目の下の方に、「【Instagram】インスタ埋め込みコード」という欄があります。ここに外部サービスにて生成したInstagramフィードの埋め込みコードを貼り付けられるようになっています。

外部サービスを活用してフィード表示ウィジェットのコードを取得できる方は、それをそのまま貼り付けていただければサイトの下部に表示されます。

Instagramフィード埋め込みサービス例

表示サンプル(SnapWidget)

表示サンプル(behold)



上記は2025年10月時点で無料プランでできる範囲で、サンプルとして作成したウィジェットです。各サービスの機能や仕様の変更によって変更される可能性があります。その時点でのサービスの規約に沿ってご利用ください。

上記だけでなくその他にも新しいサービスが登場している可能性がありますので、その都度ご自身でお調べいただくことで、より良い方法が見つかるかもしれません。各サービスの使い方などのサポートはこちらでは一切行なっておりません。まずご自身でどんなサービスなのかを理解し、ご自身の責任でアカウントを作成し、もし問題があればそのサービスサポートに直接聞く、という前提で利用してください。

Instagramプロアカウントの仕組みの解説、InstagramとFacebook連携の仕組みの解説、またサービスを利用する上で「英語が分からない」といったサポートも行なっていません。



高機能スマホナビ

スマホ画面でのナビゲーションは左から画面全体をスライドさせて表示する「高機能スマホナビ」がデフォルトになっています。シンプルにカテゴリー項目が並んでいるだけの「シンプルナビ」も選択できます。

「高機能スマホナビ」は背景色を黒か白から選択できます。

【上級者向け】独自のOGP画像を追加

BASEではOGPも自動生成されます。商品ページがシェアされた場合、商品画像や商品説明が。商品ページ以外では、ショップロゴ画像やショップ説明が自動的に生成されます。

アップロードした画像は商品ページ以外のOGP候補として追加されます。商品ページでは引き続き商品画像が利用されます。

OGPの扱われ方は、SNS側のルールよって異なります。適正なサイズなどはその時々でお調べください。

「OGP」とは、FacebookやTwitterでシェアされた時にプレビューとして表示される画像や説明文のことです。
(一般的な用語ですので、ここでは詳しい説明は省略します。分からない場合は検索エンジンで「OGPとは」などと検索してください。)


【上級者向け】HTMLヘッダー追加コード(サーチコソール所有権確認などに)

サイトのHTMLヘッダー内にHTMLタグを追加できます。

Google Search Consoleにてサイトの所有権確認を行うには、方法で「HTMLタグ」を選択し表示されるメタタグをコピー、そのままこの設定欄にペーストし保存します。そしてSearch Consoleの画面に戻り画面下部に表示されている「確認」ボタンをクリックして下さい。「(URL) の所有権が確認されました。」と表示されれば確認は完了です。

ここに記述したコードがそのままHTMLのヘッダータグ内に記述されますので、HTMLタグとして完全に不具合のない正しいコードのみを記述してください。不具合のあるコードが含まれるとサイト全体が正常に表示されなくなる可能性があります。

【上級者向け】独自スタイルシート

デザイン編集画面の項目として、独自スタイルシートを入力できます。入力したCSSは継承の最終指定として上書きされます。

ここに入力するメリットは、「デザイン編集の設定値」として別保管されるため、テーマがアップデートされてもそのまま適用されることです。組み込みスタイルシートの中には「!important」を指定しているものもあります。ディベロッパーツールなどを利用して検証してください。

BASEデザイン機能の仕様上、テキスト欄の最大文字数は1000文字となっています。1000文字を超える程のまとまったCSSがある場合は別ファイルにまとめてどこかのサーバにアップして読み込みか、HTMLヘッダーの中に直接記述してください。


こちらのテーマもおすすめです。

その他にもBASE DESIGN MARKETには素敵なテーマがたくさんあります。
テーマごとに特徴がありますので、ショップの用途に合わせて選んでみてください。

BASE DESIGN MARKET