コード挿入、コード ブロック、カスタムCSSなどのカスタム コード オプションで、サイトのデザインを向上させられます。

サイトをさらにカスタマイズするには、カスタム コードを使用します。カスタム コードを追加する前にコーディングの知識を習得しておくことを強くおすすめします。

ヒント: サイトへのコードの追加は高度な変更であり、Squarespaceサポートの範囲外であることにご注意ください。コーディングの知識をお持ちで、さらにサポートが必要なお客様は、Squarespace Forumにアクセスしてください。より技術的な質問への回答への対応力が高く、クリエイティブな専門家のコミュニティであるSquarespace Circleに参加することもできます。コーディングの知識をお持ちでなく、サイトへのカスタム コードの追加を希望するお客様は、 Squarespace Expertを雇う ことを検討してください。

動画を見る

コード ブロック

特定のページにコード ブロックを追加すると、レイアウトやデザインを変更したり、サードパーティーのウィジェットを埋め込んだり、他のブロックではできないようなページのカスタマイズを行ったりできます。また、コード ブロックを使用して、HTMLやマークダウンをレンダリングしたり、コード スニペットを表示したりすることもできます。

コード ブロックは用途の範囲が広く、HTMLとマークダウンでコードをレンダリングできます。また、コード スニペットを表示するためにも使用できます。以下のようなコードベースのカスタマイズには、コード ブロックを使用するのが一般的です。

• Issuuなどのサービスを通じてドキュメントを埋め込む
• MLS検索を追加する

すべてのプランで、コード ブロックは、プレーン テキスト、HTML、マークダウン、タグで囲まれたCSSコードをサポートしています。

コード ブロックへのJavaScriptやインライン フレームの追加は、コア、プラス、アドバンスの各プランと、一部の旧支払いプランでご利用になれます。詳細については、「適切なSquarespaceプランを選択する」をご参照ください。

コード挿入

コード挿入を使用して、サイトの特定の部分を強化するHTMLとスクリプトを追加できます。これには、ライブ チャット サービス、カスタム メール サービスのドメイン認証、またはサイト分析などが含まれます。

コード挿入は、コア、プラス、アドバンスの各プランと、一部の旧支払いプランでご利用になれます。詳細については、「適切なSquarespaceプランを選択する」をご参照ください。

CSSエディター

CSSエディターを使用すると、組み込みのスタイル設定オプションにはないサイトのカスタマイズを行えます。CSSは、フォント、色、背景を変更する場合にのみ使用してください。それ以外の目的でCSSを変更すると、サイトに問題が生じる場合があります。

CSSエディターはすべてのプランでご利用になれます。

埋め込みブロック

埋め込みブロックを使って、動画、ツイート、Facebookの投稿など、外部コンテンツをサイトに追加します。

埋め込みブロックは、oEmbed Standardを使用する外部サイトやサービスからコンテンツを取得します。より高度でカスタマイズ可能なコードを使う場合には、コード ブロックをご使用ください。

埋め込みブロックはすべてのプランでご利用になれます。

サーバー側コードはサポートされていますか？

いいえ。Squarespaceは、PHP、Ruby、Ruby on Rails、SQLなどのサーバー側コードをサポートしていません。

Squarespace開発者プラットフォーム (バージョン7.0のみ)

Squarespace開発者プラットフォームは、開発者が組み込みのカスタム コード ツールでサポートされる範囲を超えてサイトをカスタマイズするために使用できる高度なツールです。開発者プラットフォームは、高度なコーディング知識を持つユーザー向けに設計されています。すでに開発者プラットフォームを使用している場合は、開発者向けの資料をご覧ください。

開発者プラットフォームは、コア、プラス、アドバンスの各プランのバージョン7.0でのみご利用になれます。

カスタム コードを貼り付けられない場合

コードの貼り付けで問題が発生した場合は、キーボード ショートカットをお試しください。貼り付ける先の領域をクリックして、以下を押します。

カスタム コードが表示されない場合

カスタム コードが表示されない場合はブラウザーを更新してください。それでも問題が解決しない場合、以下が原因として考えられます。

• ログインした状態になっている - セキュリティ対策として、コード ブロック内のコードで訪問者に表示されるものが、ログインした状態のサイト管理者には表示されない場合があります。これは、安全な接続 (https://) 経由で埋め込みJavaScriptを表示しようとすると発生するエラーです。これをテストするには、シークレット ブラウザーでサイトにアクセスしてください。
• コードがインデックス ページにある - インデックス内のページにコードを追加すると、コードがレンダリングされない場合があります。これをテストするには、[ページ] パネル内のインデックスからページを削除し、シークレット ブラウザーでサイトにアクセスします。
• Ajax読み込みを有効にしました - 場合によっては、埋め込みカスタム コード、コードベースのカスタマイズ、アンカー リンク、URLリダイレクトとAjaxが競合することがあります。この問題を解決するには、Ajax読み込みを無効にしてみてください。

それでもコードが正常に動作しない場合は、コードの提供元にお問い合わせください。コードとその標準動作には、提供元が最も精通しているはずです。サードパーティーのコードはSquarespaceサポートの範囲外であるため、これに関してのトラブルシューティングをお手伝いすることはできません。

CORS エラーが発生した場合

ブラウザーからのリクエストにJavaScriptを使用すると、CORS (クロス オリジン リソース共有) エラーが発生します。すべてのリクエストは、必ずサーバー側のアプリケーションから発信する必要があります。CORS リクエストは、当社のサポートの範囲外です。

コーディングのリソース

ここでは、チュートリアル、トラブルシューティング、参照ガイドとして推奨されるWebサイトのうち、人気が高く信頼性のあるサイトをいくつか紹介します。

• W3Schools
• Codecademy
• Mozilla Developer Network
• Stack Overflow
• Shay Howe
• SitePoint
• Treehouse