Wb_kyoto_haruna1221

実例で紹介！子テーマを使ったデザインTips 12012.7 .22 WordBench京都 @haruna122

@haruna1221京都でWEB/DTPデザイナー。ぴんくな人。iPhoneとかPinkが好き。趣味はカメラとダーツ。PENTAXピンクのK-rDiana F+/mini

goryugo.com

#wbkyoto

平凡なWordPressテーマでオリジナリティがなく #wbkyoto背景やヘッダーが無彩色で地味

#wbkyoto

テーマのデザイン1.参考サイトデザインをクライアントと共有2.クライアントの希望をもとに Photoshopでデザイン3.psdデータから必要なパーツを書き出し4.WordPress Twenty Elevenをベースに子テーマを作成

クライアントとのデザイン共有FirefoxのアドオンPearl Crescent Page Saver でデザインを保存して、Evernoteのノート作成→共有

子テーマって？WordPressの子テーマとは親テーマを元に機能やデザインの調整がとても簡単にできるテーマのこと。親テーマにはまったく手を加えないので、親テーマがアップデートされた場合も子テーマは変更されない。

子テーマの作り方wp-content > themes にフォルダ作成style.css @charset "utf-8"; /* Theme Name: goryugocom 子テーマの名前※必須 Theme URI: http: //example.com/ 子テーマのWEBページ Description: Twenty Eleven の子テーマテーマの説明 Author: goryugo テーマの作者名 Author URI: http: //goryugo.com/ 作者のWEBページ Template: twentyeleven 親テーマのディレクトリ名 ※必須 Version: 0.1.0 バージョン */ @import url(../twentyeleven/style.css);

子テーマの作り方WordPressのダッシュボード内でテーマが選択できるようになる

テンプレートファイル1. content-page.php (content-page.php)2. content-single.php (content-single.php)3. コメント (comments.php)4. サイドバー (sidebar.php)5. フッター (footer.php)6. ヘッダー (header.php)7. メインインデックスのテンプレート (index.php)8. 単一記事の投稿 (single.php)9. 固定ページテンプレート (page.php)

本日のまとめPearl Crescent Page Saver おすすめ！クリップデータを自動でEvernoteへEvernoteで共有するととても便利！複数人との共有も可能子テーマを使って実装すると簡単！

@haruna1221 おしまいご静聴ありがとうございました。本日のスライドや参考URLなどは後日 http://inbox.sow-zow.comにて公開予定です。

Wb_kyoto_haruna1221

by Haruna Kitakoji on Jul 22, 2012

Accessibility

Categories

Upload Details

Usage Rights

2 Embeds 33

Statistics

Wb_kyoto_haruna1221 Presentation Transcript

https://twitter.com	29
https://si0.twimg.com	4