当サイトは第三者配信の広告サービス(アフィリエイト広告、アドセンス広告)を利用しています。

WordPressテーマSWELLで画像を挿入する方法3つ!【図解付き】失敗談つき

SWELLで画像を挿入する方法|wordpressブログ運営図解付き

今やサイトやブログには写真や画像はつきものですよね。必ず複数挿入すると思います!簡単な操作で挿入することができるのですが、画像挿入には3つの方法があり、どれを使ったらよいか悩みます。

私も、悩んでしまって正しい使い方をせずに失敗した経験があります。私のように失敗する前に正しい画像の貼付けをし、効率的にブログ運営をしてください。

この記事でわかること

  • SWELLで画像の挿入の仕方3つの方法がわかる
  • SWELLどの方法で画像を挿入したらよいかわかる
  • 画像を貼り付けるのにどんな失敗をするかがわかる

\ おしゃれなサイト作りしてみませんか? /

目次

画像を貼り付ける3つの方法

画像を挿入する方法をブロックエディターから呼び出す

投稿編集ページで、画像のブロックエディターをよびだして操作を選択することができます。

  • アップロード
  • メディアライブラリ
  • URLを挿入
Wordpressテーマ SWELL 画像をはりつける ブロックエディターから呼び出す
WordPressテーマ SWELL 画像をはりつける ブロックエディターから呼び出す

1.アップロード

Wordpressテーマ SWELL 画像をはりつける アップロード
WordPressテーマ SWELL 画像をはりつける アップロード

アップロードを選択すると、パソコンなどのデバイスに保存している画像ファイルを転送することができます。

2.メディアライブラリから呼び出す方法

Wordpressテーマ SWELL 画像をはりつける メディアライブラリ
WordPressテーマ SWELL 画像をはりつける メディアライブラリ

メディアライブラリに保存されている画像を貼り付ける場合に利用します。

3.URLを入力して挿入することができます

Wordpressテーマ SWELL 画像をはりつける URLから挿入
WordPressテーマ SWELL 画像をはりつける URLから挿入

他サイトなどの画像を挿入したいときに使用します。

SWELLで画像を貼り付けた後編集する

ブロックツールバーを表示させる

画像を選択して、左クリック→ブロックツールバーが表示されます。そこに表示される機能で、画像を編集することができます。

Wordpressテーマ SWELL 画像をはりつける ブロックツールバー表示
WordPressテーマ SWELL 画像をはりつける ブロックツールバー表示

画像を編集する

さまざまな変換やスタイルを変更することができます。

Wordpressテーマ SWELL 画像をはりつける 変換やスタイル変更ができる
WordPressテーマ SWELL 画像をはりつける 変換やスタイル変更ができる

ギャラリー

画像をギャラリーに変換することができます。おしゃれな雰囲気がでます。

Wordpressテーマ SWELL 画像をはりつける ギャラリー
WordPressテーマ SWELL 画像をはりつける ギャラリー

リッチカラム

画像を貼り付けたあとにカラムを増やすことができます。ギャラリーサイトやショッピングサイトでおしゃれな演出をしてくれます。

Wordpressテーマ SWELL 画像をはりつける リッチカラム
WordPressテーマ SWELL 画像をはりつける リッチカラム

グループ

グループ選択することで、枠の装飾などを変更することができます。サイトの雰囲気にあったデザインにできます。

Wordpressテーマ SWELL 画像をはりつける グループ
WordPressテーマ SWELL 画像をはりつける グループ

移動方法

画像の位置を上や下に移動させることができます。

Wordpressテーマ SWELL 画像をはりつける  移動
WordPressテーマ SWELL 画像をはりつける  移動

デュオトーン

デュオトーンでツートンカラーに変換することができます。さまざまな色でためしてみてください。

Wordpressテーマ SWELL 画像をはりつける デュオトーン
WordPressテーマ SWELL 画像をはりつける デュオトーン

画像の位置を変更

画像を左寄せや中央にそろえたりすることができます。幅広で大画像にすることができます。

Wordpressテーマ SWELL 画像をはりつける 配置変更
WordPressテーマ SWELL 画像をはりつける 配置変更

画像ページへリンク

