STUDIOで「できないこと」を知っておこう

ノーコード系 ウェブ制作ツール STUDIO で「できないこと」を書き出してみました。サイトの制作運用で困り度が高そうな順(独断)に書き出しています。

STUDIOの機能として対応していない場合と、無料版では対応していない場合がありますが、この記事では有料版で対応していない機能を中心にとりあげます。

できないことがわかっていれば、あらかじめ覚悟を決めたり、対策を打てるというものです。

STUDIO 単体ではできないことも、Google Tag Manager(GTM) や Zapier などの外部サービスと連携すれば実現できる可能性があります。ノーコードではなくなってしまいますが、だいたいのことはカスタムコードでできます。JavaScriptはいいぞ。


すべて執筆時点(2022年1月6日)の情報です。 もし「できないと書いてあるけど、それはできるよ」といった情報がありましたら Twitter @Pentaprogram チャットまでご連絡ください。

目次

プロジェクトのインポート・エクスポートができない

STUDIO ではプロジェクトのインポート/エクスポートができません。このため、サイトをバックアップのためにローカルに保存したり、あるいはテンプレートのように配布したり、といったことができません。

2022/08/15:プロジェクトの複製機能がリリースされたため、記述を変更しました。


CMSデータのインポート・エクスポートができない→インポートできるようになりました

STUDIOのCMS機能にはデータのインポートやエクスポートの機能がありません。また、モデル/コレクションのスキーマも同様にインポート・エクスポートができません。

2022/07/27追記:WordPressエクスポートファイル(.xml)をSTUDIOにインポートできるようになりました。

PDFファイルやZIPファイルをアップロードできない→PDFはできるようになりました

STUDIOにPDFファイルやZIPファイルをサイトに掲載したい場合は、Google Drive や Dropbox にアップロードしておき、共有リンクを取得して利用します。

2023/09/24追記:PDFファイルをデザインエディターからアップロードできるようになりました

任意JavaScriptやCSSを挿入できない→できるようになりました

STUDIOは現状では、任意のJavaScriptやCSSを自由にページに挿入できません。もちろんHTMLを直接編集することもできませんし、CSSで複数のボックスの値を一括して変更するといったことはできません。

任意のボックスにIDを与えることはできます。ただ任意classは付与できないので、GTMでうまいことするには、加工したい要素を囲むボックスにIDを振って、そのなかのHTMLタグになんやかやする形になります。


2023年06月02日追記:「カスタムコード」機能がリリースされ、任意の場所にJavaScriptなどを挿入できるようになりました。

ただし、embedを利用する場合はsandboxであるiframe内でのみコードが有効になるため、STUDIOのDOMを自由に操れるわけではありません。

Starter以上のプランで可能になる、<body>へのscriptの記述であれば、STUDIOのDOMに対してもうまく動作する可能性があります。

ページを予約公開・予約更新できない

地味に困るのが、特にデザインエディタ上で作成したページを公開・更新予約できないことです。私の知る限り、手動で指定時に更新するほかないので、対策があれば教えてください🙇‍♀️

2022年5月、CMSに「公開予約」機能が加わり、CMS記事であれば公開予約できるようになりました🎉


ページにパスワードをかけられない→一部できるようになりました

STUDIOにはFTPの概念がないので、いわゆるBASIC認証なども使えません。

どこからもリンクしない状態でページを作成して、URLを複雑なものにし、さらにnoindex設定を行う程度のことはできますが、URLを知っていれば誰でもみられる状態になります。

2023年4月、「サイトパスワード保護」がリリースされました。サイト全体に対してパスワード保護をかけられます。一部のページのみ保護することはできません。


デザインエディタでは1ページごとに更新できない

既に公開中のサイトで、複数ページに変更がある場合、ある1ページの変更のみを公開する、といったことができません。更新ボタンを押すと、全てのページの変更が公開サイトに反映されます。

このため、ページを変更したい場合は、ページを複製して、別の非公開のページとして作業→OKの段階で差し替えて公開する、という手法をとることになります。

