Wb_kyoto_haruna1221

884 views

Published on

WordBench京都
実例で紹介!子テーマを使ったデザインTips

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
884
On SlideShare
0
From Embeds
0
Number of Embeds
41
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Wb_kyoto_haruna1221

    1. 1. 実例で紹介!子テーマを使ったデザインTips 12012.7 .22 WordBench京都 @haruna122
    2. 2. @haruna1221京都でWEB/DTPデザイナー。ぴんくな人。iPhoneとかPinkが好き。趣味はカメラとダーツ。PENTAXピンクのK-rDiana F+/mini
    3. 3. goryugo.com
    4. 4. #wbkyoto
    5. 5. 平凡なWordPressテーマでオリジナリティがなく #wbkyoto背景やヘッダーが無彩色で地味
    6. 6. #wbkyoto
    7. 7. テーマのデザイン1.参考サイトデザインをクライアントと共有2.クライアントの希望をもとに Photoshopでデザイン3.psdデータから必要なパーツを書き出し4.WordPress Twenty Elevenをベースに 子テーマを作成
    8. 8. クライアントとのデザイン共有FirefoxのアドオンPearl Crescent Page Saver でデザインを保存して、Evernoteのノート作成→共有
    9. 9. 子テーマって?WordPressの子テーマとは親テーマを元に機能やデザインの調整がとても簡単にできるテーマのこと。親テーマにはまったく手を加えないので、親テーマがアップデートされた場合も子テーマは変更されない。
    10. 10. 子テーマの作り方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);
    11. 11. 子テーマの作り方WordPressのダッシュボード内でテーマが選択できるようになる
    12. 12. テンプレートファイル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)
    13. 13. 本日のまとめPearl Crescent Page Saver おすすめ! クリップデータを自動でEvernoteへEvernoteで共有するととても便利! 複数人との共有も可能子テーマを使って実装すると簡単!
    14. 14. @haruna1221 おしまい ご静聴ありがとうございました。 本日のスライドや参考URLなどは後日 http://inbox.sow-zow.comにて公開予定です。

    ×