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

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

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

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

257閲覧

Digipress社の「Attractive」テンプレートでCSSを追加してヘッダー部分に画像を挿入したいです

rappad2150

総合スコア7

WordPress

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

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2017/08/17 01:11

編集2017/08/17 01:20

###前提・実現したいこと

WordPressでサイトを運営している者です。

現在、私は複数のサイトを運営しておりまして、その中でもDigPress社の「Attractive」というテンプレートを使用しています。
↓↓
https://digipress.digi-state.com/attractive/

実現したいことですが、この「Attractive」テンプレートを使用した時に、ヘッダー部分に画像を挿入して見栄えをよくしたいということです。

ちなみに参考になるサイトとしては、下記のサイトのように変更したいと考えております。
(ヘッダー部分で桜の木の画像が入っているところです)
↓↓
http://lpseisaku.net/

###発生している問題・エラーメッセージ

また、こちらのサイト(http://lpseisaku.net/)では、ヘッダー部分に画像を挿入する仕方を記事にまとめていまして、それがこちらの記事になります。
↓↓
http://lpseisaku.net/post-499/

上記であげた記事を参考にして、私も運営しているサイトに画像を挿入しようと試みました。
(FTP接続を行い、画像をアップロードし、CSSを編集致しました)

しかし、いくら試してもヘッダー部分に画像を挿入することができず、ヘッダー部分の色が変更されるだけです。

###該当のソースコード

【オリジナルスタイルシートに入力したコード】(入力したコード内容) div#site_banner_container { background-image: url(“http://taiseee/public_html/img/sankou.jpg”); background-repeat: no-repeat; background-position: center center; }

###試したこと
入力したコードを少し変更してみたりしましたが、ヘッダー部分に画像を挿入することができませんでした。

参考にするサイトに問い合わせてみたかったのですが、問い合わせフォームなど、連絡できる手段が無かったため、こちらで質問させて頂きました。

わかる方がいましたら、回答して頂けると助かります。

###補足情報(言語/FW/ツール等のバージョンなど)

WordPressのバージョン・・・4.8.1

使用しているサーバー・・・ Xサーバー
PHPバージョン・・・5.6.30
MySQL5.5 バージョン

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

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

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

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

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

m.ts10806

2017/08/17 01:12

background-imageに指定している画像のパスは正しいのでしょうか?
m.ts10806

2017/08/17 01:28 編集

ブラウザでアクセスして画像が表示されなければ基本的にはcssから参照することは出来ません。taiseee/public_htmlはおそらくサイトのルートディレクトリであってブラウザからアクセスできるドメイン・URLではないと思います。taiseeeもユーザー名か何かと思われます。
m.ts10806

2017/08/17 01:29

上記踏まえて回答に移行します。
guest

回答1

0

ベストアンサー

ブラウザでアクセスして画像が表示されなければ基本的にはcssから参照することは出来ません。taiseee/public_htmlはおそらくサイトのルートディレクトリであってブラウザからアクセスできるドメイン・URLではないと思います。
taiseeeもユーザー名か何かと思われます。

そもそもhttp://の最初の区切りが```○○.com```,```○○.net```などドメインの形式ではありません。

サイトのルートディレクトリの設定がどうなっているか分かりませんが、
http://サイトのドメイン/img/sankou.jpgのようなURLでブラウザからアクセスし、
画像が表示されるのを確認して、そのURLをCSSにあててはいかがでしょうか?

また、cssの部分、background-image: url()で使っているダブルクォーテーションが全角になっているようです。
全角ですとブラウザが正しく解釈できない可能性もありますので、半角に修正しておいてください。

投稿2017/08/17 01:35

m.ts10806

総合スコア80765

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

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

rappad2150

2017/08/17 01:53

mts10806さん、 回答して頂きまして、ありがとうございます。 指摘を受けた箇所を確認しながら、修正しましたところ、無事にヘッダー部分に画像を挿入することができました! 初めてteratailを利用したのですが、迅速に適切な回答して頂けてとても助かりました! CSSなど、まだまだ知識がないので、これからも勉強していこうと思います。 回答して頂きまして、ありがとうございました。
m.ts10806

2017/08/17 01:57

解決したようで良かったです。 WordPressにはあまり明るくはないのですが、テーマに関係する画像であれば もしかしたらもう少し簡単に挿入できるかもしれませんので、 WordPressのテーマ的な観点からも出来ることを調べてみてください。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問