sacss vol. 24

Post on 27-Jun-2015

1.188 Views

Category:

Technology

3 Downloads

Preview:

Click to see full reader

DESCRIPTION

2011年5月14日に行なわれた SaCSS vol. 24 の発表資料。一部加筆修正をしてあります。

TRANSCRIPT

WordPress を自分好みにSaCSS vol. 24

understandard

1

今日の内容

• 自己紹介

• WordPress のインストール

• フックとは

• フック実演

2

2

3

自己紹介

3

4

自己紹介• すぎもとじゅん

• 都内ウェブ制作会社勤務

• WordPress は主に趣味で使用

• understandard というサイトをやってます

4

5

WordPress のインストール

5

WordPress のインストール1. 最新の WordPress をダウンロードし、解凍

2. データベースを用意

3. 解凍したファイルをサーバーにアップロード

4. アップロード先/wp-admin/install.php にアクセス

5. 指示に従いデータベース情報やサイト名などを入力

6. インストール完了

6

6

がっかり?

7

もし分からないことがあれば検索してみましょう。同じ箇所でうまくいかなかった方が記事を書いてくれていたり。

また、め組さんがコピーレフトでマニュアルを配布されています。WordPressのユーザーマニュアルBeta ( http://megumi-manuals.com/ )

7

8

テーマとプラグイン

8

9

テーマ• 公式テーマディレクトリに1,361テーマ登録

3000万回以上ダウンロードされている(2011年5月13日時点)

• 個人配布のテーマもある

• どちらを使う場合でも中身をちゃんと確認(変なコードが埋めこまれていないか)

9

10

Twenty Ten

• WordPress 3.0からのデフォルトテーマ

• ソースコードにコメントがたっぷり

• 勉強するには良いテーマ

• 親テーマとして利用されることも多い

10

11

テーマとプラグインでも英語・・・orz

11

12

テーマとプラグイン

Twenty Ten テーマのコード内の説明を日本語化しました | Odysseygate.com

http://www.odysseygate.com/archives/1651

おでさんが翻訳記事書いてくれてます

@odyssey

12

13

テーマとプラグインTwenty Ten 以外にも勉強用テーマとして

ManabiTheme初級編 http://bit.ly/kWUY36

中級編 http://bit.ly/m9eJXT

mypace customhttp://bit.ly/mHn65o

mypace custom Vhttp://bit.ly/jVpGfg

Toru さん(@waviaei) K さん(@mypacecreator)

13

14

テーマとプラグイン• WordPress はプラグインも豊富

• 公式プラグインディレクトリに14,376個登録1億7000万回以上ダウンロードされている(2011年5月13日時点)

• フォーム、メルマガ配信、カート機能、ソーシャルサービスとの連携などなど

14

15

テーマとプラグイン

やりたいことがあればまずは

「WordPress 欲しい機能」でググってみましょう

15

16

これだけだとWordPress を紹介してるだけ

16

17

フックとは

17

18

フックって何?

•プラグインの根幹

• 2つに分けられる

•フィルターフック

•アクションフック

18

19

フィルターフックとアクションフック

WordPress から受け取った内容を、変更して WordPress に戻す

フィルターフック

WordPress とのやりとり必要なし独自の処理を実行

アクションフック

19

20

フック実演

20

21

フック実演

functions.php 記述するだけ!簡単カスタマイズ

21

22

管理バーをコントロール• 管理バーは ver. 3.1から WordPress に導入

• ログイン中にサイトを見ると表示される

22

23

管理バーをコントロール

function my_function_admin_bar(){ return false;}add_filter('show_admin_bar', 'my_function_admin_bar');

管理バーを一括非表示に

add_filter('show_admin_bar', '__return_false');

↑上を省略すると下になる

23

24

管理バーをコントロール

function __return_false(){ return false;}

function __return_true(){ return true;}

function __return_zero(){ return 0;}

前のページに出てきた「__return_false」は、WordPress 3.0から追加された関数で、単純に false を返すだけ。

その他に「__return_true」、「__return_zero」があり、それぞれ true と0を返します。

24

25

管理バーをコントロール

add_action('admin_print_styles-profile.php', 'disable_admin_bar_prefs');

function disable_admin_bar_prefs() {?> <style type="text/css"> .show-admin-bar {display: none;} </style><?php}

先程のコードで管理バーが非表示になりますが、プロフィール画面にはチェックボックスが残ってしまいます。※ ここで選択しても管理バーのオンオフには影響しません

プロフィール画面からチェックボックスを消すには以下のコードを追加

25

26

管理バーをコントロール

function my_function_admin_bar($content){ return(current_user_can("administrator")) ? $content : false;}add_filter('show_admin_bar', 'my_function_admin_bar');

管理者のみ管理バーを表示

function my_function_admin_bar($content){ return(current_user_can("edit_pages")) ? $content : false;}add_filter('show_admin_bar', 'my_function_admin_bar');

管理者と編集者のみ管理バーを表示

※ 各権限がデフォルト設定のままの場合

26

27

管理バーをコントロール

function my_function_admin_bar($content){ global $user_login; return($user_login === 'hoge') ? $content : false;}add_filter('show_admin_bar', 'my_function_admin_bar');

ユーザー “hoge” のみ管理バーを表示

※ あまり使い道ないかも

27

28

管理バーをコントロール

define('SAVEQUERIES', true);define('WP_DEBUG', true);define('WP_DEBUG_DISPLAY', false);

Debug Bar というプラグインをインストール

参考: WordPress 開発に便利なプラグイン Debug Bar : dogmap.jp

http://dogmap.jp/2011/03/08/wordpress-debug-bar/

wp-config.php に以下の3行を追加

28

29

管理バーをコントロール

どんな Query が実行されているか分かる

29

30

出力をコントロール

the_content() と the_excerpt()

の出力をカスタマイズ

30

31

出力をコントロール

function custom_more($output) { $output = preg_replace('/#more-[\d]+/i', '', $output); return $output;}add_filter('the_content_more_link', 'custom_more');

the_content() で出力した時に続きを読むリンクにつく#more-XXX を削除

31

32

出力をコントロール

function change_excerpt_mblength($length) { return 20;}add_filter('excerpt_mblength', 'change_excerpt_mblength');

the_excerpt() の制限文字数を変更する

デフォルトでは110文字 の表示数を自由に設定※ WP Multibyte Patch を使用している場合

32

33

出力をコントロール

function more_text($more) {! return '';}add_filter('excerpt_more', 'more_text');

the_excerpt() で表示される「[...]」を削除

33

34

最後に

34

35

WordPress で困ったら

•じっくり考えてみる

•検索してみる

•フォーラムを見る、聞く

35

36

それでも分からない時は・・・

36

37

WordPress のおぢさんに聞きましょう

37

thanks!

38

top related