画像に設定されているURLへリンクすることができ、メディアで表示されます。

Wordpressテーマ SWELL 画像をはりつける 画像ページへリンクできます
WordPressテーマ SWELL 画像をはりつける 画像ページへリンクできます

キャプション設定

画像の説明を追加することができます。太文字など簡単な文字の装飾をすることができます。

Wordpressテーマ SWELL 画像をはりつける キャプション設定できる
WordPressテーマ SWELL 画像をはりつける キャプション設定できる

トリミング

画像をトリミングすることができます。細かいことはできませんが、おおまかな部分はまかなうことができます。

※細かく設定したい場合は、画像編集アプリで編集後アップロードすることをおすすめします。

Wordpressテーマ SWELL 画像をはりつける トリミング
WordPressテーマ SWELL 画像をはりつける トリミング

画像サイズを変更する

画像を選択してドラックすることで簡単に画像のサイズを変更することができます。

Wordpressテーマ SWELL 画像をはりつける 画像の大きさを変える
WordPressテーマ SWELL 画像をはりつける 画像の大きさを変える

画像に文字をいれる

貼り付けた画像に文字を入力することができます。文字位置を四方八方にかえることができますし、リンクの設定や文字装飾も可能です。

Wordpressテーマ SWELL 画像をはりつける 画像に文字を入れる
WordPressテーマ SWELL 画像をはりつける 画像に文字を入れる

フルハイト

フルハイトで画像の見え方をかえることができます。

Wordpressテーマ SWELL 画像をはりつける フルハイトきりかえ
WordPressテーマ SWELL 画像をはりつける フルハイトきりかえ

デバイスコントロール

Wordpressテーマ SWELL 画像をはりつける デバイスコントロール
WordPressテーマ SWELL 画像をはりつける デバイスコントロール

ブロック間隔の設定

次のブロックとの間隔をかえることで、読者への伝わり方がかわることもあります。

Wordpressテーマ SWELL 画像をはりつける 画像と次のブロックの幅の設定
WordPressテーマ SWELL 画像をはりつける 画像と次のブロックの幅の設定

画像の置き換え

同じ設定内容で画像だけを変更することができます。

Wordpressテーマ Wordpressテーマ SWELL 画像をはりつける 画像を置き換える
WordPressテーマ SWELL 画像をはりつける 画像を置き換える

私が画像貼り付けで失敗したこと

画像を貼り付けるだけで、何を失敗するの?と疑問に思われるかとおもいます。あまり考えずに操作していたのが原因です。

画像の貼付けをメディアライブラリのURLをコピーして、URLで挿入する方法にしていました。

そうです、他サイトではないのにアップロードしている画像のURLを使用して画像を貼り付けていたのです。それによりアップロードをするメッセージが表示され、書いてあるとおりにアップロードしていました。

Wordpressテーマ SWELL 画像をはりつける アップロードを推奨される画面
WordPressテーマ SWELL 画像をはりつける アップロードを推奨される画面

そのために大変だったことは次のとおりです。泣く泣く直しました!

  • メディアライブラリにおなじ画像が2つ存在
  • 設定していた代替テキスト、タイトル、キャプション、説明が変更または消滅していた
  • サイトに貼り付けている画像のキャプションが消えたので再度入力する手間がかかった

画像の貼付けは他サイトのものを使用しないのであれば、『アップロードかメディアライブラリの画像を選択する』ようにしてください。

まとめ

この記事では、SWELLで画像を貼付けつ方法とその後の画像編集について説明しました。こんなことまでできるのかと本当に驚くばかりです。サイト運営をする人の6割以上がSWELLを使用しているというのに納得です。

しかも、企業のサイトつくりでもえらばれているSWELLを使ってみませんか?2023年10月からのステマ規制に対応したアップデートもおこなわれているので、初心者にもやさしいブログテーマです。

この記事をかくことで、さらにSWELLが好きになりました

\ おしゃれなサイト作りしてみませんか? /

人気ブログに参加しています!

人気ブログランキングでフォロー

★投稿の励みになりますので是非フォローお願いします★

SWELLで画像を挿入する方法|wordpressブログ運営図解付き

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
目次