WordPress3.6より、新しいデフォルトテーマ「Twenty Thirteen」がついてきますので早々に対応すべくチェックをしています。今後、リリースまで変更されるかも知れませんが気が付いた所をお知らせします。




まず、気が付いたのは ヘッダー部分が下へスクロールすると簡易的な表示になります。

ここから下へスクロールすると

こんな感じになります。




次に あれ? と思ったのはサイドバーです。ウィジェット投下部分の「Main Widget Area」 はフッター部分に表示されます。「Secondary Widget Area」はサイド(右側部分)になります。

しかし、CSSのid名が フッター部分は「Main Widget Area」なのに#secondary。 サイド(右側部分)部分は「Secondary Widget Area」なのに #tertiary なので最初はちょっと混乱しました。



スポンサードリンク





次は WEBフォントの方法で 「flexible icon-font」 を使用しています。
twentythirteen/style.css
/**
 * Genericons, a flexible icon-font.
 * License: GPL version 2 or any later version with font exception (http://www.gnu.org/licenses/gpl-faq.html#FontException)
 * See also LICENSE.txt and COPYING.txt in the ./fonts directory.
 * Thanks to FontSquirrel for web-font conversion!
 * More info: genericons.com
 */
@font-face {
	font-family: Genericons;
	src: url(fonts/genericons-regular-webfont.eot);
	src: url(fonts/genericons-regular-webfont.eot?#iefix) format("embedded-opentype"),
		 url(fonts/genericons-regular-webfont.woff) format("woff"),
		 url(fonts/genericons-regular-webfont.ttf) format("truetype"),
		 url(fonts/genericons-regular-webfont.svg#genericonsregular) format("svg");
	font-weight: normal;
	font-style: normal;
}



CSSで、 content: "\f303"; というように記述してました。時計マークやフォルダ・鉛筆等、いろいろ入っていそうです。
いいツールがあると思いますが、twentythirteen/font/sgenericons-regular-webfont.svg をIEで開いて(真っ白ですが)ソースを見るとx2000~f100~f503迄設定があったのて試してみてください。




全体的なレイアウトは position を使っています。今までのテーマは float で振り分けていましたが、レイアウト変更やサイズ変更はちょっとハマりそうです。

また、フッター部分のウィジェット表示は jQuery( twentythirteen/js/functions.js )で、振り分けしています。
サイドバーが長いとフッターへ突き刺さるのは わざと なのかどうかも不明ですが、うまく空けているのでそうなのかもしれません。


以上のように、WordPress 新テーマ Twenty Thirteen は さらにレスポンシブという ぐぬぬ仕様になっていますので、これをベースにテーマデザインを変更する場合は覚悟が必要かもしれません。


■「WordPress 新テーマ Twenty Thirteen をチェックしました②」へ



スポンサードリンク

Posted by on 2016/05/02



不動産プラグインポータル