CMSでは各々の記事ごとに変更/公開できますので、エディタ上の一部分をCMSで構成すれば部分的な変更も可能になります。


バージョン管理機能がない→できるようになりました

STUDIOには更新履歴などのバージョン管理機能がありません。また、デザインエディタの「戻る」の挙動も期待した通りには動かないことがあります。このため、大きめの変更がある場合は特にページを複製してバックアップしておくとよいです。

2023年5月、バージョン管理機能がリリースされました。プロジェクト全体に対してバージョン管理できます。ページごとの復元はできませんが、復元プレビューからのコピーペーストで対応は可能です。


サイト内検索機能がない→CMSモデル内で可能になりました

STUDIOにはキーワード検索機能がありませんので、サイト内検索をつけられません。CMSのタグ機能を使えば、指定のタグがついた記事を一覧で表示するということはできます。

2022/11/29追記:「検索ページ」と「検索フォーム」が新たに登場し、CMSアイテムを対象にサイト内検索できるようになりました


コメント欄や会員登録機能がない

STUDIOには、いわゆるブログ記事コメント機能や、会員サイトの作成機能がありません。

ただし、裏技的に、GoogleスプレッドシートとGoogleアクションスクリプトとRSSを組み合わせて掲示板を作った方もいらっしゃいます。


初回アクセス時のみにモーダルを表示する機能がない→カスタムコードで一部対応可能です

初回訪問者のみにモーダルを表示する機能はSTUDIOにはありません。

ただし、カスタムコード機能を使えば実現可能です。

初回訪問時に確認モーダルを出して、「はい」を押した人だけページを見られるようにする


リダイレクト機能がない→一部できるようになりました

ページ移転の際に利用するような、リダイレクト機能がありません。また、wwwのありなし統一のリダイレクト機能もありません。

STUDIO サブドメインから独自ドメインに切り替えた際のドメインリダイレクトのみ効きます。

wwwのありなし統一に関しては、Googleドメインなどのドメイン提供サービス側の設定で実現可能なこともあります。

2022/07/27追記:デザインエディタ上で制作したページに対して、1対1のリダイレクトができるようになりました。


ドメインやメール契約がない

STUDIO純正の(?)直結型のドメイン取得サービスはありません。Googleドメインや Value Domainなど外部のドメイン取得サービスを利用することになります。

また、メール機能もありませんので、独自ドメインでメールを送受信したい場合には外部サービスを利用する必要があります。私のおすすめはGoogle Workspaceです。

いずれにしても直結型のサービスがないことで、ドメイン設定を自分で行う必要があり、人によってはハードルが高いかもしれません。


ページ遷移アニメーションを無効にできない

STUDIOで制作したサイトは、サイト内のページへのリンクをクリックすると、ふわっとしたアニメーションのちにリンク先のページが現れます。このアニメーションは無効にできないため、常にフワフワっと遷移します。

人によっては、表示が遅く感じたり、煩わしく感じて、気になるようです。


デスクトップChrome以外で編集できない

デスクトップChrome以外ではデザインエディタもCMSも使えません。スマホやタブレットで更新できないほか、Chromium系のChrome以外のブラウザでもダメです。


EC関連機能がない

STUDIOにはネットショップなどの機能はありません。もしSTUDIOサイトでショッピングサイトを作りたければ、CMSと、なんらかの「リンクURLから購入を促せるサービス」を組み合わせて使う形になります(JavaScript埋め込みではなくあくまで「リンクURLのみ」で完結するサービス、最近ありますか?汗)

ECを作りたいならSTUDIOを使わずに素直にECプラットフォームを使う方が良いだろうなと思います。

2022年1月7日追記

リンクURLから購入を促せるサービスの情報をいただきました🙏

SQUARE オンラインチェックアウト」はどうでしょう?
STORES 請求書決済」も選択肢としてあります!

引用元:@ryamakuchiさんのツイート


2022年2月1日追記


