Launch a Web Service in 3 Days Using WordPress

43
Launch a Web Service in 3 Days Using WordPress WordPress を使って3日で作るウェブサービス Case : 失恋.jp 失恋” means heartbreak in English

description

 

Transcript of Launch a Web Service in 3 Days Using WordPress

Page 1: Launch a Web Service in 3 Days Using WordPress

Launch a Web Service in 3 Days Using WordPress WordPress を使って3日で作るウェブサービス

Case : 失恋.jp

“失恋” means heartbreak in English

Page 2: Launch a Web Service in 3 Days Using WordPress

ABOUT ME 自己紹介

KITE カイト

Web Designer, Programmer, Web Director, Graphic Designer, Art Director, Creative Director…

Page 3: Launch a Web Service in 3 Days Using WordPress

SNS ソーシャルネットワークアカウント

Kaito Koga https://www.facebook.com/kaito.koga.9

Facebook Twitter

KITE@ixkaito https://twitter.com/ixkaito

Page 4: Launch a Web Service in 3 Days Using WordPress

http://失恋.jp/ (http://heartbreak.jp/)

Page 5: Launch a Web Service in 3 Days Using WordPress

TODAY’S THEME 本日のテーマ

The Impulse 開発のきっかけ

Why WordPress? WordPress を選んだ理由

Plugins and Customization プラグイン、カスタマイズ

Page 6: Launch a Web Service in 3 Days Using WordPress

THE IMPULSE きっかけ

Access http://heartbreak.jp! 「失恋.jp」に書いてあります。

Today, let me talk about more details. 今日はもう少し詳しくお話しましょう。

Page 7: Launch a Web Service in 3 Days Using WordPress

http://www.lifehacker.jp/

Page 8: Launch a Web Service in 3 Days Using WordPress

http://www.roomie.jp/2013/05/77444/

Page 9: Launch a Web Service in 3 Days Using WordPress
Page 10: Launch a Web Service in 3 Days Using WordPress

Need a web service for heartbreak! 失恋を癒やすウェブサービスを作ろう!

Page 11: Launch a Web Service in 3 Days Using WordPress

Post 投稿機能

Comment コメント機能

FUNCTIONS 必要機能

Page 12: Launch a Web Service in 3 Days Using WordPress

Post 投稿機能

Comment コメント機能

FUNCTIONS 必要機能

It’s WordPress! WordPress じゃん!

Page 13: Launch a Web Service in 3 Days Using WordPress

Simple シンプル

Responsive レスポンシブ

DESIGN デザイン

Page 14: Launch a Web Service in 3 Days Using WordPress

Simple シンプル

Responsive レスポンシブ

DESIGN デザイン

It’s Twenty Twelve! Twenty Twelve じゃん!

Page 15: Launch a Web Service in 3 Days Using WordPress

• Membership:Anyone can registerだれでもユーザー登録できるようにする

• New User Default Role:Author 新規ユーザーの権限を「投稿者」にする

SETTINGS 設定

Page 16: Launch a Web Service in 3 Days Using WordPress

PLUGINS プラグイン

Page 17: Launch a Web Service in 3 Days Using WordPress

http://wordpress.org/plugins/login-lockdown/

Page 18: Launch a Web Service in 3 Days Using WordPress

http://wordpress.org/plugins/crazy-bone/

Page 19: Launch a Web Service in 3 Days Using WordPress

http://wordpress.org/plugins/advanced-custom-fields/

Page 20: Launch a Web Service in 3 Days Using WordPress

DEFAULT LOGIN PAGE デフォルトログイン画面

Page 21: Launch a Web Service in 3 Days Using WordPress

LOGIN PAGE OF HEARTBREAK.JP 失恋.jpのログイン画面

Page 22: Launch a Web Service in 3 Days Using WordPress

DEFAULT EDITOR デフォルト投稿画面

Page 23: Launch a Web Service in 3 Days Using WordPress

EDITOR OF HEARTBREAK.JP 失恋.jpの投稿画面

Page 24: Launch a Web Service in 3 Days Using WordPress

DEFAULT PROFILE デフォルトプロフィール画面

Page 25: Launch a Web Service in 3 Days Using WordPress

PROFILE OF HEARTBREAK.JP 失恋.jpのプロフィール画面

Page 26: Launch a Web Service in 3 Days Using WordPress

Add Admin Style Sheet 管理画面用スタイルシートを追加

function kite_admin_style(){ echo '<link rel="stylesheet" type="text/css" href="'.get_template_directory_uri().'/css/admin.css" />'."\n"; } add_action('login_head', 'kite_admin_style', 99); add_action('admin_head', 'kite_admin_style', 99);

Page 27: Launch a Web Service in 3 Days Using WordPress

Change the URL and Title Attribution of Login Header ログイン画面のロゴのリンク先と title 属性を変更

