画像の差し替え、もっと手軽にできませんか?
ホームページの更新作業の中でも、意外と頻繁に行うのが「画像の差し替え」です。新しいキャンペーンバナーを入れたり、季節のイメージ写真を入れ替えたりと、画像はサイトの印象を左右する重要な要素です。
しかし、そのたびに画像を一度削除して、新しい画像を挿入して、サイズや配置を調整して……という作業は、少し面倒に感じる方も多いのではないでしょうか。



画像の消去、挿入はすこし面倒。。
そんなときに使える「画像差し替えテクニック」
ここでは、PAGEKitで画像をよりスムーズに差し替えるためのテクニックを3つご紹介します。ちょっとした工夫で、日々の更新作業がぐっと効率化されます。
テクニック1:画像を選択した状態で新しい画像を挿入
最も簡単でおすすめなのが、この方法です。差し替えたい画像をクリックして選択状態にしたまま、画像挿入の操作を行うと、自動的に元の画像と置き換わります。
これなら、いちいち画像を削除する手間が省け、操作もスムーズ。1~2枚の差し替えなら、この方法だけで十分でしょう。



テクニック2:「画像の挿入・編集」機能でURLを入れ替える
画像の挿入・編集ボタンを使えば、画像そのものを削除せずに差し替えることが可能です。特に「画像URLを直接指定して差し替えたい」ときに便利です。
画像URLをコピーするには
画像挿入のウィンドウや画像の管理画面では、URLコピーボタンがついています。ボタンをクリックすると画像URLがコピーできます。

ボタンをクリック!
コピーしたURLを貼り付け
画像を選択して「画像の挿入・編集」をクリックすると画像のURLが表示されます。ここに先ほどコピーしたURLを貼り付けて入れ替えます。

注意点:サイズ指定が実寸に変わる
この方法の注意点として、差し替え後の画像に「幅」「高さ」がピクセル指定で自動入力されることがあります。スマホ対応を意識するなら、幅を100%などに書き換えることをおすすめします。

サイズは調整しましょう!
テクニック3:HTML部分編集でsrc属性を直接変更
もう少しテクニカルな方法になりますが、画像を選択して「HTML部分編集」を使えば、より柔軟な差し替えが可能です。
画像を選択して「HTML部分編集」をクリック
画像を選択し「HTML部分編集」をクリックします。HTML部分編集は、該当部分のHTMLを直接編集できる高度な機能です。

画像を選択してHTML部分編集ボタンをクリック!
src属性を入れ替えるだけ
表示されたHTMLタグ内の <img src="..." /> の部分を、新しい画像URLに置き換えれば、それだけで差し替え完了です。サイズなど他の情報はそのまま残るため、デザインを崩さずに画像だけを変更できます。

こんな時におすすめ
・画像のサイズ指定や装飾を変えたくない
・一度に複数の画像を一括で入れ替えたい
・HTML編集に慣れている方
・一度に複数の画像を一括で入れ替えたい
・HTML編集に慣れている方
まとめ:ちょっとした工夫で編集がもっとスムーズに
画像差し替えの作業は、一見単純に見えても、やり方ひとつで時間と手間が大きく変わります。今回ご紹介したテクニックは、どれも簡単に実践できるものばかりです。
「画像の入れ替えが面倒…」と感じたことのある方は、ぜひこれらの方法を試してみてください。編集のストレスがぐっと減り、もっと自由にホームページを更新できるようになるはずです。
ABOUT ME ![]() PAGEKit編集部 ホームページを最短15秒で作れる!PAGEKitは、誰でもかんたんにホームページを作成・管理できるサービスです。 私たちPAGEKit編集部は、ホームページをもっと便利に、もっと楽しく使っていただけるよう、日々TIPSや活用アイデアを発信しています。 |
ホームページかんたん作成のPAGEKit(ページキット)![]() ホームページを作るのは、むずかしそう。 そう思っていた方も、PAGEKitなら「意外とカンタンだった」と感じていただけるはずです。 専門知識がなくても、必要なページがすぐに揃うテンプレートと、やさしい操作画面。 まずは一度、実際の使いやすさを体験してみませんか? |