Cocoonのカスタマイズはいっちゃんまで!

Cocoonの1カラムの背景色、メイン幅変更

Cocoonの1カラムの背景色変更
Cocoon WordPress

Cocoonの1カラム背景色、メイン幅変更カスタマイズについて書いていきます。

こんにちは。

いっちゃんです。(@hi_icchan_jp)

今回は特定の固定ページを1カラムにしてメイン幅を設定するカスタマイズをご紹介します。

前提条件:編集画面右横のページ設定→1カラム(広い)を選択していること。

特定の固定ページのメイン幅調節方法

CSSに以下を追加して下さい。

  1. /* 特定の固定ページのメイン幅調整 */
  2.  
  3. .page-id-〇〇〇〇  #main{
  4. padding-left: 190px;
  5. padding-right: 190px;
  6. }

特定の固定ページの背景色変更方法

CSSに以下を追加して下さい。

注意:管理画面→Cocoon→全体→サイト背景色設定を設定していると、こちらが優先されますので解除して下さい。

  1. /* 特定のページの背景色変更 */
  2.  
  3. body.page-id-〇〇〇〇 {
  4. background-color: #fff;   /* 背景色:白 */
  5. }

上記の.page-id-〇〇〇〇には投稿・固定ページのページ番号を入れます。

※ページ番号とは投稿編集画面の上部に含まれてる番号の事です。

編集画面URL例

:https://あなたのドメイン.com/wp-admin/post.php?post=1919&action=edit

上記の例では1919がページ番号ですね。

今回のカスタマイズ内容のマトメです。

  • 特定の固定ページのメイン幅変更
  • 特定の固定ページの背景色変更

いかがでしたでしょうか?

次回も有益な情報をお届けできるように頑張ります。


WordPressのインストール代行・カスタマイズをします!

ブログ制作に自信が無い、直し方が分からない方向けです。

 

いっちゃん
いっちゃん

女性の多くが「WordPressが苦手」だと言います。

 

事例① 「インストール」で挫折した

事例② ”「頭が痛くなる」し難しい 

事例③ とにかく「分からない」

 

一見混乱しがちですが、「WordPressのインストール」をクリアするとハードルは下がります。

 

いっちゃんはWordPressのCocoonテーマのカスタマイズをお手伝いします。

 

デモサイトを見る >>

 


 

いっちゃん紹介

いっちゃん

いっちゃん
『Cocoonをカスタマイズ』

初心者向け>>Cocoonテーマのカスタマイズをします。ご依頼は>>こちら(有料)※PHPの編集は除外。

現在WordPressのオリジナルテーマの開発中。私の幼少期は外国語が一番嫌いで全く話せませんでした。

「なぜ周りと違うことがいけないのか?」という疑問を持ちつつも、人と異なる行動をして中国語を学びました。

そして出会った人のご縁でシリコンバレーに滞在することに。こうして私は情報テクノロジーやAIに興味を持ち始めました。>>プロフィール

 

いっちゃんをフォローする !
はなしあいて①.com
タイトルとURLをコピーしました