質問デザインが苦手です。SWELLは、画像のカスタマイズはできますか？
SWELLは、ブログ初心者でも美しいサイトが作れます。
美しいサイトが作れる理由は、画像カスタマイズができることが一因です。
そこでこの記事は、SWELL歴3年目の私が、SWELLでできる画像カスタマイズを3つ紹介します。
この記事を読めば、PhotoshopやCanva（キャンバ）のような、画像編集ソフトに課金せずに済みます。
やたろう時間とお金が節約できたので、GRCなどの分析ツールに投資ができました。
この記事を書いている人
- ConoHaWINGユーザー4年目
- SWELLユーザー3年目
- SEO検定一級合格
- 月収6ケタ（プラチナランク）
- 某ASPの社員
スクロール＆拡大できます
画像のカスタマイズができる箇所【フィルター処理】
SWELLで画像をカスタマイズできる箇所は、3つあります。
それぞれ解説します。
メインビジュアルの画像
1つ目は、メインビジュアル部の画像です。
「メインビジュアル」とは、トップページを開いたとき、最初に目に入るエリアです。
SWELLは、メインビジュアル内の画像を、クリックだけで、カスタマイズできます。
メインビジュアルの出し方は、「カスタマイズ」をクリック。
「トップページ」→「メインビジュアル」と進みます。
メインビジュアルの画像カスタマイズは「フィルター処理」より、以下選択できます。
上記動画は、各フィルターを画像に適用した動画です。
画像が、どんな見た目になるか、ざっくり把握できます。
それぞれ解説します。
ブラー
ブラー処理は、画像全体に「ぼかし」を加えるフィルタです。画像をぼかすことで、柔らかくおしゃれな見た目になります。
グレースケール
グレースケールは、画像を白と黒の濃淡だけで表現するフィルタです。グレースケールを利用することで、モダンでシックなトップページを作成できます。
ドット
ドットは、画像にドット効果を適用するフィルタです。ドットを適用することで、レトロでアートな外観を作れるメリットがあります。
ブラシ
ブラシは、画像に、筆や手書き効果を加えることができるフィルタです。ブラシを画像に適用することで、かすれた画像になり、ダサい素材でもオシャレに見えます。
SWELLは、メインビジュアルの画像（動画）に、ブラシ、ドット状のテクスチャ、カラーオーバーレイを加えることができます。
オーバーレイ
オーバーレイカラーは、フィルタ処理した画像の上から、好きな色のカラーオーバーレイを「任意の不透明度で被せることができる機能」です。
※オーバーレイカラーとは、複数枚の画像データを重ねて合成すること
例えば「ドット」に白の不透明度をかぶせることで、白いドット画像が作成で手軽に作成できます。
投稿、固定ページの画像
２つ目の画像カスタマイズは、投稿、固定ページの画像カスタマイズです。
SWELLは、画像と動画に、6つのスタイルをかけられます。
画像にスタイルをかけた実例
例えば、画像を丸くすることで、やわらかい印象に変更できます。また、Photoshop（フォトショップ）不要で画像修正できるので、時短にも繋がります。
特に便利なのが「デスクトップ風」のスタイルです。画像や動画をデスクトップ風にすることで、モックアップが簡単に作成できます。
「デスクトップ風」のすごいところは、スクロールさせることができること（画像参照）。
ココがポイント上記スクロールは、600px3000pxの画像で作成しております。
スクロール表示するための手順は、以下2ステップです。
縦長（1000ピクセル以上）の画像を用意して、投稿ページに配置します。画像は「フルサイズ」に変更します。
縦長画像をグループ化します。その後「ブラウザ風」または「デスクトップ風」のスタイルを適用する
- Webサイト紹介モックアップ
- デザインモックアップ
- SWELLユーザーとの差別化
モックアップ画像は、SWELLだけの特権。そのため、ライバルサイトと差別化できます。結果的に、SEOに有利に働きます。
有料テーマ別に、画像スタイルの種類を比較
| テーマ画像 |  |  |  |  |  |
| テーマ名 | AFFINGER6 | SWELL | THE SONIC | SANGO | JIN |
| 価格（込） | 14,800円 | 17,600円 | 8,580円（1年） | 11,000円 | 14,800円 |
| 画像スタイル | ・デフォルト ・角丸 ・シャドウ ・ワイド ・枠線 ・ポラロイド風 | ・デフォルト ・角丸 ・枠あり ・影あり ・フォトフレーム ・ブラウザ風 ・デスクトップ風 | ・デフォルト ・角丸 | ・デフォルト ・角丸 ・影（小） ・影（大） ・枠線 | ・デフォルト ・角丸 |
| 総合評価（スコア） | (4.5 / 5.0) | (5.0 / 5.0) | (3.0 / 5.0) | (4.0 / 5.0) | (3.0 / 5.0) |
| URL | 詳細を見る | 詳細を見る | 詳細を見る | 詳細を見る | 詳細を見る |
SWELLは、画像スタイルが多いため、美しいサイトに仕上がります。
SWELLの便利さを証明するため、有料テーマ別に画像スタイルの種類を比較してみました。
それぞれ解説します。
AFFINGER6 （アフィンガー6）
デフォルト画像です
画像を丸くできるスタイルです。柔らかく丸みのある印象を与えます。ただし、アフィンガー6は、角の丸みが小さめ
画像に影を配置できるスタイルです。影を加えることで、画像を目立たせる効果や強調することができます。
画像の横幅が長くなるスタイルです。小さい画像を大きく表示させたいときに利用します。
画像に枠を配置できるスタイルです。枠をつけることにより、画像や要素を強調することができます。
画像をポラロイド風に枠をつけるスタイルです。視覚的なコントラストが生まれるため、注目されやすくなります。
アフィンガー6は、6つの画像スタイルに対応しております。シャドウや枠線など、基本スタイルがそろっているので、柔軟なカスタマイズが可能です。
JIN（ジン）
デフォルト画像です
画像を丸くできるスタイルです。柔らかく丸みのある印象を与えます。ただし、JINは、角の丸みが小さめ
JINは、角丸しかないです。そのため、枠や影は、別途CSSで設定する必要があります。
SANGO（サンゴ）
デフォルト画像です
画像を丸くできるスタイルです。角丸の画像は、柔らかく丸みのある印象を与えます。女性サイト、動物サイトなどと相性良し。
画像に影を配置できるスタイルです。影を加えることで、画像を目立たせる効果や強調することができます。
画像に影を配置できるスタイルです。影のついた要素は、周囲との視覚的なコントラストが生まれるため、注目されやすくなります。
画像に枠を配置できるスタイルです。枠をつけることにより、画像や要素を強調することができます。
SANGO（サンゴ）は、影や枠線など、基本的なスタイルの適応ができます。
THE SONIC（ソニック）
デフォルト画像です
画像を丸くできるスタイルです。角丸の画像は、柔らかく丸みのある印象を与えます。
THE SONIC（ソニック）は、角丸しかないです。そのため、枠や影は、別途CSSで設定する必要があります。
SWELL（スウェル）
デフォルト画像です
画像を丸くできるスタイルです。角丸の画像は、柔らかく丸みのある印象を与えます。
画像に枠を配置できるスタイルです。コンテンツや商品の写真などで重要な要素を枠で囲むことで、注目度や関心を高めることができます。
画像に影を配置できるスタイルです。影のついた要素は、周囲との視覚的なコントラストが生まれるため、注目されやすくなります。
フォトフレームは、写真のようなフレームを画像に配置できるスタイルです。
ブラウザ風は、パソコンのブラウザ枠を配置できるスタイルです。
デスクトップ風は、デスクトップ画面を画像に配置できるスタイルです。
デスクトップ風、ブラウザ風は、SWELLだけができる強みです。
モックアップ画像は、記事にメリハリがついて、読者の理解を促進させるため、成約率が高くなります。
そのため、
- 「商品購入手順記事」が多い
- 「〇〇する方法」などの記事が多い
こんなブログを始めたい人に、SWELLはおすすめです。
SWELLバナーリンク
SWELLバナーリンクとは、画像にリンクを設置できる機能です（ブロックエディタのデフォルト機能）。
ブログ初心者の方にとって、バナーを作るのに時間がかかることがあります。そのため、記事作成の進行が遅れてしまい、ブログを続けることが難しくなる場合もあります。
そんな時、SWELLバナーリンクを使うと便利です。
例えば、
- 画像にオーバーレイを設定
- 画像に丸みを持たせる
- 画像の上に文字リンクを配置する
など、画像のカスタマイズできます。
SWELLは、画像編集ソフト不要でブログができる【まとめ】
まとめです。
SWELLは、画像編集ソフト不要でブログができる、コスパの高いワードプレステーマです。
SWELLでブログを始めることで結果的には、
- 商品レビュー記事作成がサクサク進む
- 画像の修正工数が少なくなる
- 差別化できるのでSEOがあがりやすい
といったメリットを得られます。
もう、ブログで画像加工に悩みません。記事作成もサクサク進み、月5万円なんて簡単に稼げるようになります。
やたろうお金を気にせずに飲みに行けることが、SWELLにしてよかった点です。