function kite_login_headerurl(){ return get_home_url(); } add_filter('login_headerurl', 'kite_login_headerurl'); !function kite_login_headertitle(){ return '失恋.jp'; } add_filter('login_headertitle', 'kite_login_headertitle');

Page 28: Launch a Web Service in 3 Days Using WordPress

function shitsuren_admin_color() { return 'light'; } add_filter( 'get_user_option_admin_color', 'shitsuren_admin_color' ); remove_filter( 'admin_color_scheme_picker', 'admin_color_scheme_picker' );

Disable Admin Color Scheme 管理画面の配色を固定

Page 29: Launch a Web Service in 3 Days Using WordPress

Remove Admin Bar Menus アドミンバーのメニューを削除

function kite_remove_admin_bar_menus($wp_admin_bar){ if(!current_user_can('level_10')){ $wp_admin_bar->remove_node('wp-logo'); // WordPress ロゴ $wp_admin_bar->remove_node('comments'); // コメント // $wp_admin_bar->remove_node('new-content'); // 新規 // $wp_admin_bar->remove_node('new-post'); // 新規 - 投稿 $wp_admin_bar->remove_node('new-media'); // 新規 - メディア // $wp_admin_bar->remove_node('new-page'); // 新規 - 固定ページ // $wp_admin_bar->remove_node('new-user'); // 新規 - ユーザー $wp_admin_bar->remove_node('search'); // 検索 // $wp_admin_bar->remove_node('edit-profile'); // プロフィールを編集 // $wp_admin_bar->remove_node('user-info'); // ユーザー情報 } } add_action('admin_bar_menu', 'kite_remove_admin_bar_menus', 99);

Page 30: Launch a Web Service in 3 Days Using WordPress

Remove Side Menus of Dashboard 管理画面のサイドメニューを削除

function kite_remove_admin_side_menus(){ if(!current_user_can('level_10')){ remove_menu_page('index.php'); // ダッシュボード // remove_menu_page('edit.php'); // 投稿 remove_menu_page('upload.php'); // メディア remove_menu_page('link-manager.php'); // リンク remove_menu_page('edit.php?post_type=page'); // 固定ページ remove_menu_page('edit-comments.php'); // コメント remove_menu_page('themes.php'); // 概観 remove_menu_page('plugins.php'); // プラグイン remove_menu_page('users.php'); // ユーザー remove_menu_page('tools.php'); // ツール remove_menu_page('options-general.php'); // 設定 } } add_action('admin_menu', 'kite_remove_admin_side_menus');

Page 31: Launch a Web Service in 3 Days Using WordPress

Die Admin Menus 管理ページアクセス禁止

function kite_die_admin_menu(){ if(!current_user_can('level_10')){ wp_die( 'このページにアクセスするための十分なアクセス権がありません。' ); } } add_action('admin_head-upload.php', 'kite_die_admin_menu'); // メディア add_action('admin_head-media-new.php', 'kite_die_admin_menu'); // メディア - 新規追加 add_action('admin_head-edit-comments.php', 'kite_die_admin_menu'); // コメント add_action('admin_head-tools.php', 'kite_dashboard_redirect'); // ツール

Page 32: Launch a Web Service in 3 Days Using WordPress

Hide Help Button of Dashboard 管理画面のヘルプを消す

function kite_hide_help(){ if(!current_user_can('level_10')){ echo '<style type="text/css">#contextual-help-link-wrap{display:none;}</style>'; } } add_action('admin_head', 'kite_hide_help'); add_action('admin_print_styles', 'kite_hide_help', 21);

Page 33: Launch a Web Service in 3 Days Using WordPress

Dashboard Redirect 管理画面リダイレクト

function kite_dashboard_redirect(){ if(!current_user_can('level_10')){ $admin_urls = array('index', 'upload', 'media-new', 'edit-comments', 'tools', 'admin'); foreach ($admin_urls as $url){ if(get_home_url().$_SERVER['SCRIPT_NAME'] === admin_url($url.'.php')){ wp_redirect(admin_url( 'edit.php' )); exit(); } } } } add_action('init', 'kite_dashboard_redirect');

Page 34: Launch a Web Service in 3 Days Using WordPress

Exclude Others’ Posts in Dashboard 管理画面投稿一覧で他人の投稿を表示しない

function kite_exclude_other_posts($wp_query){ if (isset($_REQUEST['post_type']) && post_type_exists($_REQUEST['post_type'])){ $post_type = get_post_type_object($_REQUEST['post_type']); $cap_type = $post_type->cap->edit_other_posts; } else { $cap_type = 'edit_others_posts'; } ! if ( is_admin() && $wp_query->is_main_query() && !$wp_query->get('author') && !current_user_can($cap_typ)){ $user = wp_get_current_user(); $wp_query->set('author', $user->ID); } } add_action('pre_get_posts', 'kite_exclude_other_posts');

Page 35: Launch a Web Service in 3 Days Using WordPress

Remove Post Columns in Dashboard 管理画面投稿一覧の項目を削除

function kite_custom_posts_columns ($columns) { // unset($columns['cb']); // チェックボックス // unset($columns['title']); // タイトル // unset($columns['author']); // 作成者 unset($columns['categories']); // カテゴリー unset($columns['tags']); // タグ、カスタムフィールド // unset($columns['comments']); // コメント // unset($columns['date']); // 日付 return $columns; } add_filter('manage_posts_columns', 'kite_custom_posts_columns');

Page 36: Launch a Web Service in 3 Days Using WordPress

Require Title 投稿タイトルを必須にする

function kite_require_title() { ?> <script type="text/javascript"> jQuery(document).ready(function($){ if('post' == $('#post_type').val()){ $("#post").submit(function(e){ if('' == $('#title').val()) { alert('タイトルを入力してください!'); $('#ajax-loading').css('visibility', 'hidden'); $('#publish').removeClass('button-primary-disabled'); $('#title').focus(); return false; } }); } }); </script> <?php } add_action('admin_head-post-new.php', 'kite_require_title');

Page 37: Launch a Web Service in 3 Days Using WordPress

Remove Items of Profile プロフィール画面の項目を削除

function kite_hide_richeditor_checkbox() { global $wp_rich_edit_exists; if(!current_user_can('level_10') && defined('IS_PROFILE_PAGE') && IS_PROFILE_PAGE){ $wp_rich_edit_exists = false; } } add_action('admin_head', 'kite_hide_richeditor_checkbox');

Page 38: Launch a Web Service in 3 Days Using WordPress

Remove Items of Profile (continued) プロフィール画面の項目を削除(つづき)

function kite_hide_profile_item() { if(!current_user_can('level_10')){ ?> <script type="text/javascript"> tftn = "table.form-table:nth-of-type"; jQuery(document).ready(function($) { $("div#profile-page h3").css("display", "none"); // h3 タイトル $(tftn + "(1)").css("display", "none"); // 個人設定ブロック $(tftn + "(2) tr:nth-child(2)").css("display", "none"); // 姓 $(tftn + "(2) tr:nth-child(3)").css("display", "none"); // 名 // $(tftn + "(2) tr:nth-child(4)").css("display", "none"); // ニックネーム // $(tftn + "(2) tr:nth-child(5)").css("display", "none"); // ブログ上の表示名 $(tftn + "(3) tr:nth-child(2)").css("display", "none"); // ウェブサイト $(tftn + "(4) tr:nth-child(1)").css("display", "none"); // プロフィール情報 ! var label = $(tftn + "(2) tr:nth-child(5) > th > label").text(); // ブログ上の表示名 label = label.replace('ブログ上の', ''); $(tftn + "(2) tr:nth-child(5) > th > label").text(label); }); </script> <?php } } add_action('show_user_profile', 'kite_hide_profile_item');

Page 39: Launch a Web Service in 3 Days Using WordPress

Only Search Posts 検索を投稿のみに限定する

function kite_search($query) { if ($query->is_search) { $query->set('post_type', 'post'); } return $query; } add_filter('pre_get_posts','kite_search');

Page 40: Launch a Web Service in 3 Days Using WordPress

Require Comment Author コメントの名前を必須にする

function kite_require_comment_author($commentdata){ if ('' === trim($commentdata['comment_author'])) wp_die('名前を入力して下さい。'); return $commentdata; } add_filter('preprocess_comment', 'kite_require_comment_author', 1);

Page 41: Launch a Web Service in 3 Days Using WordPress

Remove Email and Website of Comment Form コメントのメールアドレス、ウェブサイト項目を削除

function kite_remove_comment_form_fields($args){ $args['email'] = ''; $args['url'] = ''; return $args; } add_filter('comment_form_default_fields', 'kite_remove_comment_form_fields');

Page 42: Launch a Web Service in 3 Days Using WordPress

Add Comment Notes コメントの注意書き

function kite_comment_form($args){ $args['comment_field'] = '<p class="comment-form-comment"><label for="comment">メッセージ</label><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p>'; $args['title_reply'] = 'メッセージを残す'; $args['cancel_reply_link'] = 'メッセージをキャンセル'; $args['comment_notes_before'] = '<span class="comment-note">失恋した本人やその相手を否定する内容、<br />他の方が不快に思うような内容は絶対に投稿しないようお願いします。<br />必ず事前に<a href="'.get_home_url('', 'about').'">「失恋.jp について」</a>をお読みください。</span>'; $args['comment_notes_after'] = ''; $args['label_submit'] = 'メッセージを送信'; return $args; } add_filter('comment_form_defaults', 'kite_comment_form');

Page 43: Launch a Web Service in 3 Days Using WordPress

Thank you for your attention. ご清聴ありがとうございました。