フリーランス WEBデザイナー 【キングサイト】
最近のウェブ制作技術
WordPress(ワードプレス)で親カテゴリーを指定して子カテゴリ一覧(カテゴリーリスト)を表示させる方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)で親カテゴリーを指定して子カテゴリ一覧(カテゴリーリスト)を表示させる方法
Webデザイナーになる為の第一歩(初級)
WEB屋になる為の知識と技術
Webデザイナーになる為の第一歩(初級)
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目と画像アップロード機能を追加する設定方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目と画像アップロード機能を追加する設定方法
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目を追加する設定方法
ブログツール【CMS】情報とWEBコンテンツ技術
WordPress(ワードプレス)でカテゴリー編集画面に新しい項目を追加する設定方法
ホームページ制作簡単作成ツールWix(ウィックス)
WEB屋になる為の知識と技術
ホームページ制作簡単作成ツールWix(ウィックス)
ウェブ制作カテゴリ
Facebookの投稿
ウェブ制作技術 SNS・ブログ
おすすめウェブサイト
ウェブ制作のご注文は全国対応

北海道 青森 岩手 秋田 宮城 山形 福島 東京 神奈川 埼玉県 千葉 茨城 群馬 栃木 愛知 静岡 三重 岐阜 新潟 長野 山梨 石川 富山 福井 大阪 京都 奈良 兵庫 滋賀 和歌山 岡山 広島 鳥取 山口 島根 愛媛 徳島 高知 香川 福岡 佐賀 長崎 大分 熊本 宮崎 鹿児島 沖縄

WordPress(ワードプレス)の管理画面からデザインを変更できるカスタマイズ項目のメニューを追加する方法

30.09.15 23:56 | コメント(0)

管理画面の「外観」「カスタマイズ」画面内のメニュー項目の追加

WordPress(ワードプレス)を利用して、管理画面からデザインを変更する「カスタマイズ」メニューがありますが、こちらのメニューでデザインを変更する時、メニューウィジェットを追加することが出来ます。 「カスタマイズ」メニュー内のウィジェットを追加するには「functions.php」にコードを追加してあげることでメニューウィジェットを追加する事が出来ます。

今回は管理画面カスタマイズページへ「メニューの追加」をする方法をご紹介いたします。

Webデザインサンプル

管理画面からデザインを変更
 1. WordPress(ワードプレス)の管理画面
 2. カスタマイズページを開く
 3. ロゴメニュー項目の追加
 4. ロゴメニューの確認

WordPress(ワードプレス)の管理画面

最初にWordPress(ワードプレス)の管理画面に入り下記のメニューを開きます。
 ・管理画面左メニュー:「外観」>>「カスタマイズ」

カスタマイズメニュー

カスタマイズメニュー

カスタマイズページを開く

カスタマイズメニューを開くとロゴ、グローバルメニュー、トップ画像等のメニューが左側メニューに出来てきます。
※テンプレートによって異なる場合があります。
ここでデフォルトメニューに新しく「ロゴ」というメニュー項目を追加したいと思います。

カスタマイズメニュー項目

カスタマイズメニュー

ロゴメニュー項目の追加

デフォルトメニューに新しく「ロゴ」というメニュー項目を追加したい場合は、「functions.php」に「ロゴ」メニューの追加コードを記載します。

【ロゴメニュー項目コード】
if ( ! function_exists( 'test_theme_customizer' ) ) :

	function test_theme_customizer( $wp_customize ) {
		
		$wp_customize->remove_section( 'title_tagline');
		$wp_customize->remove_section( 'static_front_page' );
		
		/* logo option */
		$wp_customize->add_section( 'test_logo_section' , array(
			'title'       => 'ロゴ',
			'priority'    => 1,
			'description' => __( 'Upload a logo to replace the default site name in the header', 'test' ),
		) );
		
		$wp_customize->add_setting( 'test_logo', array (
			'sanitize_callback' => 'esc_url_raw',
		) );
		
		$wp_customize->add_control( new WP_Customize_Image_Control( $wp_customize, 'test_logo', array(
			'label'    => __( 'Choose your logo (ideal width is 100-300px and ideal height is 40-100px)', 'test' ),
			'section'  => 'test_logo_section',
			'settings' => 'test_logo',
		) ) );
	}
	
endif;
add_action('customize_register', 'test_theme_customizer');
functions.php」にコードの入力を行ったら、「test」の文字をお好きなテーマ等の名前に変更してください。
※例でテーマの名前を「test」としてコードを記載しています。

testコードの変更位置

コード

ロゴメニューの確認

コードの記載が完了したら、管理画面のカスタマイズメニューに戻り「ロゴ」のメニューが追加しているか確認を行ってください。

ロゴメニュー

ロゴメニュー
以上でWordPress(ワードプレス)の管理画面からデザインを変更できるカスタマイズ項目のメニューを追加する方法が完了です。
カテゴリ:WordPress(ワードプレス)構築と技術, カスタマイズ方法(WordPress), ブログツール【CMS】情報とWEBコンテンツ技術
  • このエントリーをはてなブックマークに追加
  • Facebookでコメントする

    コメントする

    おすすめの記事

    PAGE TOP