権限を追加できない

STUDIOのユーザー権限は「オーナー」「編集者」の2種類です。例えば、CMSのみ使える権限や、デザインエディタのみ使える権限などといった権限は追加できません。

2022年2月1日追記:Buisinessプランでは「CMSライター権限」が使えるようになりました。


休業日はサポートに繋がらないから気をつけろ

これは「できないこと」に入れるのも妙かもしれません。しかしながら、土日祝や長期の休みなどはサポートにつながりません。

サイトのオープン日は、平日の日中にすることをおすすめします。万一、SSL設定でコケた場合に、STUDIOの中の人にしか事態を解決できないためです。

※休業日や長期休暇のお知らせが事前にSTUDIO公式サイトに載っていると良いなあと思います…!

以下は、困り度はそれほどでもないけれども細かな点を列挙していきます。

CMS

ページネーションがない

STUDIOでは、一般的な「1, 2, 3, 4, 5...」のようなページネーションが利用できません。「もっと見る」ボタンで追加読み込みする形になります。また、「前へ」「次へ」などのナビゲーションも自動では作成できません。

複数タグを組み合わせの絞り込みができない

タグの絞り込みは1つのみです。キーワード検索ができないこともありますので、高度な検索が必要なサイトには向いていないです。

動的なモーダルページを生成できない

ギャラリーっぽいページで、一覧のサムネイルをクリックしたらモーダルで大きな画像が開く…といった事がCMSではできません。デザインエディタ上で手動でモーダルページを一つずつ作成してそこにリンクすることは可能です。

目次を作れない→できるようになりました!

ブログ記事の中で、記事の見出しを並べた目次を自動で生成したい事がありますが、それはSTUDIO純正機能ではできません。

ただし、Google Tag Managerを活用することにより実現可能です。

記事本文中に「目次」を掲載できるようになりました!(2022/10/4)

RSSフィードを生成できない→できるようになりました!

STUDIOのCMSではRSSを配信できません。

2022年10月19日、機能が追加されました→『更新情報を配信しよう!STUDIO CMSに「RSSフィード」機能が登場。

関連コンテンツやランキングを自動生成できない

ブログでよく見る「関連記事」や「ランキング」には対応していません。

関連記事に関しては、「指定したタグを持つ記事を表示する」機能を使えば作成できますが、関連記事の中から現在表示している記事を取り除けません。

デザインエディタ

Google Fonts/一部TypeSquare以外のフォントに対応していない(2022年1月7日追記)

STUDIOはGoogle FontsとTypeSquareのウェブフォントに対応しています。ただし、TypeSquareはライセンス契約の都合からか、一部のフォントのみ収録されています

LETSなどその他のウェブフォントサービスには対応していません。また、フォント名称を自由入力できないので、システムフォント等も指定できません。

身近な例を出すと、私がコーダーとして請ける仕事では「游ゴシック」を指定されることがありますが、STUDIO版のTypeSquareには游ゴシックが収録されておらず、さらにシステムフォントとしても指定できないため、STUDIOで制作したサイトには游ゴシックは使えない、ということになります。游ゴシックはシステムフォントの場合は色々やっかいなのでそれはそれで実はできれば避けたい…

蛇足ですが、Latoなど日本語文字が収録されていないフォントを選べばフォールバックが働きますので、日本語部分は font-family: sans-serif 相当のシステムフォントで表示できます。

シンボルの内容は個別編集できない→できるようになりました

STUDIOではヘッダーフッターなど、複数のページで共通して使うものをシンボルとして共通化できます。これらのシンボルは全てのページで同じ内容が表示されることになります。特定のページだけで文言を書き換える、ということはできません。WordPressでいう再利用ブロックのようなものです。Figmaでいうコンポーネント機能とは異なります。

ページ上でシンボルを解除すればその箇所は個別に編集できますが、当然のことながら、シンボルを解除することでシンボルの機能を失ってしまいます。

