[stinger5]スティンガー5をビジネステンプレートに、カスタマイズする方法 第2回「ヘッダーに企業電話番号の追加」

スティンガー5をビジネステンプレートにヘッダーに企業電話番号の追加
前回企業ロゴを挿入する方法を解説しましたが、今回は上記画像のようなヘッダー部分に、企業の電話番号を入れる方法を紹介します。
※ぼかしの入っている部分です。

前回はこちら
[stinger5]スティンガー5をビジネステンプレートみたいに、カスタマイズする方法 第1回「企業ロゴの追加」

画像のアップロード

まず企業電話番号の入った画像を作成します。作成方法はいろんなやり方があるのではぶきます。

今回は325px×111pxで画像作成しアップロードしました。
アップロード方法はワードプレスのダッシュボードから「メディア」→「新規追加」でアップロードできます

ヘッダーの編集

次にヘッダーの編集をします。
ワードプレスのダッシュボード部分から、「外観」→「テーマの編集」→「header.php」を選択します。

ワードプレスヘッダーに企業電話番号の追加
編集部分はheader.phpファイルの真ん中よりちょっと下の部分です。挿入位置は、上記画像を参考にしてください。
画像をクリックすれば、拡大画像が見れます

挿入コード

<div style="float:left;">
    <img alt="<?php bloginfo( 'name' ); ?>" src="<?php echo esc_url(get_option('stinger_logo_image')); ?>" />
</div>
<img src="http://画像のアドレスが入ります"/>

こちらは挿入コードです。
2行目はもともとあるコードになります。

最後に

次回はサイトのヘッダーの下部分、グローバルメニューを作成したいと思います。

前回はこちら
[stinger5]スティンガー5をビジネステンプレートみたいに、カスタマイズする方法 第1回「企業ロゴの追加」

次回はこちら
[stinger5]スティンガー5をビジネステンプレートに、カスタマイズする方法 第3回「グローバルナビの変更」

スティンガー5のカスタマイズまとめ記事はこちら

ワードプレスのテーマ「stinger5」をカスタマイズして、企業のホームページとして2015年1月から運用します

The following two tabs change content below.
AKIRA

AKIRA

上尾市在住の、リサイクルショップで働くサラリーマン。 Twitter・Facebookやってます。 小心者なので、誰か声かけてくれると嬉しいです。
スポンサーリンク
スポンサーリンク
スポンサーリンク

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です