Wordbench富山勉強会2015年3月第1回

概要

日 時:
平成27年3月21日 (土・祝) 13:00〜16:00
場 所:
越中万葉かふぇ・歌音(高岡市万葉歴史館)
参加者:
古川さん(司会)、神垣さん(ナビ)、太田さん、古谷さん、熊野さん、松山さん、稲垣さん、谷口 8名
テーマ:
「WordPressのテーマを作ってみよう!」 後半
» 神垣さん資料を表示

皆さんからの告知やおすすめ機能紹介など。

  • 4月よりWordbenchの開催は月1回とし、各月で富山開催(平日)、伏木開催(土曜)となります。次回4月開催は富山開催です。
  • Wordbenchの資料や議事録投稿の際、投稿記事に個別にCSSを適用できるようになりました。編集画面にあるAdd CSSから追加が可能です。また、神垣さんがカスタム投稿タイプに対応したバージョンに書き換えてgithubにアップロードしていただいています。
    » ダウンロードぺーじへ
  • snsでの投稿時に #wbtoyama (#ハッシュタグの前後にはスペースが必要なようです)を追加して投稿すると同じイベントの参加者同士で情報を共有する事ができるようになります。書記の手助けにもなるので、使いましょう。
    検索フィールドに#wbtoyamaを入力して検索すると、WB富山勉強会のコメントや情報を一覧できるようになります。

WordPressのテーマを作ってみよう!
「6.続いて実際にテーマを作っていきましょう」より

テーマファイル作成

前回のスタイルシート編集からひき続き、Workshop形式で行いました。
神垣さん資料のコチラからダウンロードしてください。より空のテンプレートファイルのサンプルをダウンロードし、解凍。

style.cssとindex.phpの編集
style.css, index.phpをテキストエディタで開き、各々資料に掲載されているコードを入力・保存。
style.cssとindex.phpがあればテーマとして認識してくれる。
style.cssには書き方に一定のルールがあり、それに従って記述。/* */も必要です。
アップロード・有効化・テーマの確認
手順は資料の「テーマのアップロード」「テーマの有効化」「テーマを確認」を参照。
テーマファイルを一度アップロードしてしまえば、WordPressの管理画面から編集することができる。
パソコンで編集してzipでアップロードという方法と管理画面からの編集、どちらでやってもよい。
管理画面からの編集後、下部に[更新]ボタンが表示されない場合はパーミッション(権限)を[777]に変更して試してしてみる。

パーツファイル編集

勉強会では管理画面の 外観 > テーマの編集で header.php(ヘッダーテンプレート), footer.php(フッターテンプレート), index.php(メインのインデックステンプレート),single.php(投稿ページテンプレート)各々資料に掲載されているコードを入力・保存。
手順は資料の「パーツファイルについて」を参照。
表示の確認
パーツファイルのアップロードができたら、うまく表示されない場合にはタイプミスなどをしていないかを確認。
<?php の「?」と「php」の間には空白は入れないように注意。コードの末尾には;(セミコロン)も忘れずに!
テンプレートタグ
WordPressでは<?php xxxxx ?>で囲まれたもの、またその中身を「テンプレートタグ」と呼びます。
» テンプレートタグ詳細
勉強会
休憩中

テーマ作成で便利な機能

ソースコードの見方について
ブラウザ上で右クリックして「ソースを表示」をクリックでHTMLのコードを見る事ができる。
要素を検証について
ブラウザ上で右クリックして「要素を検証」をクリックでHTMLの検証が行える。 (IEの11でも可能)
検証したい部分をクリックして「要素を検証」するとその部分をフォーカスして表示してくれるので、Stylesタブに表示されるcssの記述や適用を確認するのに便利。
プライベートウィンドウについて
ブラウザにアクセスやダウンロードの記録を残さずにインターネットを閲覧できる機能。
Firefoxでは「プライベートウィンドウ」、Chrome「シークレットモード」、Safariでは「プライベートモード」、IE「InPrivate ブラウズ」。
開発中にブラウザの履歴が残ってしまうのを防いだり、WordPressにログインしている時でも、ログインしていない状態を同時に確認できる。また、ネットカフェなどで自分以外の人が利用するPCでインターネットを閲覧する時などにも利用される。
ダミー記事の投稿について
投稿データがないと投稿一覧表示されないので、テーマ作成を行う際にはダミーデータをダウンロード、画像ファイルの場合はダミー画像を作って作ってくれるPlacehold.jpなどのサービスを利用すると便利。

ダミー記事の投稿

ダミー記事ダウンロード
ブラウザ上で右クリックして「ソースを表示」をクリックでHTMLのコードを見る事ができる。
https://github.com/jawordpressorg/theme-test-data-ja の右側にある「Download」をクリックしてデータをダウンロードします。
ダミーデータのアップロード
管理画面の ツール > インポートより[ WordPress ]をクリック。初めての場合は「WordPress Importer」プラグインインストール画面が表示されるので、インストールする。
インストールが完了したら、[プラグインを有効化してインポートツールを実行]が表示されるので、「ファイルを選択」でxmlファイルをアップロード。
ダミーデータの確認
管理画面の 投稿 > 投稿一覧でよりデータがインポートされているのを確認。

以上で「WordPressのテーマを作ってみよう!」の勉強会終了しましたが、資料に続きの手順が書いてあるので、参考にしてオリジナルのテーマを作ってみましょう。

富山ベーカリーマルシェ・ランチ会報告

ベーカリーマルシェ・ランチ

勉強会が始まる前に富山ベーカリーマルシェでWB富山のグルメ番長に朝から行列に並んで買ってきてもらったパンでランチ会をしました。
10種類以上のパンを切り分けてもらってディップソースや能登ミルク、飲むヨーグルトなどと一緒にいただきました。
みんなで食べるといろんな種類のパンを味わえるし、パンの材料当てなどもできて楽しいかったです。
古川さんいろいろと準備してもらって、どうもありがとうございました(^^)。

次回開催予定

日程はまだ決定していませんが、4月は富山市開催(平日)となります。
後日、古川さんと神垣さんよりFacebook等で発表していただきます。