【備忘録】WORDPRESSのテーマtwenty twelveのレスポンシブテーマを無効にする方法

以下、参考にした記事:
http://stackoverflow.com/questions/11425230/override-css-media-queries
http://stackoverflow.com/questions/14683659/edit-or-disable-responsive-menu-in-wordpress-twenty-twelve-theme
http://stackoverflow.com/questions/14356982/how-to-remove-the-responsive-code-from-the-twenty-twelve-theme

結局決めてはこれ:
http://wordpress.org/support/topic/remove-the-responsive-code-from-the-twenty-tewlve-theme

ようはfunctions.phpに書いてある、navigation.jsを無効にして、
勝手に幅に合わせて変わるナビを無効に。
(header.phpの中にもレスポンシブを呼びだすタグが含まれていたらそれを取り除く)

その後、style.cssのmedia queryを丸ごと削除。
または無理矢理適用させたいスタイルをmedia query後に!importantをつけて記述。

と言った所ですかね。

とかいていたのですが、WORDPRESSが新しくなってからの
新しい対処方法として素晴らしく簡単なことが書いてあったので追記として
更新します。(2014年2月10日追記)

上記に書いた事全て忘れて、下記の事をすればいいっぽいです。
上で薦めたリンクにさらに投稿がされてある、書かれてました。

style.cssを開いて

@media screen and (min-width: 600px)
の箇所をみつけて、
@media screen and (min-width:300px)
に書き換えます。

そして下記の記述をcssの最後にもっていきます。 :

 

#page {
width:1000px; /* またはあなたが決めたサイトの幅 */
}

かなり手間が省けて感激です。

そして、これも使えますね。
http://josiahaltschuler.com/tutorials/how-to-make-the-wordpress-twenty-twelve-theme-non-responsive/

ーーー

ただ、これは現状のWPの基本のテーマなので、
バックアップとってからいじった方がよさげです!

備忘録:開発環境では、勝手にrailsのコードを別のページに持っていかない。

railsのコードをあるページから別のページへもっていくのはアカン!ヒロ君のお部屋にあるおもちゃは!ヒロ君のお部屋で遊びなさい!違う部屋にもっていって散らかすんじゃない!

つまり、違うところにもっていっちゃうのはNG。
そのページに対応したコードを書いてるのに、違う部屋に持っていくと根本的に違うからエラーが怒る。

逆も然り。隣の家のお兄ちゃんのおもちゃを勝手に持ってきて自分の部屋で遊ぶな!

以下同文

ブラウザ間でめんどくさいズレをなんとかする為のcssハック

ウェブの案件でサイトを作っていて、
ブラウザ間(IE6,7は気にしません)でのズレをなんとかしたいと思って、
色々調べてたらcssハックにたどり着いたので(当たり前ですが)
自分用にまとめました。

 

Google ChromeSafari用:

①:
@media screen and (-webkit-min-device-pixel-ratio:0) {}

参考アドレス:http://mahaveersingh.wordpress.com/2010/10/31/css-chrome-fix-chrome-alone-css-hack/

②:
body:nth-of-type(1) #style_huck { color: #333333; }
body:first-of-type #style_huck { color: #333333; }

参考アドレス:http://webtips-blog.com/2011/02/15/csshuck/

 

Firefox用:

①:
Fx 1.5, 2.0 以降に適用 #style_huck x:-moz-read-only { color: #333333; }
Fx 3.0 以降に適用 #style_huck x:-moz-broken { color: #333333; }

②:
Firefox2のみ有効
#selector, x:-moz-any-link {
property: value;
}

Firefox3のみ有効
/* Target Firefox 2 */
#selector, x:-moz-any-link {
property: value;
}

/* Then overwrite for Firefox 3 specifically */
#selector, x:-moz-any-link, x:default {
property: value;
}

備忘録:Ruby on RailsではIndentはスペース2個が良い

Yさん:「コーーーーーードきたねえええええええ!」
徹夜明の俺:(....怒らねーでケロ)
Yさん:「Indentめちゃくちゃじゃねーか!コードレビューワーがトチ狂うぞ!」
俺:「試しながらやってるからいちいちそろえらんねーーよ!」
Yさん:「俺も試しながらやってるけどIndentはちゃんとやってるんだよ!」

結果:Ruby on RailsでIndentはspace2個。
常にちゃんとIndentでみやすいコードを心がけろ。バカヤロー。

備忘録:bootstrapでmodalが影の下に表示されてしまう場合

twitter bootstrap使いながらcoding中、

modalをナビゲーションに追加して、

どこでもモーダル開いて投稿できるようにしようとしたら、

エラーが。

 

毎回、modalがmodal表示時にページ全体に敷かれるグレーの影の

下に表示されてしまっていた。

 

これは、bootstrapの仕様でpositionがabsoluteになっている要素の中に、

modalを追加するとそうなってしまうらしい。

 

なのでそういう時は、もうボーン!と

外に置いてあげる。

<nav>

</nav>

<div class="modal">

</div>

て感じで。

 

また一つ勉強。

 

んちゃ!