ロゴ
【note:検索上位を狙うブログ理論】一騎当千SEO

【マナブログコピー(WordPressテーマ】ヘッダーの下にインフォメーション欄を追加する方法

その他の追加設定

こんにちは、ごま吉(@Lv1gomakichi)です。

本記事では、マナブログコピーのヘッダー下にインフォメーション欄を追加する方法を紹介します。

インフォメーション欄は、他WordPressテーマでもよく見る動線です。
視認性が高くとても誘導しやすいリンクです。

【Manablog Copy】ヘッダーの下にインフォメーション欄を追加する方法

完成イメージはこちらです。

PCプレビュー


スマホプレビュー


ヘッダーの下にインフォメーション欄を追加する方法は以下です。
管理画面外観テーマエディターheader.phpを開きます。
コード内の/headerの直後に下記のコードを追加します。

<div class="headerinfo">
<a href="リンク先のURL">リンク名称 <i class="fas fa-chevron-circle-right"></i></a>
</div>

次にCSSを追加します。
CSSはカスタマイザー追加CSSから下記のコードを追加します。

.headerinfo {
	
   background: #00978D;
	text-align:center;
	padding-top:5px;
	padding-bottom:5px;
}
	
.headerinfo a{
text-decoration: none;
    color: #fff;
}

背景色、リンクテキスト色については、#色番号を変更すれば自由に設定できます。

【動画解説】ヘッダーの下にインフォメーション欄を追加する方法

動画でも解説していますので合わせてご参考ください。

画像提供:Dooder – jp.freepik.com によって作成された background ベクトル

\将来につながるプログラミング/

エンジニアとして活躍したい人
プログラミング未経験でも安心
WordPressにもっと詳しくなれる
無料体験レッスン受講後に受講料が1万円引に!




注目こちらも合わせてどうぞ▼
アフィリエイトを始めるための手順を紹介しています。マナブログコピーのカスタマイズが終わったら『ASP登録』をしましょう。

note


注目こちらも合わせてどうぞ▼
アフィリエイト初心者向けに【月3,000円を稼ぐ着実なSEO】をテーマにnote執筆しました。マナブログコピーと合わせて運用すると効果大です。

note

人気記事【マナブログコピー(WordPressテーマ)】文字装飾プラグインの設定