賢威ヘッダー

テスト用ブログのテンプレートを賢威8にバージョンアップした前回の続き。※覚書!

 

テンプレートをバージョンアップしたのはいいけど、元のブログとの見た目の差がありすぎる。

今のブログ↓

賢威設定

 

バージョンアップしたブログ↓

新ブログ

 

今のブログに近づけていこう!

WordPressにログインし、[賢威の設定]>[賢威の設定]をクリック。

賢威設定

 

[ロゴ画像]の部分の[画像をアップロード]をクリック。

賢威設定

 

ヘッダーの画像をアップし[選択]をクリック。

賢威設定

 

一番下までスクロールし

賢威設定

 

[変更を保存]をクリック。

賢威設定

 

テスト用ブログを見てみるとヘッダーの画像が左に寄ってる。

賢威設定

 

センターに持ってこよう!

[外観]>[テーマエディター]をクリック。

賢威設定

 

[bass.css]をクリック。

賢威設定

 

賢威の子テーマのbass.cssに下記のように追記し、[ファイルを更新]をクリック。

/*ヘッダー画像*/
.keni-header .site-title, .keni-header_col1 .site-title {
float: none;
max-width: 100%;
text-align: center;
}
/*ヘッダーの背景色*/
.keni-header_wrap{
background-color: #333333;
}
/*サイトの簡単な説明の色*/
.site-description{
color:#f0f0f0;
}
/*グローバルナビ色*/
.keni-gnav_wrap {
background-color: #333333;
}
/*グローバルナビメニュー色*/
.keni-gnav_inner li a {
color:#f0f0f0;
background:#333333;
border-bottom-color: #333333;
}
/*ホバーエフェクト色*/
.keni-gnav_inner li a:hover {
border-bottom-color: #dd6565;
}

賢威設定

 

これで、今のブログに見た目近づいた!

賢威設定