[WordPress] STINGER8の「サイトのタイトル」をロゴ画像に変更する

2018年8月2日2018年12月4日

WordPress「STINGER8」のテーマを使用している場合、管理画面からロゴに画像を使用することができません。（「サイトのタイトル」という形で文字でなら指定ができます）

今回は「STINGER8」でロゴに画像を使用する手順をまとめました。

コンテンツ

1. 作業時間
2. 作業手順

作業時間

15分程度でした。

ロゴ作成時間は含めていません。

また、WordPressサーバにFTPクライアントやレンタルサーバのFTPサービスの接続設定も含めていません。

作業手順

テーマに「STINGER8」と「STINGER8 Child」をインストールする

「STINGER8 Child」を「有効化」にします。「STINGER8」ではありません。

これは「STINGER8」がバージョンアップ等した場合、影響を受けないようにするためです。

FTPクライアント、レンタルサーバFTPサービスを使用し、ロゴ画像とヘッダーファイルを操作する

「STINGER8 Child」に「header.php」をコピーする

FTPクライアント、レンタルサーバFTPサービス等を利用し、「STINGER8」内にある「header.php」を「STINGER8 Child」内にコピーします。

「STINGER8」のパスは「wp-content/themes/stinger8/header.php」になっています。

「STINGER8 Child」のパスは「wp-content/themes/stinger8-child」なので、「stinger8-child」以下に「header.php」をコピーします。

wp-content
- themes
  - stinger8
    - header.php ← これをコピーします。
  - stinger8-child
    - ここに「stinger8」の「header.php」を配置します。

「STINGER8 Child」にロゴ画像を配置する

作成したロゴ画像を「wp-content/themes/stinger8-child/images」以下に配置します。

wp-content
- themes
  - stinger8-child
    - images
      - ここにロゴ画像を配置します。

「STINGER8 Child」のテーマを編集する

「外観」から「テーマの編集」を選択し、テーマ編集画面を表示します。
「header.php」ファイルを選択し、「ロゴ又はブログ名」とコメントアウトされている行を探します。

<!-- ロゴ又はブログ名 -->
  <a href="<?php echo esc_url( home_url( '/' ) ); ?>">
    <?php echo esc_attr( get_bloginfo( 'name' ) ); ?>
  </a>
<!-- ロゴ又はブログ名ここまで -->

47行目を以下のように変更します。

<!-- ロゴ又はブログ名 -->
  <a href="<?php echo esc_url( home_url( '/' ) ); ?>">
    <img src="<?php echo get_stylesheet_directory_uri(); ?>/images/logo.png">
  </a>
<!-- ロゴ又はブログ名ここまで -->

「/images/logo.png」部分はアップロードしたロゴ画像名に変更してください。

これでロゴ画像の変更は終わりです！お疲れ様でした！

WordPressSTINGER8