[手順3-3]カスタマイズメニューで画像素材をブログに設定

 作った画像素材を早く反映させたい人は多いでしょう。今回はSWELL設定で画像素材をブログに設定する方法の記事を書きます。これで画像反映され自分らしい見た目のブログにすることができます。

目次

サイトアイコンの設定

あおい(管理人)

画像の設定方法はテーマによって様々です。
以下はSWELLを使用している場合の設定手順です。

STEP
カスタマイズ

 ダッシュボードの上部のメニューから「カスタマイズ」を選びます。

カスタマイズ
STEP
WordPress設定

 画面の左側にメニューが出てくるので「WordPress設定」を選びます。

WordPress設定
STEP
サイト基本情報

 WordPress設定の中の「サイト基本情報」を選びます。

サイト基本情報
STEP
サイトアイコンを選択

 サイト基本情報の設定項目の中の「サイトアイコンを選択」を選びます。

サイトアイコンを選択
STEP
画像素材をドラッグ&ドロップ

 メディアライブラリが表示されるので、作成したブログ用画像素材をドラッグ&ドロップします。

画像素材をドラッグ&ドロップ
STEP
サイトアイコン用の画像

 アップロードした画像素材からサイトアイコン用の画像を選びます。

サイトアイコン用の画像
STEP
切り抜き画面

 画像のサイズが少しずれいた場合は切り抜き画面が表示されますので、右下の「画像切り抜き」のボタンを押します。

切り抜き画面
STEP
メニューを戻す

 サイトアイコンの設定が完了しますので、画面上部の「<」を押して戻ります。

メニューを戻す
STEP
更にメニューを戻す

 更にもう一度、「<」を選んでメニューを戻します。

更にメニューを戻す

NO IMAGE画像の設定

STEP
サイト全体設定

 カスタマイズメニューのトップに戻っているので、「サイト全体設定」を選びます。

サイト全体設定
STEP
NO IMAGE画像

 サイト全体設定のメニューの中から「NO IMAGE画像」を選びます。

NO IMAGE画像
STEP
画像を選択

 NO IMAGE画像の設定画面が表示されるので、「画像を選択」を選びます。

画像を選択
STEP
NO IMAGE画像用

 メディアライブラリが開きますので、NO IMAGE画像用として作成した画像を選びます。

NO IMAGE画像用
STEP
画像を選択

 画像の選択を行うと画像にチェックマークが入るので、右下の「画像を選択」ボタンを押します。

画像を選択
STEP
メニューを戻す

 NO IMAGE画像の設定が終わりましたので、画面上部の「<」ボタンを押してメニューを戻します。

メニューを戻す

タイトル背景用デフォルト画像の設定

STEP
コンテンツヘッダー

 サイト全体設定の画面になっているので、「コンテンツヘッダー」の項目を選びます。

コンテンツヘッダー
STEP
タイトル背景用デフォルト画像

 タイトル背景用デフォルト画像の設定項目にある「画像を選択」を選びます。

あおい(管理人)

例では素材の準備の手間削減のため、NO IMAGEと同じ画像にしています。

タイトル背景用デフォルト画像
STEP
画像ファイルの選択

 タイトル背景用デフォルト画像用の画像ファイルを選びます。

画像ファイルの選択
STEP
画像を選択

 画像が選ばれますので、右下の「画像を選択」ボタンを押します。

画像を選択
STEP
メニューを戻す

 タイトル背景用デフォルト画像の設定か完了しましたので、メニュー左の「<」ボタンで戻ります。

メニューを戻す
STEP
更にメニューを戻す

 サイト全体設定の画面になりますので、更に「<」ボタンでメニューを戻します。

更にメニューを戻す
あおい(管理人)

画像設定はもう少しです。
頑張りましょう。

タイトルロゴの設定

STEP
ヘッダー

 設定メニューの中から「ヘッダー」を選びます。

ヘッダー
STEP
画像を選択

 ヘッダーロゴの設定の中にあるロゴ画像設定の下の「画像を選択」を選びます。

画像を選択
STEP
タイトルロゴ

 タイトルロゴ用に作成した画像を選びます。

タイトルロゴ
STEP
画像を選択

 画像を選び終わったら、右下にある「画像を選択」ボタンを押します。

画像を選択
STEP
メニューを戻す

 ロゴ画像の設定も完了しましたので、上部メニューにある「<」を選びます。

メニューを戻す

メインビジュアルの設定

STEP
トップページ

 カスタマイズメニューの「トップページ」を選びます。

トップページ
STEP
メインビジュアル

 トップページの設定メニューが表示されますので、「メインビジュアル」を選びます。

メインビジュアル
STEP
メインビジュアルの設定

 メインビジュアルの設定項目が表示されますので、画面を下にスクロールさせます。

メインビジュアルの設定
STEP
スライド画像の選択

 各スライドの設定の項目のスライド[1](PC)の画像を選択を選びます。

スライド画像の選択
STEP
メインビジュアル用画像

 メディアライブラリが表示されますので、メインビジュアル用に作成した画像を選びます。

メインビジュアル用画像
STEP
画像を選択

 画像を選び終わりましたら、右下の「画像を選択」ボタンを押します。

画像を選択
STEP
公開

 メインビジュアルの設定が終わりましたので、メニュー右上の「公開」ボタンを押します。

あおい(管理人)

下にある「メインテキスト[1]」は画像の上に表示される文字です。
一緒に自分のサイトに合ったテキストに変えると良いと思います。

公開
STEP
カスタマイズメニューを閉じる

 メニューを左上の「×」ボタンで閉じることができます。

カスタマイズメニューを閉じる

まとめ

 今回は、SWELL設定で画像素材をブログに設定する方法についての記事を書きました。ポイントをまとめると下記の通りとなります。

  1. 各種画像の設定はカスタマイズメニューから設定する
  2. 画像の設定については選んだテーマによって設定方法が大きく変わる
  3. これらの設定を完了すれば非常に自分のサイトらしい見た目になる

 つまり、作った画像素材を早く反映させたい場合には上記のステップに従って一気に画像を設定することがおすすめです。そのため、前回までのステップを参考に画像を準備しておきましょう!

 SWELLの他の見た目変更設定でどこを変更すれば良いかに興味がある人は、下記の記事もチェックしてください。

あわせて読みたい
[手順3-4]SWELLのカスタマイズのキーポイント SWELLの設定を自分好みに設定したい人は多いでしょう。今回はSWELLのカスタマイズのキーポイントの記事を書きます。これで基本を学んであとは自分好みに調整することができます。
よかったらシェアしてね!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次