質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

解決済

1回答

1419閲覧

無料テーマのヘッダーのみカスタマイズしたい

r110

総合スコア16

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2018/03/14 02:39

編集2018/03/14 05:56

今使用しているサイトをSentry(https://ultimate-ez.com/sentry/)
というテーマに変え、ヘッダー部分だけカスタマイズしたいのですが
うまくいきません。

やりたいのは、画像を中央に入れ、ナビゲーション部分のフォントやカラーを変え
(できればドロップダウンメニューをつけたい)たいのです。
追加CSSの欄を利用し、

body{ margin-top: 198px; } header { text-align:center; background: #ffffff!important; } .header .container{ height:150px; background:url(hogehoge.png); background-attachment: fixed!important; background-repeat: no-repeat!important; }

を入れたのですが、中央ぞろえにならないのと、画像が連続してしまいます。
function.phpを修正し、カスタムヘッダーを作ったのですが、画像を入れても表示されませんでした。

<?php $custom_header_args = array( // デフォルトで表示するヘッダー画像(画像のURLを入力) 'default-image' => get_template_directory_uri() . '/img/default.jpg', // ヘッダー画像の横幅 'width' => 1000, // ヘッダー画像の縦幅 'height' => 198, // ヘッダー画像の横幅を自由に切り取れるかどうか(trueもしくはfalse) 'flex-width' => false, // ヘッダー画像の縦幅を自由に切り取れるかどうか(trueもしくはfalse) 'flex-height' => false, // ヘッダーテキストを表示するかどうかを指定する機能の使うかどうか(trueもしくはfalse) 'header-text' => false, // ヘッダーテキストのデフォルトの色 'default-text-color' => '000', // 動画ヘッダーに対応するかどうか(trueもしくはfalse) 'video' => true, // adminへの画像ファイルのアップロードを許可するか(trueもしくはfalse) 'uploads' => false, // ヘッダー画像をランダムにローテーションするかどうか(trueもしくはfalse) 'random-default' => false, // テーマのheadタグ内に呼び出したいコードが書かれた関数を指定(関数名) 'wp-head-callback' => 'wphead_cb', // カスタムヘッダーページのheadタグ内に呼び出したいコードが書かれた関数を指定(関数名) 'admin-head-callback' => 'adminhead_cb', // カスタムヘッダーページのプレビュー部分に表示したいコードが書かれた関数を指定(関数名) 'admin-preview-callback' => 'adminpreview_cb', ); add_theme_support( 'custom-header', $custom_header_args ); ?>

変えたいのはヘッダーだけなので、cssを修正するだけで画像が入ればいいのですが、
どうしてもうまくいきません。教えていただけますでしょうか。
どうぞよろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2018/03/14 04:19

WordPressテーマはテーマ名だけではなく取得したURLを質問文に追記ください。(URLにはリンクを張ることができます)
r110

2018/03/14 05:19

kei344様、ご連絡ありがとうございます。質問文を修正しました。
guest

回答1

0

ベストアンサー

画像のパスが正しくないのでこちらの環境では表示されませんが。

CSS

1.header > div.container { /* .header .container では下にある要素にもかかる */ 2 height:150px; 3 background:url(http://www.y-create.co.jp/blog/yc-business/files/2018/03/topimg.png); 4 /*background-attachment: fixed!important;*/ 5 background-repeat: no-repeat!important; 6 background-position: center center; /* ADD */ 7 background-size: auto 100%; /* ADD */ 8}

投稿2018/03/14 05:45

kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

r110

2018/03/14 05:59

センターにそろいました。ありがとうございました
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問