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

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

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

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

Q&A

3回答

1290閲覧

Wordpressのテーマ「Simplicity2」を使用してるのですがサイドバーについて

bikky11

総合スコア6

WordPress

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

0グッド

0クリップ

投稿2017/05/06 06:12

ワードプレスでHPを作成しています
Simplicity2のテーマを使用していて
Simplicity2 childもテーマに入れた状態です

そこでサイドバーの細かい部分を変えたいです。
内容としましては、ひとつづつの項目を枠で囲うなどです。

どの部分を変えるのがいいのでしょうか?
またどのように変更すればいいのでしょうか?

独学でやっているので試してはみましたが
恐らく的外れで変更されません。

スタイルの部分など初期の設定でたくさんの記述がある為
変な設定にしてしまいそうで恐いのでお教えいただけないでしょうか?
お手数ですがよろしくお願いします。

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

#sidebar h4 { margin:0 0 10px 0; padding:2px 8px; border-width:0 5px; border-color: #fbd92d; border-style:solid; background:#d87b13; color:#f8f7f2; line-height:140%; font-weight:bold; }

###試したこと
親ページ、子ページ両方共のstyle.cssを消したり増やしたりしてみましたが変化がみられなかった。
http://lancers-life.com/customize-simplicity-of-sidebarのページのミツバチ風サイドバーを試しましたが反映されませんでした(力不足です)

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

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

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

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

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

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

guest

回答3

0

Simplicity2は、此処暫く使用していませんので可能性として

1.スタイルシートの書き方が違う
http://besak.net/side を見ると #sidebar h4 ではなく #sidebar h3 と記述されています
Simplicity2のサイドバーにどんなcssが割り当てられているのかを確認してみると良いですね。

2.functions.phpの修正
http://atuweb.net/201703_simplicity-css-add-version/
上記リンクにありますように「スタイルシートを更新しても上手く反映されない」事例というのはあります。
リンクを参考にしながら作業されてください。
ただしfunctions.phpを弄るので出来ればローカル(パソコンですね)に環境を作成し、きちんと挙動を確認してから現行ウェブサイトにコピペするようにされることをお薦めします。

投稿2017/05/06 07:09

退会済みユーザー

退会済みユーザー

総合スコア0

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

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

0

Simplicity2を使っていないので、確実ではないですが、
サイドバーの見出しなら

css

1#sidebar h4

でなく

css

1#sidebar h3

じゃないですか。
Simplicityのデモサイト
(こちらの見出しで確認しました)

ブラウザのデベロッパーツールで確認してみてください。

投稿2017/05/06 07:09

編集2017/05/06 11:54
8-0_nyan5

総合スコア2352

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

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

0

下記テーマでしょうか。

【Simplicity2のダウンロード】
https://wp-simplicity.com/downloads/downloads2/

例えば新着記事を赤いボーダーで囲うなら。

CSS

1#new_entries-2.widget_new_entries ul li img { 2 margin-top: 0; 3 margin-bottom: 0; 4} 5#sidebar #new_entries-2 li { 6 overflow: hidden; 7 margin-bottom: 3px; 8 border: 1px solid red; 9}

デベロッパーツールでどの要素か確認し、それに対応するCSSを書くことになります。
HTML/CSSの基本は書籍などで体系だった知識を勉強することをお勧めします。(「基本」は大事です)

【開発者ツールを使おう! カスタマイズするphpファイルを探す-その1 | RYUS blog】
http://ryus.co.jp/blog/customize-php-search-1/

【Web開発でよく使う、特に使えるChromeデベロッパー・ツールの機能 - Build Insider】
http://www.buildinsider.net/web/chromedevtools/01

【第1回 詳説:デベロッパーツールの使い方:Google Chrome版Firebug:デベロッパーツール取扱説明書|gihyo.jp … 技術評論社】
http://gihyo.jp/dev/feature/01/devtools/0001?page=2

【Web関係者は知っておくべきGoogleChromeデベロッパーツールの使い方 | Ocadweb】
http://ocadweb.com/web/googlechromedevelopertools

投稿2017/05/06 08:10

kei344

総合スコア69364

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問