2021-12-21

Craft CMS 操作マニュアル:アセットの編集

このエントリは Craft CMS Advent Calendar 2021 21日目のエントリーです。

アセットの編集について。

アセットの編集はアセットの詳細画面、一覧画面から編集メニューを表示することができる。

編集画面の表示

エントリのアセットフィールドでアセットのファイル名をクリックするか、アセット一覧のアセットの編集をクリックすると、右からアセットのタイトル、キャプション、alt用テキストの編集メニューが表示される。

20211215 0949

エントリ選択の時のように、右上のアイコンをクリックすると画像のプレビューリンクや、画像の編集へのリンクが表示される。

20211215 0950

画像の編集(加工)については後ほど。

ファイル名の変更

一覧からアセットにチェックを入れて、「ファイル名を変更する」をクリックすると、アセットのファイル名を変更できる。

20211215 0952

ファイルの置き換え

ファイルの置き換えを選択すると、ローカルのファイルを選択する画面が立ち上がるので、そこでファイルを置き換える事ができる。

差し替え前。

20211215 0957

選択された画像のサムネイルが山というか平原ぽいものであるのを確認できる。
画像をダブルクリックして編集画面を開く。

ファイルを雪原の画像に置き換える。

20211215 0958

選択されている画像のサムネイルが雪原の画像に変わっているのを確認できるし、ダブルクリックして開くと、当然、雪原の画像になっている。

20211215 0959

ファイルを置き換えると画像のURLは画像のファイル名によって変わるので、ファイル名ベースでリンクさせている場合などは注意が必要になる。

元々の画像は404になる。
なので、同名で差し替えた方が安全だと思われる。

URLをコピー

URLをコピーをクリックするとこのような感じでURLをコピーできる。

20211215 0955

参照タグ

URLが変わると困るときとかに、参照タグ(アセットのリンク)を使う事ができる。

20211215 0956

画像の加工

画像の編集から、編集を選択する。(日本語的にややこしい)

20211215 1000

クリックするとこのように画像の加工画面が表示される。

20211215 1002

画像の回転

画像の回転、反転ができる。

左に回転したところ。

20211215 1002 1

画像のサムネイルを生成する際の焦点位置を設定することができる。

20211215 1003

画像の切り抜き

画像をトリミングすることができる。

20211215 1003 1

自由に画像のサイズを指定してトリミングする。

20211215 1003 2

正方形など決まったサイズでのトリミングもできる。

20211215 1004

加工した画像はそのまま上書きして保存することもできるし、別のアセットとして保存することもできる。

正方形にトリミングした画像を「新しいアセットとして保存」した例。

20211215 1005

高度な編集はむずかしいが、トリミング等をすることでコンテンツとして管理する画像は自由に編集ができる。