【AMSケーススタディ】記事をデザインごとコピーする

ケーススタディ既存の記事をデザインごとコピーする

カフェのドリンクのメニューに新しく「自家製レモネード」を追加するので、 商品紹介のデザイン形式をコピーして作りたい。

既存の記事の装飾や表の形式をそのまま使用し、新規記事を作成する場合、文章をそのままコピーすると、設定している装飾の情報がコピーされず、崩れたデザインになってしまうことがあります。

装飾や表形式をそのままコピーしたい場合は、「ソース」と呼ばれる構成情報を流用すると確実です。

ソースの内部情報は難しく見えますが、作業自体は難しいことではないので下記マニュアルをご参考にぜひ挑戦してみてください。

※同一ページ内であれば、記事の複製ができますので、下記マニュアルをご参考ください。

記載されているソースコードを誤って消してしまうと、表示が崩れてしまうことがあります。
AMSカスタマーセンターでは、ソースコードを誤って変更してしまった場合の復元作業は行っておりませんので、ソースコードの編集作業前に、必ずバックアップを行ってください。

事前準備

このケーススタディをお試しいただくには、コピー元に指定されている記事の画像と同じサイズで画像ファイルを準備しておく必要があります。

また、画像サイズは「ファイル管理」のファイル一覧からご確認いただけます。

画像ファイルのアップロード方法はこちら

画像の拡大・縮小方法はこちら

画像の切り抜き方法はこちら

＊はじめに

左上部の「ページ管理」から、コピーしたい記事があるページに移動しておきます。

1.コピー元記事の「記事を編集」の画面を開く

AMSにログインし、ページの編集画面に移動します。
コピー元となる記事にカーソルを合わせると記事がピンク色に変わり、「記事を編集」と表示されますので、記事をクリックします。

AMSへのログイン方法はこちら

2.ソースを開く

記事を登録の画面が開けましたら、「本文」にある「ソース」のボタンをクリックします。
マニュアルの後半で画像の配置を設定するのでこの際に元記事の画像配置のタイプを確認しておきましょう。

クリックするとこのような文字の羅列が表示されているかと思います。
この文字の羅列が「ソース」になります。

3.ソースをコピーする

テキストエリア内をクリックし、テキストエリアを選択します。

テキストエリア内に点滅する縦棒「｜」が出ている状態で
Windowsであればctrl+a（ctrlキーを押しながらa）
Macであればcommand+a（commandキーを押しながらa）
を押して全選択状態にします。

画像のようになれば成功です。

そのまま青く選択された部分で右クリック→コピー、
もしくはWindowsであればctrl+c（ctrlキーを押しながらc）
Macであればcommand+c（commandキーを押しながらc）
で選択した部分をコピーします。

コピーしたら右上の「閉じる」で画面を閉じます。

4.バックアップの作成

ここで念のためバックアップをとりましょう。
画像のようにPC上のメモ帳を起動し、メモ帳にコピーしたソースを貼り付けてください。
こちらは、バックアップは間違えてソースを崩してしまった時の保険です。
デザインを崩してしまった時には、崩れたデザインの記事でソースモードに切り替え、ソースを全て消し、改めてバックアップしたソースコードを貼り付ければ状態を元に戻すことができます。

ケーススタディ記事にclassの設定がある場合はコピーする

ソースモードで記事を作成してもclassの記載を忘れると装飾は反映されません。テキストと同様にバックアップを取りましょう。