「YUI Compressor」による圧縮と「ThemeTestDrive」の導入、あと「date.php」を作成しました。

ちわーす。
カスタマイズぅ~、かっぱふぅ@kappafoo )です。

今日は、久しぶりに時間が取れましたので、このサイトのテーマについて、またイジってみました。

logo

By: Nelson Felix Giga



先日、これからカスタマイズしたいことの記事にしていた次の3つ

・「JQuery」のお勉強
・「Online YUI Compressor」によるサイトの軽量化
・「WP Theme Test Drive」プラグインの導入

のうち、2つを実行してみました。

まずは、「Online YUI Compressor」によるサイトの軽量化です。
このサイトでは、CSS/javaScriptを圧縮軽量化してくれるます。

私のサイトではJavaScriptは外部サイトのを使用している(ここも手を入れたいところ)ので、CSSのみ圧縮してみました。

「Online YUI Compressor」のサイトに行き、

圧縮1

赤丸の場所で「ファイル選択」して、File Typeを「CSS」にします。
赤線のところではオプションでCSS内の’}’で改行するかが選べます。

その後「Compress」をクリックすると、しばらくして、

圧縮2

「Compressed Code」の部分に圧縮されたCSSが記述されてます。

今回、私の「style.css」は「52%」圧縮されました。

「Download Compressed File」で右クリックして保存すると、圧縮されたファイルが保存できます。
なお「Download Gzipped Compressed File」から保存すると、.gzファイルが保存できます。

メモ帳で開くとこんなかんじ、

圧縮3

なんのこっちゃか、分かりません。
しかし、このCSSファイルでも、ちゃんとサイトが表示されます。

すごいです。

次は「WP Theme Test Drive」プラグインの導入です。

このプラグインはWordPressにログインしている人だけ、別のテーマを表示することができます。
つまり、これでテーマのテストができます。

さっそく、導入です。

ダッシュボードのプラグインから、新規にインストールすると、

圧縮4

ダッシュボードの「外観」のところに「Theme Test Drive」が出てきます。

圧縮5

赤丸のところをテストしてみたいテーマにして(今回は「TwentyEleven」)、「Access level」を「10」にしておきましょう。

「Enable Test Drive」をクリックすると、あら不思議...

ログインしているときは「TwentyEleven」のテーマで、

圧縮6

ログアウトすると、いつものテーマで表示されます。

圧縮7

これは、テーマをイジるのが捗りそうです。

さて、今日の3つめは「JQueryのお勉強」ではなく...

月別ページを作成するテンプレートの「date.php」を作成しました。

今日の備忘録は次の表現、

こんなページができあがりました。

圧縮8

今日は、ここらで時間切れ。

今後は「category.php」「tag.php」の作成と「home.php」の改良をしたいと考えています。

いつになったら、デザインをイジれるようになるんだろう...その前にデザインのセンスが必要かも...

ちなみに、今回お世話になった本です。

この記事が参考になったら、シェアしてください

 

 

関連記事も見てください

テーマ1スマートフォン用のWordPressのテーマはどうしよう? (2012.08.27)
「かっぱふぅ雑記帳」を考える。その5 (2012.08.03)
FeedBurner3WordPressにFeedBurnerのプラグインとブログパーツを貼り付けました。 (2012.08.23)
テーマ2レスポンシブデザインでWordPressのテーマを作製しました。 (2012.09.06)
wordpressWordPressで作製している私のサイトでやってみたいことアレコレ。 (2012.11.07)

RSSの登録で最新記事をお届けします

フォローしてもらえると嬉しいです

F

コメントをどうぞ

メールアドレス (必須・公開されません)
コメント本文

  • スパム・迷惑コメント投稿防止のため、メールアドレスの入力が必須ですが、公開はされません。何卒ご協力のほどお願いいたします。
  • 投稿いただいたコメントは管理者のチェック後掲載しておりますので、即時には反映されません。

▲Pagetop