Concrete5でサイトを作る

Concrete5は直感的なインターフェースで非常に優れたCMSです。

css3のtransform: rotateでジャギーがすごい

chromeでcss3のtransform: rotateを使うと、ジャギーが凄いんです。

-moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);

境界線のジャギーが凄い。

背景色と同じborder :1pxを入れるとちょっと緩和するけど、この手はあんまり使いたくないなぁ…。

border: 1px solid #666;
-moz-transform: rotate(2deg);
-webkit-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);

境界線のジャギーが凄い。

ターミナルでディレクトリの削除

EC-CUBEのインストールディレクトリを間違えたので、filezillaで一旦htmlディレクトリを全部削除しようと思ったらなぜかできなかった。

ターミナルで以下のコマンド書いたら「ディレクトリです」って。

$ rm html
rm: cannot remove `html': ディレクトリです

どうやら書き込み保護されているとディレクトリの削除ができないらしい。
こういう場合は、「-r」オプションをつけるといいらしくて。

$ rm -r html
rm: 書き込み保護されたファイル `html/xxxxx.html' を削除しますか(yes/no)? no
rm: ディレクトリ ``html'' を削除できません: ディレクトリは空ではありません

それでも削除できない場合は、「-f」オプションで強制的に削除できました。

$ rm -rf html

やったね!

疑似要素で種類の違うボーダーを引く

↑のh1見出しとか、サイドバーのh3に使ってるボーダーですが、今まで色の異なるボーダーの引き方がわからなくて、いつも背景画像を使っていました。

背景画像を使わずにCSSだけでなんとかしたかった。

で、天から聞こえて来た声が「:after使えばいいじゃない」。

#content article h1 {
    font-weight: bold;
    font-size: 150%;
    text-shadow: 0 0 2px rgba(6, 45, 124, 0.8);
    color: #fff;
    padding: 0 0 10px 0;
    border-bottom: 1px solid #aec5e1;
    margin: 0 0 10px 0;
}

#content article h1:after {
    border-bottom: 1px solid #5e8ec5;
    content: "";
    display: block;
    height: 1px;
    margin: 0 0 -10px;
}

:afterの時に、「content=””」と「height:1px」を入れないとそもそもレンダリングされなかったので、仕方なく入れました。
「margin: 0 0 -10px」は位置の調整用です。

wordpressのテーマをつくります。

予備知識ゼロでこれからwordpressのテーマをつくっていきます。

ちょっと触ってみた感想。

とりあえず新しいテーマを作ろうと思って、デフォルトで入ってたテーマをコピペしていじってみようと思ったら、テーマの説明文やら、作成者やらを記述したファイルが無かった。
こりゃいったいどういう事だと思って、全文検索掛けたらthemesの中のstyle.cssに書いてあった。

なんでテーマの説明文をcssに書かなきゃいけないのか全く持って理解不能。
これどういう理屈なのかなー。

concrete5を使う。

concrete5を使いながらwordpressの勉強をしようと思います。
何を言っているかわからないと思いますが、私も何を言っているかわかりません。