• 締切済み

wordpressで検索バーを消したい

http://arunesam.com/ こちらのページのメニューバーの右側の検索バーを消したいのですが なかなかうまくできません。 テーマはTwenty Eleven 1.3を使っています。 色々調べてcss .widget_search label { display: none; } を入れ編集すればよいらしいことがわかったのですが、 外観→テーマ編集→Twenty Eleven: スタイルシート (style.css)の どことどこの間にこれを入れたらいいのか わからないので、教えてく下さい。

  • CSS
  • 回答数1
  • ありがとう数1

みんなの回答

noname#158634
noname#158634
回答No.1

>どことどこの間 別にどこでもいい。もちろんほかのプロパティ設定の{}の中とかはダメだけど。 CSSをいじりたいならそうやって丸暗記的場当たり的にやってちゃダメ。ちゃんと覚えましょう。

kinchan1987
質問者

お礼

ありがとうございます。 今まで場当たり的でなんとかなってきましたが やっぱり本当にあれこれいじりたくなると ちゃんと勉強しないとだめですね。 基礎からやってみます。

関連するQ&A

  • WordPress バグなのかな?

    WordPressのバグですか? 外観 / テーマ編集 / スタイルシートで繰り返しスタイルを変更していました。 すると、ブラウザ(IE8)にCSSが適用されなくなりました。 Firefoxでは適用されています。 /*-- 効かなくなったスタイルは以下になっています。 --*/ div#container { margin: 0 auto; } 以上、よろしくお願いします。

    • ベストアンサー
    • CSS
  • WordPressで画像に枠が入ってしまいます。

    wordpress でホームページを制作していますが、写真に枠線が入ってしまいます。どの部分を消したらいいのかがわかりません。有料テンプレートを買ってしまって特にわかりません。。。どなたかお助けください。 CSSは @charset "UTF-8"; /* CSS Document */ /* -------------------------------------------------- setting ----------------------------------------------------- */ body { background:#ededed url(images/bg/default.gif);} p { font-size: 110%; line-height:1.6em } li{list-style:none;} .row { width: 980px; } @media only screen and (max-width: 767px) { p { font-size: 115%; } } /* -------------------------------------------------- header ----------------------------------------------------- */ header.row { padding-top:23px; padding-bottom:20px; } header.row .nine.columns{ padding:0; } header h1 { margin:0; padding:7px 0 0 0; line-height:1em; font-size: 36px; color:#666; font-family:Georgia, "Times New Roman", Times, serif; font-weight:lighter; float:left; text-align:left; } header img{ border:none; } header h1 a { color:#666; text-decoration:none; } header h1 a:hover { color:#fff; } header #tagline { color:#333; font-size:small; float:left; line-height:37px; padding-top:7px; padding-left:15px; } header #contact { text-align:right; } header #contact #phone { font-weight:bold; font-size: large; color:#666; line-height:1em; } header #contact #phone a { color:#666; } header #contact #icon img { margin-left:5px; vertical-align:middle;} header h3 { margin:0; margin-bottom:5px; padding-left:7px; font-size:14px; } header .widget_RGBdesign_Contact#contact h3 { border-left:0px #FFFFFF solid; padding-left:0px; padding-bottom:5px; } header .widget_search#contact h3, header .widget_search#contact label { display:none; } header form, header p { margin:0; padding:0; } header .widget_search#contact #s {width:70%; float:left; margin:0; padding:0;} header .widget_search#contact #searchsubmit {width:30%: float:right; margin:0; padding:0; font-size: 20px; margin-top:0.3em;} header .widget ul li { display: inline; } header:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }

  • Wordpress カスタマイズについて

    Wordpress/Twenty Twelveカスタマイズについて Wordpressフォーラムに投稿すべきなのでしょうが、なぜか 投稿がうまくいきませんので、こちらで失礼します。 以下の内容、アドバイスを頂けると幸いです。 Wordpress/Twenty Twelveのテーマを現在カスタマイズしております。 style.css にて、メインナビゲーションメニューの各項目の後ろに、背景画像を 設定しました。ただ、それをレスポンシブル(おもにスマホ)の際は非表示と したいのですが… >PCの場合のstyle.css .main-navigation ul.nav-menu li, .main-navigation div.nav-menu > ul li { background-image: url(/メニュー背景.png); background-repeat: no-repeat; background-position: center; max-width: 100%; } >スマホの場合の縮小設定 @media screen and (min-width: 600px) { 以下に… .main-navigation ul.nav-menu li, .main-navigation div.nav-menu > ul li { background-image: url(/メニュー背景.png); background-repeat: no-repeat; background-position: center; max-width: 100%; background-img: none; } こういった記述をしておりますが、これだけではスマホで閲覧した際 非表示にならないようで、困っております…。 何かミスをしている、もしくは欠けていることがありますでしょうか。 初心者なので、記述場所等もご指摘くださると幸いです。 以上 よろしくお願いします。

  • JavaScriptで項目入力の制限分岐の仕方

    WEBアンケートフォームを作る際、JavaScriptで項目入力の制限分岐の仕方を教えてください WEBアンケートフォームを作ろうとしているのですが、条件がいくつかありうまく作れません。 どなたかこの様な条件分岐でうまくいく方法をご存知の方、あるいは例がのっているWEBチュートリアルのページをご存知の方いらっしゃいませんか? 【以下、作りたいフォームの項目】 選択肢A~E(ラジオボタンによる選択)とプルダウンメニュー、テキストボックス入力フィールドがある。 --------------- A プルダウンメニュー B C D E テキストボックス --------------- テキストボックスはグレーアウトでデフォルトは入力不可になっている。 プルダウンメニューもデフォルトでは選択ができないようになっている。 Aを選んだらプルダウンメニューが選択可。 C、D、Eを選んだら、テキストボックスが入力可能になる。 ■■■ いろいろOK Wave内を調べたり、ググって調べて以下のようなソースを書いてみたのですが、 FireFoxやGoogleCromeだとうまく動きません。 これを動かせるようにしていただいても、助かります。 <input type="radio" name="radio1" value="AAA" id="r1" checked onclick="this.form.select1.style.display='inline';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r1">AAA</label><select name="select1" style="display='inline'"><option value="" selected> ------------- </option><option value="111">111</option><option value="222">222</option><option value="333">333</option><option value="444">444</option><option value="555">555</option><option value="666">666</option><option value="777">777</option><option value="888">888</option><option value="999">999</option></select><br /><input type="radio" name="radio1" value="BBB" id="r2" onclick="this.form.select2.style.display='inline';this.form.select1.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r2">BBB</label><input name="select2" style="display='none'"><br /><input type="radio" name="radio1" value="CCC" id="r3" onclick="this.form.select3.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select4.style.display='none';this.form.select5.style.display='none'"><label for="r3">CCC</label><input name="select3" style="display='none'"><br /><input type="radio" name="radio1" value="DDD" id="r4" onclick="this.form.select4.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select5.style.display='none'"><label for="r4">DDD</label><input name="select4" style="display='none'"><br /><input type="radio" name="radio1" value="EEE" id="r5" onclick="this.form.select5.style.display='inline';this.form.select1.style.display='none';this.form.select2.style.display='none';this.form.select3.style.display='none';this.form.select4.style.display='none'"><label for="r5">EEE</label><input name="select5" style="display='none'"> ■■■ よろしくお願いします。

  • cssでdisplay:noneを指定した時のプルダウンメニュー

    こんにちは、JavaScriptでプルダウンメニューを作ろうとして cssで予めdisplay:none;を指定したところ、 メニューがクリックしても開かなくなってしまいました。 html、css、JavaScriptの記述は以下の通りです。 html --------------------------------------- <span onclick="PullDown('term1')">クリック</span> <div id="term1"> <ul> <li>***********</li> <li>***********</li> </ul> </div> ----------------------------- css ------------------------------ div#term1 { display: none; } ------------------------------- JavaScript ------------------------------- function PullDown(id){ if(document.getElementById(id).style.display == 'none') document.getElementById(id).style.display=''; else document.getElementById(id).style.display='none'; } --------------------------------- cssの記述部分を無くすとちゃんと開いたり閉じたりと動作します。 また、 function Init(){ document.getElementById("term1").style.display="none"; } とJavaScriptで書いて、 bodyタグの所で <body onload="Init()">として呼び出してロード時に隠すようにするとちゃんと開閉してくれます。 cssでdisplay:none;と書くと動かなくなる理由と、 対策が分かる方居ましたら教えてください。

  • 全体幅とメニューバーの幅が合いません

    レイアウトとしてヘッダーの下にメニューバーをおいています。 メニューバーは5項目あり、各項目幅151px。 右側に1pxのボーダーを入れています。 最後の項目の右側のボーダーは"なし"にしています。 (151 x 5) + 4 = 759 この幅に合わせて全体幅を759pxに設定しているのですが、幅が合いません。(メニューバーが少し短くなってしまいます) ちなみに各項目の幅を152にすると全体の幅は760でも大丈夫のようです。 ブラウザーで確認するとピッタリ来ています。 ただ『ページ編集』ではズレが生じています。 ホームページビルダー13を使用しています。 メニューバーは箇条書きを回り込みで横一列にしています。 ↓参考として <html> <div id="container"> <ul id="menu"> <li><a href="toppage">トップページ</a> <li><a href="konnichiha">こんにちは</a> <li><a href="ohayou">おはよう</a> <li><a href="konnbnwa">こんばんは</a> <li class="menulast"><a href="odaijini">お大事に</a> </ul> </div> <css> div#container{ width : 759px; } ul#menu li{ list-style-type : none; float : left; } ul#menu{ padding-left : 0px; margin-left : 0px; font-size : 0.75em; background-color : #0071e1; height : 30px; margin-top : 0px; margin-bottom : 30px; } ul#menu li a{display : block; line-height : 30px; color : white; text-decoration : none; text-align : center; width : 151px; background-color : #003a75; border-right-width : 1px; border-right-style : solid; border-right-color : white; } ul#menu li a:hover{ background-color : #0071e1; } ul#menu li.menulast a{ border-right-style : none; } なぜ759pxの幅では合わないのか悩んでおります。 どなたかアドバイスよろしくお願いします。

    • ベストアンサー
    • CSS
  • WordPressテーマAttitudeのフッター

    ホームページ作成に関しては初心者です。 先日サーバーを借りてWordpressをインストールしブログを始めようと準備しています。 テーマには「Attitude」を選択しました。 外観のおおまかな変更については管理画面からほぼ出来たのですが、フッターのコピーライト表記「Copyright © 2013 Theme by: Theme Horse Powered by: WordPress」を自分の望むコピーライトに書き換える事が出来ません。 ネットで検索した情報を基にすると、外観>テーマ編集から、「フッター(footer.php)」もしくは「スタイルシート(style.css)」を編集するようで、該当しそうな箇所を削除したり、そこに自分の入れたいコピーライトを記入してみたりするものの一向に変化はなく、むしろ画像のポップアップのプラグインが動作しなくなったり悪い方向へ進んでしまいます。 WordPress謹製のテーマ「TwentyTwelve」などについては、どこをどのように変えれば良いかネット上に情報があるのですが、「Attitude」は構文?が異なっており同じ様に編集する事が出来ずほとほと困っています。 HTML、CSS、PHPなどについては、これを機会に勉強を進めようと思っていますが、取り急ぎ「Attitude」においてフッターのコピーライト表記を書き換える方法をストレートにご教示いただきたく思っております。 お知恵をお貸し頂けますようよろしくお願い致します。 PS. <strong><center>などのごく初歩的なタグの意味・役割は知っており、HTML、CSS、PHPというものの概要は理解しているつもりです。 PS. コピーライトの編集のプラグイン「Blog Copyright」は試しましたが、「Attitude」には通用しませんでした。

  • マウスオーバーのメニューについて

    お世話になります。 現在、オンマウスでメニュー画像が表示される仕組みを作成しているのですが、別のメニューにする方法がわかりません。 たとえば、「MAIN」と「LINK」のメニューがあるとして、MAINはMAINのメニュー、LINKはLINKのメニューが表示されるという方法です。 http://memorva.jp/memo/html/js_css_menu_mover.php 上記のURLの方法なのですが。 この場合、cssの数値を変えて(css12ならcss13)スクリプトを追加すればいいのでしょうが、その方法でやっても、同じ画像が表示されます。 (css13のスクリプトを新しく書き加えたのにブラウザでプレビューするとcss12の内容が表示されてしまいます。) ↓HEAD内のCSS設定部分は下記のように分割して書いてます <script language="javascript"> <!-- function mOver(){ css12.style.display = "block"; } function mOut(){ css12.style.display = "none"; } //--> </script> <script language="javascript"> <!-- function mOver(){ css13.style.display = "block"; } function mOut(){ css13.style.display = "none"; } //--> </script> よろしくお願い致します。

    • ベストアンサー
    • HTML
  • gooブログで 右サイドメニュー消して2段カラムに

    カスタムブルーをCSSで編集 #menu2{ background-color: ; display:none; } このようにすると右は消えたが、ブログの編集・作成も無くなります 何処にどのように表示させたらいいのでしょうか よろしくお願いいたします。

  • WordPress 大文字を小文字にしたい

    WordPress 4.3.1にInvert Liteというテーマを入れてサイトを作成しています。 一部項目のアルファベット表記箇所がすべて大文字で表示されてしまうため、 style.cssのtext-transformでuppercaseとなっていたものを、noneに修正したのですが、 小文字に表示に変わりません。 どのようにしたら変更できるでしょうか。

専門家に質問してみよう