→2023年8月4日(金)追記:シンボル作成時にプロパティを登録することで、スタイルは継承したままコンテンツの上書きが可能になりました!

フォントの一括置換ができない→できるようになりました

あのフォントを使っている場所をこのフォントに一括で置き換えたいとか、特定の色を使っている部分を全部違う色に一括で差し替える、という事ができません。

2022年7月1日、『フォントの扱いが飛躍的に便利に!待望の「Font Styles」機能』にて、フォントの置き換えができるようになりました。


角丸を個別に選択・編集できない→ 2022年1月21日できるようになりました!

ボックスのうちの一つの角を選択して丸みをつける事ができず、全ての角が同じ数値になります。状況に応じて、複数のボックスをくっつけて(ずらして?)対応したり、背景画像でどうにかします。


テキストサイズの相対値指定ができない

テキストサイズとしてemやvwなどが指定できません。ボックスの数値としてはvhやvwも使えます。

無限ループアニメーションができない

アニメーションGIFなどで対応します。

1月13日(木)追記:できるかも

iframeのCustom埋め込みを使うと、HTMLタグに対してインラインのスタイルが当てられるため、色々制約がありますがSVGに対してアニメーションが効くかもしれません。

スクロール量に応じたアニメーションができない

STUDIOでは「スクロールすると出てくる上に戻るボタン」やパララックス効果などは実装できません

パララックスではないものの、背景は固定できます

また、要素が画面内に出現したら、のアニメーションはできます。

表(table)が作れない→CMSでは作れるようになりました

デザインエディタ上では、リストを活用したり、ボックスを何個も重ねることでTableっぽいものは作れます。

2022/11/22追記:CMS記事本文中にテーブル(表)を追加できるようになりました

odd even配色ができない

:first-childはあります

クリックで開閉するアコーディオンが作れない→できるようになりました

よく見るアレが作れません。

2023年6月27日、ドロップダウンメニューやアコーディオンをSTUDIO上で簡単に実装できる「トグル」機能がリリースされました。

改行位置のレスポンシブ調整ができない

スマホとPCで改行位置を変えられません。たくさんボックスを作ってCSSでいうところのinline-box的な振る舞いを与えることは可能です。

画像を見出しタグで囲めない→できるようになりました

画像のボックスは見出しタグで囲めません。テキストのみを見出しにできます。

画像圧縮の有無を選べない

STUDIOでは自動的に画像を最適化してくれます。それはとても助かるのですが、どの画像をどれぐらい圧縮するか等の設定はできません。また、外部サイトへの画像直リンクもできないため、サイトでは常に最適化された画像が表示されることになります。

営業日カレンダーを作れない→カスタムコードで一部対応可能になりました

いわゆる営業日カレンダーは自動では作れないので、iframeでGoogle Calendarを埋め込むか、テキストで休業日などを書いて対応します。だいたいの場合はテキストで間に合うはずです。

2023/06/24追記:純正の営業日カレンダー機能ではありませんが、カスタムコード機能を使うとGoogleカレンダーを任意のデザインで埋め込めます。

GoogleカレンダーをオリジナルデザインでSTUDIOページに表示する


カルーセルの自動再生ができない→できるようになりました

STUDIO純正のカルーセルは、CMSを利用するタイプリストを利用するタイプの両方とも、自動再生ができません。

Google Tag Managerを利用すると裏技的に実装できます。

2023/01/30追記:待望の機能アップデート。STUDIOカルーセルで自動再生が設定可能に!


フォーム

STUDIOでは機能的にシンプルなメールフォームを作成できます。

何か動的な処理が必要になるようなフォーム、例えば見積もり自動計算フォームなどは作れません。

また、フォームの確認ページも作れませんので、凝ったことがしたい場合は別のフォームを利用すると良いです。設備の予約カレンダーなども作れません。

フォームの自動返信メールも純正では対応していませんが、スプレッドシートとZapierの組み合わせでできます

できなさそうで、できること

  1. 雑記
  2. STUDIOで「できないこと」を知っておこう