公開中のサイトをリニューアルする方法

既にStudioでサイトを公開中の場合に、リニューアルする方法を4パターンご紹介します。本記事でご紹介する方法は一例となります。サイトの状況に応じてご検討ください。

1. 新旧プロジェクトを切り替えてリニューアルする場合

新しいプロジェクトでリニューアル後のサイトを構築し、旧プロジェクトのドメインを新しいプロジェクトに設定する方法です。

注意：

ドメインの解除・再登録の際に、旧プロジェクトのダウングレードと新プロジェクトのアップグレードが必要です。新プロジェクトが用意できたら、次の手順でプラン変更を行います。

登録したドメインの解除・再登録が必要です。

この方法は、早期に完成できる小規模なサイトの場合におすすめです。

サイト公開後に行なったエディタ上での変更は、サイト更新するまで公開サイトには反映されません。そのため、既存のページをそのまま編集して準備ができたタイミングでサイトを更新する方法でリニューアルできます。

この場合ダウンタイムは発生せず、CMSデータやAppsの設定等も引き続き利用できます。しかし、リニューアル後のデザインが完全に完成するまでサイトを更新できなくります。

プロジェクト内でリニューアル用のページを新たに作成し、公開するタイミングで差し替える方法です。サイトが大規模でリニューアルに時間がかかる場合にご検討ください。

リニューアル用のページを追加または複製し、ページの公開範囲設定を非公開にします。

準備が整ったら、まず公開中のページのパスを全て変更、またはページを削除します。

リニューアル用の各ページのパスを、正式な文字列に変更します。

※ポップアップが表示された場合、チェックが入った状態で「更新」を選択します

作業が完了したら、サイト内リンクなどの動作をライブプレビューで確認します。

各ページの公開範囲設定を全員にし、サイトを更新します。

注意：

別プロジェクトでリニューアルデザインを作成し、デザインをコピーして移動する方法です。

注意：コピー＆ペーストで引き継げるデータは、ページ内のデザイン要素のみです。CMSダッシュボード内のデータは、新規作成する必要があります。

また、プロジェクトに依存する一部情報は引き継ぐことができません。

＜引き継ぐことができないデータの一例＞

新デザイン作成用のプロジェクトを用意する
プロジェクトを新規作成または、公開中のプロジェクトを複製し、リニューアルデザインを作成します。
新デザインのレイヤーをコピーする
リニューアルデザイン作成後、各ページのレイヤーパネルから <div> Base レイヤーをコピー（Mac：⌘+C、Windows：Ctrl + C）します。
公開中のプロジェクトのデザインを空にする
公開中のプロジェクトへ移動し、ページ上の不要なボックスを削除します。
公開中のプロジェクトに新デザインをペーストする
コピーした <div> Baseレイヤーを、ペースト（Mac：⌘+V / Ctrl + V）して移行します。コピーしてきたコンポーネントは、新しいコンポーネントとしてプロジェクト内に自動的に追加されます。
貼り付けたレイヤー構造を整理する
ペーストした<div> Baseの、グループ化を解除（Win：ctrl+shift+G、Mac：⌘+shift+G）して削除ます。
固定位置の設定がされた要素は、ペーストでの移動後にも固定設定自体は維持されていますが、Baseレイヤーの直下でなければ固定されません。
リンクやサイト設定を必要に応じて設定し直し、動作をライブプレビューで確認します。
問題がなければ、サイトを更新して公開します。