フロントページをレスポンシブデザインにする
このブログをスマホで観た場合、トップページが酷いことになっているので改修していきます。 改修と言っても元々の親テーマ(Xeory Extension)ではレスポンシブデザインに対応しているので、 僕がCSSやサーバーサイドのPHPを改造していった結果めちゃくちゃになっただけです。
CSSでレスポンシブ
当初javascriptでDOMを操作してレスポンシブに対応させようとしていましたが、親テーマでもCSSでレスポンシブを実現しているので、同じようにCSSでレスポンシブデザインを実現しようと思います。
■ドはまりした部分 cssでレスポンシブデザインを作成する場合に[@media]クエリーというのを指定します。 使い方は簡単で例えばですが、以下の様な感じで使います。
/*スマートフォン向け設定*/ /*タブレット向け設定*/ @media screen and (max-width:768px){ } /*PC向けの設定*/ @media screen and (max-width: 1200px){ }
簡単なのになんでドはまりしたか?
[@media]の詳しい使い方については検索した方が早いですが、ちょっと分解して調べてみると、 [@media ①screen and (②max-width: ③1200px)] 3つのパラメータを指定していることは分かりました。
■①について ここは大体が[screen]か[all]を指定しておけば問題なさそうです。 参考:メディアの種類 webブログの場合は、[all]でも問題無さそうに思えます。
■②について 今回のはまりポイントがここでした。 良く考えたら分かりそうななのですが、ここをずっと[max-width]で指定していました。
横幅の指定については、高度な指定方法を除けば、 [max-width]か[min-width]しかありません。
[max-width] : ブラウザの幅がクエリに定義された値より狭い場合にルールが適用されます。 (後述する参考先より引用) [min-width] : ブラウザの幅がクエリに定義された値より広い場合にルールが適用されます。 (後述する参考先より引用)
今回僕はモバイルファーストでCSSを追加していました。 モバイルファーストは先にモバイル向けの小さいディスプレイの定義を書いて、それよりも大きいディスプレイの場合は[@media]で条件分けしようとしていました。 結論を書くと[max-width]で指定していたのでどのディスプレイでもモバイル向けの設定のみ読み込まれていました。 参考:レスポンシブ ウェブデザインの基礎
■③について オマケみたいなもんですが、[max-width]と[min-width]のどちらを使うかによって数値が変わってきそう? [min-width]の方がこれより横幅が大きかったら変えて!という命令なので簡単な気がします。
結局何をどうしたか
長々と書いてきましたが、追加したCSSは下のチョビっとだけですw
/*スマートフォン向け設定*/ body.home .front-loop article.post { border: ridge; height: 12em; width : 100%; margin: 0; } /*タブレット向け設定*/ @media all and (min-width:768px){ body.home .front-loop article.post { width : 32%; } } /*PC向けの設定*/ @media all and (min-width: 1200px){ body.home .front-loop article.post { width : 25%; } }
まだ携帯向けの表示になると画像がハミ出てくるwなど色々ありますが、ひとまず記事の並び変えは問題なさそうです。 ちなみにまだローカルの環境でしか反映していないので、携帯で当ブログ観るとグチャグチャっぷりが見れます。
yumに優先順位をつけよう
先に結論を書いてしまうと「yum-plugin-priorities」というツールを導入します。 参考:yum リポジトリの追加・優先順位を設定 〜 CentOS6
何で優先順位をつける必要があるかと言うと、php7を導入した場合baseのリポジトリではphp5を優先しようとするのでphp7の更新の度に[remi-php70.repo]を有効にしてあげる必要があります。
糞めんどい(´・ω・`)
これだと毎回大変なので「yum update」で済ませたいのです。
そこで活躍するのが、「yum-plugin-priorities」です(`・ω・´)
使い方
上記のツールを導入すると、リポジトリに優先順位をつけることができるようになります。 まずはツールを導入します。
yum -y install yum-plugin-priorities
次にリポジトリに優先順位をつけます。 僕の場合はですが、下記の様にしています。(リポジトリの該当する箇所のみ記載)
# This repository only provides PHP 7.0 and its extensions # NOTICE: common dependencies are in "remi-safe" [remi-php70] name=Remi's PHP 7.0 RPM repository for Enterprise Linux 6 - $basearch #baseurl=http://rpms.remirepo.net/enterprise/6/php70/$basearch/ mirrorlist=http://rpms.remirepo.net/enterprise/6/php70/mirror enabled=1 gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-remi priority=1 [remi-php70-debuginfo] name=Remi's PHP 7.0 RPM repository for Enterprise Linux 6 - $basearch - debu ginfo baseurl=http://rpms.remirepo.net/enterprise/6/debug-php70/$basearch/ enabled=1 gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-remi priority=1
# Repository: http://rpms.remirepo.net/ # Blog: http://blog.remirepo.net/ # Forum: http://forum.remirepo.net/ [remi] name=Remi's RPM repository for Enterprise Linux 6 - $basearch #baseurl=http://rpms.remirepo.net/enterprise/6/remi/$basearch/ mirrorlist=http://rpms.remirepo.net/enterprise/6/remi/mirror enabled=1 gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-remi priority=1
# CentOS-Base.repo # # The mirror system uses the connecting IP address of the client and the # update status of each mirror to pick mirrors that are updated to and # geographically close to the client. You should use this for CentOS updates # unless you are manually picking other mirrors. # # If the mirrorlist= does not work for you, as a fall back you can try the # remarked out baseurl= line instead. # # [base] name=CentOS-$releasever - Base mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=os&infra=$infra #baseurl=http://mirror.centos.org/centos/$releasever/os/$basearch/ gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 priority=2 #released updates [updates] name=CentOS-$releasever - Updates mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=updates&infra=$infra #baseurl=http://mirror.centos.org/centos/$releasever/updates/$basearch/ gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 priority=2 #additional packages that may be useful [extras] name=CentOS-$releasever - Extras mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=extras&infra=$infra #baseurl=http://mirror.centos.org/centos/$releasever/extras/$basearch/ gpgcheck=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 priority=2 #additional packages that extend functionality of existing packages [centosplus] name=CentOS-$releasever - Plus mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=centosplus&infra=$infra #baseurl=http://mirror.centos.org/centos/$releasever/centosplus/$basearch/ gpgcheck=1 enabled=1 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 priority=2 #contrib - packages by Centos Users [contrib] name=CentOS-$releasever - Contrib mirrorlist=http://mirrorlist.centos.org/?release=$releasever&arch=$basearch&repo=contrib&infra=$infra #baseurl=http://mirror.centos.org/centos/$releasever/contrib/$basearch/ gpgcheck=1 enabled=0 gpgkey=file:///etc/pki/rpm-gpg/RPM-GPG-KEY-CentOS-6 priority=2
更にbaseの方にPHP関係ではこのリポジトリは使用しない 「exclude=php*」をつけた方が良いのかもしれませんが、今のところはつけていません。
注意
今回の記事は僕の場合の話です。 「yum update」をする場合は「-y」オプションをつけないで何がアップデートされるか1度は必ず確認してから行ってください。
おじさんになった話
昨日、兄に子供が出来たので、叔父さんになりました。 出産祝いにイモムシみたいなパジャマでもプレゼントしようと思います。
話はおじさんに戻りますが、僕は昔からおじさんに憧れに近いものがありました。 今思うとおじさんアコガレだったのかもしれません。
ただ、僕は自分がおじさんだということに抵抗はありませんでした。 それは将来なりたい人物像が高田純次だったからというのがあったのですが、リアルガチのおじさんになるとは。
僕のおじさん像
兄の子供から見たら僕は完全におじさんになる訳ですが、会社とか社会的なおじさん像って曖昧だと思っています。 何となく他人を見た時に、20歳くらい離れて居たら「おじさん」と認識している気がしていますが、現職の職場だと社長以外20歳以上離れている方がおそらくいないので「この人おじさんだな」と思う方がほぼいません。 加えて大体の方が私服なので「おじさん=スーツ≒高田純次」が成立しません。(※余談ですがニアイコール[≒]の記号って日本ローカルらしいです)
僕はスーツを着るのが年に数える程しか無いので、服装もほぼ大学生の時と変わっていません。 体の変化があるとすれば朝ヒゲを剃っても夕方にはジョリジョリしてる程度です・・・。
windows10で3TBのHDを認識しない
追記:2016/10/23 Partition Master FreeというソフトでMBR(2T制限)からGPT(2TB以上)に変換出来ました。
HDから異音がしたので、データを移したばかりですが、ちょっとした疑問が出てきました。
未割り当て多すぎない?
あんまり値段が変わらないので3TBのHDを購入しましたが、2TBしか使えていません。 HDの容量を全て使える訳では無いことは理解していますが、さすがに多すぎる。
AHCIに対応させる
参考:Windows 10でAHCIへ変更(SSD等に入替えた時) これはどうやらAHCIという規格(モード)に切り替えないと2TB以上は認識できないようです。 ちなみにですが、2TB以上のデータを扱わない場合でもAHCIにすることで転送速度が上がるらしいです。
おそらくマザーボードやBIOSはAHCIに対応しているようです。
レジストリの値を変更するとAHCIモードに出来るっぽいが検索した限りだとOSなども再インストールになる可能性が・・・。
昨日はDドライブ以外全部消えてもいいって書いたけど・・・やっぱり消えてほしくない。 もう少し調べて安全に移行できそうなら以降します。
移行ツールがMSにあるのですが、下記のような感じなので自分でレジストリ書き換えるしか無いのかな?
フォーマットの問題?
AHCIも関係あるかもしれませんが、ディスクのフォーマット時にGPTディスクとしてフォーマットすれば使えるとも出てきます。 参考:これで楽勝!? 3TB HDDをWindowsで使うツボを解説 フォーマット時に気にしていませんでしたが、GPTディスクが選択できるか試してみて、ダメだったらAHCI自体に対応出来ていないので、 やっぱりレジストリをイジる必要がありそうです。
追記: フォーマットにGPTディスクが出てこなかったので、AHCIに切り替える必要があるようです。
windows8までならシステム変換ツールがMSから提供されているので、それを使うのが無難です。 このページの「iata_cd.exe」をDL。 参考:HDD容量が3TBのWD30EZRXが746GBと認識される問題の解決方法! windows10用だけなんでないねん・・・。
追記: 2TBの壁と関係ないのですが、新しい外付けのHDケースを買ってきたので、なんらかの理由で外したHD入れてPCに繋いでみました。 繋いだところ特に問題なく使えるので何で外したか自分でも分からなかったのですが、2時間に一回くらい「ブィィィィィ!」とけたましい音が鳴るので、外した理由が分かりました。
ハードディスクから異音が
カリカリカリカリ・・・。 ハードディスクから異音がするようになりました。
データを移したいけど・・・
カリカリ音がしても以外と長い期間頑張ってくれた経験があったので、悠長に構えていました。 丁度メモリも増設したいし、SSDを買って増設もしていなかったので、ついでに新しいHDにカリカリ音がするハードディスクのデータを移すことにしました。 デスクトップPCの本体って結構重いんですよね。 優しく横にする予定が結構な衝撃をPCに与えてしまいました。
ハードディスクが認識されなくなった
Dドライブが無くなっています。
BIOSで見ても認識していない。(SATA4が問題のハードディスクです)
ケーブルを指し直したり、PCを横にしたまま起動するとなぜか認識するようになったので、優しく新しいHDにデータを移しました。 問題は元Dドライブの使い道ですね。 フォーマットし直しましたが、いつ壊れてもおかしくないので外付けにしようとは思いますが、消えてもいいデータを保存するって何に使っていいか分からないですね。