第3回wordpress cafe プラグイン紹介
DESCRIPTION
2012年3月21日に、横浜関内のさくらWorksで行われた「第3回WordPress Cafe」で私がよくお世話になっているWordPressプラグインの紹介を行いました。その際のスライドです。会場のモニターが16:9だったので、横長で作っています。TRANSCRIPT
プラグイン紹介
実務未経験でWeb製作の現場に入った新人が 必死にサイトを完成させるために大変お世話になっている
自己紹介
2011年7月
実務未経験、「ちょっとHTMLがいじれる」程度のスキルで
今の会社に入社。 Webデザイナー/コーダーとなる。
最近ようやくWebサイトの製作も任せてもらえるようになった。
深水 一馬(ふかみ かずま)
Twitter: @foom_in Facebook: kazuma.fukami
自己紹介
WordPress歴は8ケ月くらいです。
10月5日にさくらWorks関内で行われた
「中級者のためのWordpress講座 第4回」 から
勉強会に参加。以降、WordPressにハマる。
深水 一馬(ふかみ かずま)
Twitter: @foom_in Facebook: kazuma.fukami
本日のお品書き • WP-Cycle • Content Warning • TS Custom Widgets • WP-PageNavi • More Content Folder • Dynamic To Top • WP-Table Reloaded • Maintenance Mode • Search Regex
さくらWorks ワードプレス講座 掲示板 http://wpml.sakuraworks.org/
WordPress Cafe Facebookグループ https://www.facebook.com/groups/wpcafe/
今日のスライドは公開します
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
トップにスライドショーをつけたい!
新人のFさん
WP-Cycle
WP-Cycle
• シンプルなスライドショーを設置できる
• 企業サイトのトップページなどに便利
• 画像ごとにリンク先の設定ができる
ポイント
WP-Cycle
1.プラグインを有効化 2.ダッシュボード → メディア → WP-Cycle から画像をアップ 3.テーマテンプレート(index.phpなど)のスライドショーをつけたい 部分にテンプレートタグ <?php wp_cycle(); ?> を追加。
使い方
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
上に戻るボタンがほしい!
こんなやつ
Dynamic To Top
Dynamic To Top
• シンプルな「上に戻る」ボタンがつけられる
• 色や形、文字、スピードを管理画面で編集
• スマホで見たときには表示しないようにできる
※ボタンに画像を使いたい場合は「Scroll to Top Plugin」で対応可能
ポイント
Dynamic To Top
1.プラグインを有効化(これだけでボタンが表示されます) 2.ダッシュボード → 外観 → To Top からデザイン等を編集
使い方
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
ウィジェットを特定のページにだけ表示したい
TS Custom Widgets
TS Custom Widgets
• 各ウィジェットごとに、表示させる条件を 設定できる
• 投稿・固定ページ・カテゴリー・タグ・投稿者 で指定
• さらに「コメントが許可されている投稿」とか ちょっとマニアックな設定もできる
ポイント
TS Custom Widgets
1. プラグインを有効化 2. ダッシュボード → TS Custom widgets 3. ウィジェットとその表示条件を編集
使い方
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
投稿が増えてきて、ページ間の移動が大変!
← こーゆーのつけたい!
WP-PageNavi
WP-PageNavi
• 簡単にナビゲーションを設置
• 管理画面から表示の設定が可能
ポイント
WP-PageNavi 1. プラグインを有効化
2. ダッシュボード → 設定 → PageNavi
3. テーマテンプレート(index.phpなど)の任意の部分に
テンプレートタグ <?php wp_pagenavi(); ?> を追加。
使い方
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
「続きを読む」をカッコ良く!
More Content Folder
More Content Folder
• Moreタグを挿入した記事の「続きを読む」を クリックすると、その場で続きを展開
• 個別の投稿までいかなくても その場で記事の内容が読める
• なんかちょっとカッコイイ
ポイント
More Content Folder
プラグインを有効化するだけ!
クリック 続きが展開
使い方
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
クライアントからのメールでよくあるパターン
お世話になっております。
ホームページ掲載用の料金表
データを添付いたします。
(Excel形式)
添付ファイル:○○.xls
WP-Table Reloaded
テーブルなんて大嫌いっ!
WP-Table Reloaded
WP-Table Reloaded
• 管理画面上でテーブルの作成・管理ができる
• 作ったテーブルはショートコードで簡単挿入
• CSVをインポートして、簡単テーブル作成!
• ソート(並べ替え)機能など
ポイント
WP-Table Reloaded
1.管理画面でテーブルを作成(またはインポート) 2.ショートコードでテーブルを挿入
使い方
WP-Table Reloaded
Excelで作ったCSVファイルをインポートするときは、
文字コードをUTF-8にしないと文字化けします。 手っ取り早い方法は
ExcelからCSVで保存 → テキストエディタで文字コード指定保存
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
公開日はまだ先だけど、 本番サーバーにアップして調整したい。
Maintenance Mode
大幅な修正をしたいけれど レイアウトが崩れる恐れが…
Maintenance Mode
• 「メンテナンス中」画面を出して、 一般の人はアクセスしても 一時的に閲覧できない状態にする
• 管理者としてログインした場合には 通常の表示を行うので、表示確認ができる。
ポイント
Maintenance Mode
管理画面でメッセージなどを編集し、「使用」を選択
使い方
管理者 (ログイン中)
通常の訪問者
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
18禁サイトを作らなきゃいけなくなった
仕事ですからね
Content Warning
Content Warning
• サイトにアクセスした際
「あなたは18歳以上ですか?」といった
確認のポップアップを表示。
• 表示させるメッセージや、「いいえ」選択時の
飛び先を指定できる。
• ポップアップのデザインはCSSでカスタマイズ可能
ポイント
Content Warning
管理画面で表示内容や、「いいえ」選択時のリンク先を設定する。
使い方
訪問者への表示 管理画面
本日のお品書き
• WP-Cycle • Dynamic To Top • TS Custom Widgets • WP-PageNavi • More Content Folder • WP-Table Reloaded • Maintenance Mode • Content Warning • Search Regex
投稿や固定ページに含まれる文字列を 検索・一括置換したい
Search Regex
Search Regex
• 投稿や固定ページに含まれるキーワードを 検索・一括置換できる
ポイント
Search Regex
旧サーバー(移転前)
www.××.jp/blog/image
新サーバー移転後
www.○○.jp/wp-content/uploads
サイト移転時のリンク切れ一括修正にも!
Search Regex
一度置換を行うと元には戻せないので注意
置換を行う前に、バックアップを!
プラグインを使う上で
• あまり入れすぎると重くなる
• 対応するWPのバージョン、PHPなどの 仕様を確認しよう
• 更新日が古いものは開発が止まっている 可能性もあるので注意しよう
• 使わないプラグインはアンインストール(削除) しよう
本日のお品書き
• WP-Cycle スライドショー設置 • Dynamic To Top 上に戻るボタン • TS Custom Widgets ウィジェットの表示 • WP-PageNavi ページナビゲーション設置 • More Content Folder 続きを読むをカッコ良く • WP-Table Reloaded テーブルを簡単作成 • Maintenance Mode メンテナンスモード表示 • Content Warning 訪問時ポップアップ表示 • Search Regex 投稿の一括置換
ありがとうございました