WordOnsen in 福島飯坂 2014 応募時の質問と回答
-
Upload
kazue-igarashi -
Category
Internet
-
view
241 -
download
5
description
Transcript of WordOnsen in 福島飯坂 2014 応募時の質問と回答
![Page 1: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/1.jpg)
応募時の質問
![Page 2: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/2.jpg)
_sがらみの話が知りたいかなぁ
![Page 3: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/3.jpg)
_s (Underscores)http://underscores.me/
• Automattic社のテーマチームが開発したスターターテーマ
• カスタマイズされること前提
• GitHub で管理・開発
• GPL v2.0 オープンソース
![Page 4: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/4.jpg)
ちなみに• 元々、css を書き換えればOKの公式テーマがあった
• Sandbox
• Toolbox
• Toolbox を元に _s が作成された(ので Toolbox は現在配布停止)http://theme.wordpress.com/retired/toolbox/
![Page 5: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/5.jpg)
公式サイトのジェネレーターが簡単• 「Theme Name」の欄に名付けたいテーマ名(テキスト)を入力し、「GENERATE」ボタンを押すだけ
• Advanced Options
• Theme Slug:テーマのディレクトリ名
• Author:テーマ作者名
• Author URI:テーマ作者のURL
• Description:テーマの説明
• _sassify!:sassファイルの有無
• 関数のプレフィックスや翻訳ファイル用のテキストドメインなどが入力したテーマ名に変更されたテーマファイル(.zip)がダウンロードされる。
![Page 6: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/6.jpg)
_s の日本語ファイル(.moファイル)https://github.com/gatespace/_s/blob/ja/languages/ja.mo
![Page 7: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/7.jpg)
コーディング概要• HTML5
• IE9以上
• カスタムメニュー 1箇所
• ウィジェットエリア 1箇所
• レスポンシブ(600px)
• Reset CSS、normalize.css、Blueprintでリセット
• WordPressで必要なcssクラスはstyle.cssに記載済み
![Page 8: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/8.jpg)
iemotohttps://github.com/megumiteam/iemoto• WordPressテーマ用の
grunt-init テンプレート
• _s + Sass + ja.mo
• アクションフックたくさん
• Grunt or glip.js でjs のチェックと sass のコンパイル
![Page 9: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/9.jpg)
日記を書くくらいの用途でしか使ってませんが、勉強してみたいと思いました。写真や画像の、良い管理方法などがあれば知りたいと思っています。
![Page 10: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/10.jpg)
WordPressのメディア
• アップロードされたメディアは投稿タイプ「attachment」としてデータベースに諸情報が登録される
• メディアライブラリから参照できる
• アップロード場所は /wp-content/uploads/*
• アップロード時にサムネイルが作成される
![Page 11: WordOnsen in 福島飯坂 2014 応募時の質問と回答](https://reader033.fdocuments.net/reader033/viewer/2022052316/55982d191a28abb9088b45f2/html5/thumbnails/11.jpg)
写真が多ければ 外部サービスおすすめ
• flickrhttps://www.flickr.com/
• Instagramhttp://instagram.com/
• 上記2サービスはWordPressの oEmbed に対応しているので、投稿の本文に写真のURLを入れるだけで簡単に表示できるhttp://codex.wordpress.org/Embeds