Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
弁野法律事務所 WordPressで構築する場合
新着情報表示TOPページに新着情報を表示
サンプルコード
■ 新着情報表示テンプレートの適切な場所に下記のソースを貼ります。<?phpecho <h2 class="title"><imgsrc=".get_stylesheet_directory_uri()./images/title/home_p...
■ 新着情報表示ソースの説明です。投稿記事を取得するためにget_posts関数を使用します。get_postsを使用すると配列で取得できるので、変数を$get_postなどにして、値を格納します。今回指定した引数は、『numberposts』...
■ 新着情報表示タイトルの取得get_the_title関数でタイトルを取得します。リンクの取得get_permalink関数で取得します。投稿日時の取得get_the_time関数で取得します。フォーマットは管理画面の一般設定で設定したフォー...
■ 新着情報表示$get_postsに格納した物を、foreachで内容を表示させます。foreach ($get_post as $post) {   echo <li>."n";   echo <span class= data > .ge...
使用するプラグイン1.ContactForm7URL:http://wordpress.org/extend/plugins/contact-form-7/Contact Form 7 はシンプルかつ柔軟なコンタクトフォームを提供するWordP...
お問合せフォームお問合せフォームを設置
お問合せフォームお問合せフォームを設置              設置したい項目のタイプをド              ロップダウンから選択します。
お問合せフォームお問合せフォームを設置              表示された項目に必要な内容を入力します。              入力が完了したら茶色と緑の背景のコードをそ              れぞれの項目のところに貼りつけ保存します。
お問合せフォーム保存が完了後ページ上部のコードを表示したい、記事やページに張り付けます。
今回使用しているプラグイン一覧 Contact Form 7 柔軟なコンタクトフォームを作成します。 Really Simple CAPTCHA Contact Form 7の画像認証に使います。 WP Multibyte Patch マルチバ...
Johnny nail WordPressで構築する場合
・携帯表示・携帯投稿・携帯クーポン・SNS
使用するプラグイン1.Ktai Style安定版 Ktai Style1.81(今回はこちらを使用)URL:http://wppluginsj.sourceforge.jp/ktai_style/開発版 Ktai Style 2.0.0-Bat...
使用するプラグイン2.山椒(小粒)/Japanese PepperURL:http://plugins.webnist.net投稿記事に画像があった場合、最初の画像を引っ張ってきて表示。
携帯表示
携帯表示設定画面でイメージに近いテンプレート(今回はGreenを使用します)を選択します。それをベースにカスタマイズしていきます。サムネール表示、 色の変更、ヘッダーイメージの変更を紹介します。
サムネールの表示       投稿一覧に画像を出すために、       山椒(小粒)/Japanese Pepper を使用します。       『index.php』でfor構文で囲まれた部分に       以下の関数を挿入します。     ...
携帯表示ヘッダー部分変更、タイトルの帯の変更。
ヘッダー・タイトルの変更       『header.php』に携帯テーマの設定が用意されているの       でそこを編集していきます。       ■ヘッダーの背景色の変更は       $before = <div style="colo...
ヘッダー・タイトルの変更       『header.php』に携帯テーマの設定が用意されているの       でそこを編集していきます。       ■タイトルの背景色の変更は       $ks_settings[title_style] ...
ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
使用するプラグイン1.Ktai EntryURL:http://wppluginsj.sourceforge.jp/ktai_entry/Ktai Entry は、携帯電話・PHS 等から WordPress に投稿できるメール投稿用プラグイン...
携帯投稿       Gmailを使用する設定方法を説明しま       す。       まず、普段使っているものだと、他の       メールも投稿されてしまうので       携帯投稿用にGmailを取得します。
携帯投稿       Gmailを取得後Gmail側で設定を行いま       す。       設定する項目は、『メール転送とPOP/       IMAP』       の設定で『POPのダウンロード』を       有効化にします。
携帯投稿       次に携帯投稿用ユーザを作成します。       ユーザー名に携帯用の       ユーザー名を記入します。       メールアドレスには携帯の       メールアドレスを入力します。       レビュー待ちではなく直...
携帯投稿       次にメール投稿の設定を行います。       投稿受付メールアドレスに、先程取得し       た       Gmailのアドレスを記入します。       Gmailのアドレスのユーザ名と@マーク       の   ...
携帯投稿       設定 -> 投稿設定 -> メールでの投稿       の設定でGmailのPOP取得設定を行い       ます。       メールサーバーには       ssl://pop.gmail.com       ポートは...
携帯投稿投稿方法       宛先には先程設定したメールアドレスを設定します。       件名に記事のタイトルを記入します。       本文に記事の内容を入れます。       絵文字にも対応しているのでそのまま本文に記入します。     ...
ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
携帯クーポンプラグインの組み合わせで、どうすればそれっぽくなるか説明します。1.携帯利用者向けにクーポンページの設置PC用のテーマにPC閲覧者にはページを見せないように設定します。
携帯クーポン         パソコンから閲覧時にクーポンページにアクセスしてきた         さいは、         リダイレクトでホームに移動するように設定します。         テーマディレクトリー内の『function.php』...
携帯クーポン function coupon_check() {    if(is_page(2)){        $siteuri = get_option(siteurl);        header("HTTP/1.1 301 Mov...
携帯クーポン2.会員向けにはどうするか。メールマガジンのようにメールを送信する形で対応する。サイト自体にユーザ登録した顧客に対し、管理画面よりメールマガジンの発行を可能にし、届いたメール自体がクーポンの役割をします。Email Usersを使用...
ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
SNS2通りのやり方があります。1.WordPressのみで完結したい人向け。BuddyPressというプラグインを使います。特徴WordPressではなくWordPress Muにインストールになります。日本のMixiのようなクロースではなく...
SNS実際に使用しているサイトWordBench(http://wordbench.org/)海外での使用は以下のサイトのShowcaseで紹介されています。http://wordpress.org/showcase/flavor/buddypr...
SNSインストール自体は簡単なので実際に試した方が早いと思います。1.ダッシューボードのプラグインから新規追加をクリック。2.検索から『buddypress』を記入しプラグインの検索。3.検索結果に『buddypress』を選択しインストールを...
SNSインストール自体は簡単なので実際に試した方が早いと思います。1.ダッシューボードのプラグインから新規追加をクリック。2.検索から『BuddyPress』を記入しプラグインの検索。3.検索結果に『BuddyPress』を選択しインストールを...
SNS5.テーマの選択で『BuddyPress Default』を使用する。
SNS2.他のSNS(Open PNE)を使用する。Open PNEを利用した方法が手島屋さんが詳しく紹介しています。URL:http://trac.openpne.jp/wiki/pne-book-7#OpenPNEXWordPress
今回使用しているプラグイン一覧 Ktai Style 携帯用にページを表示させます。 Ktai Entry モブログの機能を提供します。 emoji PCから絵文字入力を支援します。 Lightbox 2 画像拡大アニメーション表示 Email...
WordPressのSSL対応についてプラグインの追加で対応が可能です。有名なものとして『Admin SSL』があります。■独自SSLと共有SSLに対応しています。■管理画面からSSL化したいURLを指定することができます。ダウンロード先URL...
波津根不動産WordPressで構築する場合
物件登録画面カスタムフィールドと連携
使用するプラグイン1. Custom Field TemplateURL:http://wpgogo.com/development/custom-field-template.htmlカスタムフィールドの入力を支援するプラグイン
■ カスタムフィードを表示する準備テーマ内の「single.php」を編集します。ループ内でget_post_meta()を使用し値を取得します。取得したい値が「価格」でキーが「price」とした場合以下のように記述します。<?php echo...
絞り込み検索地名や価格、物件条件など様々な条件で検索
使用するプラグイン1. FE Advanced SearchURL:http://www.firstelement.jp/fe-advanced-search/「FE Advanced Search」は、複数の条件(カテゴリ/登録年月/キーワード...
今回使用しているプラグイン一覧 Custom Field Template カスタムフィードの入力支援 FE Advanced Search 絞り込み検索を可能にします。 Lightbox 2 画像拡大アニメーション表示 Lightweight...
カフェ・ジェネーべオンラインショップ  WordPressで構築する場合
使用するプラグイン1. WelcartURL:http://www.usconsort.com/プラグインをインストール有効化するとサンプルデザインテーマも同時にインストールされます。あとはショップの基本設定と配送設定、商品データの登録を行うだ...
カート機能Welcart*商品マスター*新規商品追加*商品画像登録*基本設定*営業日設定*配送設定*メール設定*システム設定*クレジット決済モジュール*ウィジェットの設定*受注リスト
Css Nite Word Press
Css Nite Word Press
Css Nite Word Press
Upcoming SlideShare
Loading in …5
×

Css Nite Word Press

1,701 views

Published on

Published in: Business
  • Be the first to comment

  • Be the first to like this

Css Nite Word Press

  1. 1. 弁野法律事務所 WordPressで構築する場合
  2. 2. 新着情報表示TOPページに新着情報を表示
  3. 3. サンプルコード
  4. 4. ■ 新着情報表示テンプレートの適切な場所に下記のソースを貼ります。<?phpecho <h2 class="title"><imgsrc=".get_stylesheet_directory_uri()./images/title/home_pickup_title.gif" width="643" height="22" alt="" /></h2>."n";$get_post = get_posts(numberposts=5&category=1);echo <ul> ;foreach ($get_post as $post) { echo <li> ."n"; echo <span class= data > .get_the_time().’</span> ; echo <span class= title ><a href=".get_permalink().title=".get_the_title().">.get_the_title().</a></span>."n"; echo <li>."n";}echo </ul> ; ?>
  5. 5. ■ 新着情報表示ソースの説明です。投稿記事を取得するためにget_posts関数を使用します。get_postsを使用すると配列で取得できるので、変数を$get_postなどにして、値を格納します。今回指定した引数は、『numberposts』これは取得する投稿数を指定します。『category』これは取得するカテゴリーを指定します。『-』をつけるとそのカテゴリーを除外します。$get_post = get_posts(numberposts=5&category=1);
  6. 6. ■ 新着情報表示タイトルの取得get_the_title関数でタイトルを取得します。リンクの取得get_permalink関数で取得します。投稿日時の取得get_the_time関数で取得します。フォーマットは管理画面の一般設定で設定したフォーマットになります。違うものを指定したい場合は、引数で指定してください。foreach ($get_post as $post) { echo <li>."n"; echo <span class= data > .get_the_time().’</span> ; echo <span class= title ><a href=".get_permalink().title=".get_the_title().">.get_the_title().</a></span>."n"; echo <li>."n";}
  7. 7. ■ 新着情報表示$get_postsに格納した物を、foreachで内容を表示させます。foreach ($get_post as $post) { echo <li>."n"; echo <span class= data > .get_the_time().’</span> ; echo <span class= title ><a href=".get_permalink().title=".get_the_title().">.get_the_title().</a></span>."n"; echo <li>."n";}
  8. 8. 使用するプラグイン1.ContactForm7URL:http://wordpress.org/extend/plugins/contact-form-7/Contact Form 7 はシンプルかつ柔軟なコンタクトフォームを提供するWordPress プラグインです。 * 複数のコンタクトフォームを管理できます。 * フォームとメールの内容を簡単なマークアップでカスタマイズできます。 * jQuery Form Plugin による AJAX の動的送信が可能。 * Akismet によるスパムフィルタリングをサポート。 * CAPTCHA によるボット防止をサポート。※ http://ideasilo.wordpress.com/2007/10/22/contact-form-7-in-japanese/ より抜粋
  9. 9. お問合せフォームお問合せフォームを設置
  10. 10. お問合せフォームお問合せフォームを設置 設置したい項目のタイプをド ロップダウンから選択します。
  11. 11. お問合せフォームお問合せフォームを設置 表示された項目に必要な内容を入力します。 入力が完了したら茶色と緑の背景のコードをそ れぞれの項目のところに貼りつけ保存します。
  12. 12. お問合せフォーム保存が完了後ページ上部のコードを表示したい、記事やページに張り付けます。
  13. 13. 今回使用しているプラグイン一覧 Contact Form 7 柔軟なコンタクトフォームを作成します。 Really Simple CAPTCHA Contact Form 7の画像認証に使います。 WP Multibyte Patch マルチバイト環境での不具合を修正します。
  14. 14. Johnny nail WordPressで構築する場合
  15. 15. ・携帯表示・携帯投稿・携帯クーポン・SNS
  16. 16. 使用するプラグイン1.Ktai Style安定版 Ktai Style1.81(今回はこちらを使用)URL:http://wppluginsj.sourceforge.jp/ktai_style/開発版 Ktai Style 2.0.0-Bata3URL:http://wordpress.org/extend/plugins/ktai-style/Ktai Style は、あなたの WordPress ウェブログを日本の携帯電話対応 (5キャリアおよびスマートフォン対応) にするプラグインです。WordPress + Ktai Style だけで、携帯ブログが構築できます。※ http://wppluginsj.sourceforge.jp/ktai_style/より抜粋
  17. 17. 使用するプラグイン2.山椒(小粒)/Japanese PepperURL:http://plugins.webnist.net投稿記事に画像があった場合、最初の画像を引っ張ってきて表示。
  18. 18. 携帯表示
  19. 19. 携帯表示設定画面でイメージに近いテンプレート(今回はGreenを使用します)を選択します。それをベースにカスタマイズしていきます。サムネール表示、 色の変更、ヘッダーイメージの変更を紹介します。
  20. 20. サムネールの表示 投稿一覧に画像を出すために、 山椒(小粒)/Japanese Pepper を使用します。 『index.php』でfor構文で囲まれた部分に 以下の関数を挿入します。 <?php echo j_pepper_get_img(); ?> そのままだと画像の容量が大きく表示されませんので 引数を設定します。 j_pepper_get_img(横幅,高さ,切取設定); を参考に以下のようにして記述します。 <?php echo j_pepper_get_img(50,50,0); ?>
  21. 21. 携帯表示ヘッダー部分変更、タイトルの帯の変更。
  22. 22. ヘッダー・タイトルの変更 『header.php』に携帯テーマの設定が用意されているの でそこを編集していきます。 ■ヘッダーの背景色の変更は $before = <div style="color:white;background- color:pink;margin:0;"> のbackground-color変更します。 ■ヘッダーの文字色の変更は $before = <div style="color:white;background- color:pink;margin:0;"> のcolor変更します。 ■ヘッダーのイメージの変更は <h1 style="margin:0"><img src=" . ks_theme_url (KTAI_NOT_ECHO) . icon.gif" alt="" /> icon.gifのイメージを変更しアップロードします。 アップロード先は、 wp-plugins -> ktai_style -> themes -> green内に アップロードします。
  23. 23. ヘッダー・タイトルの変更 『header.php』に携帯テーマの設定が用意されているの でそこを編集していきます。 ■タイトルの背景色の変更は $ks_settings[title_style] = color:white;background-color:pink;; のbackground-color変更します。 ■タイトルの文字色の変更は $ks_settings[title_style] = color:white;background-color:pink;; のcolor変更します。
  24. 24. ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
  25. 25. 使用するプラグイン1.Ktai EntryURL:http://wppluginsj.sourceforge.jp/ktai_entry/Ktai Entry は、携帯電話・PHS 等から WordPress に投稿できるメール投稿用プラグインです。いわゆる「モブログ」ができます。※ http://wppluginsj.sourceforge.jp/ktai_entry/より抜粋
  26. 26. 携帯投稿 Gmailを使用する設定方法を説明しま す。 まず、普段使っているものだと、他の メールも投稿されてしまうので 携帯投稿用にGmailを取得します。
  27. 27. 携帯投稿 Gmailを取得後Gmail側で設定を行いま す。 設定する項目は、『メール転送とPOP/ IMAP』 の設定で『POPのダウンロード』を 有効化にします。
  28. 28. 携帯投稿 次に携帯投稿用ユーザを作成します。 ユーザー名に携帯用の ユーザー名を記入します。 メールアドレスには携帯の メールアドレスを入力します。 レビュー待ちではなく直ぐに公開できる ようにするには権限を作成者以上にして ください。
  29. 29. 携帯投稿 次にメール投稿の設定を行います。 投稿受付メールアドレスに、先程取得し た Gmailのアドレスを記入します。 Gmailのアドレスのユーザ名と@マーク の 間にランダムに小文字英数字を+をつけ て 設定します。 上記の事を行うと、スパムメールが来た 際にスパムメールも投稿される事を防ぎ ます。
  30. 30. 携帯投稿 設定 -> 投稿設定 -> メールでの投稿 の設定でGmailのPOP取得設定を行い ます。 メールサーバーには ssl://pop.gmail.com ポートは995にします。 ログイン名には Gmailのユーザ名@gmail.com パスワードには Gmailのログインパスワードを入力しま す。 初期投稿カテゴリーを設定したら保存し ます。
  31. 31. 携帯投稿投稿方法 宛先には先程設定したメールアドレスを設定します。 件名に記事のタイトルを記入します。 本文に記事の内容を入れます。 絵文字にも対応しているのでそのまま本文に記入します。 カテゴリーを変更する祭は本文の中に『CAT:』と記入し カテゴリーIDを指定します。 画像の投稿は画像を添付して送信します。
  32. 32. ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
  33. 33. 携帯クーポンプラグインの組み合わせで、どうすればそれっぽくなるか説明します。1.携帯利用者向けにクーポンページの設置PC用のテーマにPC閲覧者にはページを見せないように設定します。
  34. 34. 携帯クーポン パソコンから閲覧時にクーポンページにアクセスしてきた さいは、 リダイレクトでホームに移動するように設定します。 テーマディレクトリー内の『function.php』に 以下のソースを追加します。 //クーポンページ設定 function coupon_check() { if(is_page(2)){ $siteuri = get_option(siteurl); header("HTTP/1.1 301 Moved Permanently"); header("Location: $siteuri"); } } add_action(wp,coupon_check);
  35. 35. 携帯クーポン function coupon_check() { if(is_page(2)){ $siteuri = get_option(siteurl); header("HTTP/1.1 301 Moved Permanently"); header("Location: $siteuri"); } } add_action(wp,coupon_check);クーポンページの指定条件分岐タグのis_page関数でページを指定します。add_actionでフックするタイミングを指定します。
  36. 36. 携帯クーポン2.会員向けにはどうするか。メールマガジンのようにメールを送信する形で対応する。サイト自体にユーザ登録した顧客に対し、管理画面よりメールマガジンの発行を可能にし、届いたメール自体がクーポンの役割をします。Email Usersを使用します。Email Usersの特徴はグループ全体に送信が可能、または個別にユーザへ送ることが可能です。
  37. 37. ポイント・携帯表示・携帯投稿・携帯クーポン・SNS
  38. 38. SNS2通りのやり方があります。1.WordPressのみで完結したい人向け。BuddyPressというプラグインを使います。特徴WordPressではなくWordPress Muにインストールになります。日本のMixiのようなクロースではなくオープン型SNSになります。※BuddyPress1.2からはWordPressにもインストールが可能になりました。BuddyPressのサイトhttp://buddypress.org/(BuddyPress担当) WordPress 日本語版作成チームhttp://groups.google.com/group/buddypress-ja?pli=1
  39. 39. SNS実際に使用しているサイトWordBench(http://wordbench.org/)海外での使用は以下のサイトのShowcaseで紹介されています。http://wordpress.org/showcase/flavor/buddypress/インストール自体は簡単なので実際に試した方が早いと思います。
  40. 40. SNSインストール自体は簡単なので実際に試した方が早いと思います。1.ダッシューボードのプラグインから新規追加をクリック。2.検索から『buddypress』を記入しプラグインの検索。3.検索結果に『buddypress』を選択しインストールをクリック
  41. 41. SNSインストール自体は簡単なので実際に試した方が早いと思います。1.ダッシューボードのプラグインから新規追加をクリック。2.検索から『BuddyPress』を記入しプラグインの検索。3.検索結果に『BuddyPress』を選択しインストールをクリック4.『BuddyPress』有効化。
  42. 42. SNS5.テーマの選択で『BuddyPress Default』を使用する。
  43. 43. SNS2.他のSNS(Open PNE)を使用する。Open PNEを利用した方法が手島屋さんが詳しく紹介しています。URL:http://trac.openpne.jp/wiki/pne-book-7#OpenPNEXWordPress
  44. 44. 今回使用しているプラグイン一覧 Ktai Style 携帯用にページを表示させます。 Ktai Entry モブログの機能を提供します。 emoji PCから絵文字入力を支援します。 Lightbox 2 画像拡大アニメーション表示 Email User 登録ユーザにメールを送信します。 山椒(小粒)/Japanese Pepper 記事の最初の画像を表示する BuddyPress コミュニティー機能を提供します。
  45. 45. WordPressのSSL対応についてプラグインの追加で対応が可能です。有名なものとして『Admin SSL』があります。■独自SSLと共有SSLに対応しています。■管理画面からSSL化したいURLを指定することができます。ダウンロード先URLhttp://wordpress.org/extend/plugins/admin-ssl-secure-admin/
  46. 46. 波津根不動産WordPressで構築する場合
  47. 47. 物件登録画面カスタムフィールドと連携
  48. 48. 使用するプラグイン1. Custom Field TemplateURL:http://wpgogo.com/development/custom-field-template.htmlカスタムフィールドの入力を支援するプラグイン
  49. 49. ■ カスタムフィードを表示する準備テーマ内の「single.php」を編集します。ループ内でget_post_meta()を使用し値を取得します。取得したい値が「価格」でキーが「price」とした場合以下のように記述します。<?php echo get_post_meta($post->ID, price, TRUE); ?>
  50. 50. 絞り込み検索地名や価格、物件条件など様々な条件で検索
  51. 51. 使用するプラグイン1. FE Advanced SearchURL:http://www.firstelement.jp/fe-advanced-search/「FE Advanced Search」は、複数の条件(カテゴリ/登録年月/キーワード/等)による絞り込み検索機能を提供する、「WordPress」用のプラグイン(追加機能)です。下記のformエレメントで検索条件を表示できます。 * ドロップダウンメニュー * チェックボックス(AND/OR検索の選択が可能) * ラジオボタン * リストボックス(AND/OR検索の選択が可能) * テキストボックス(フリーワード検索)検索フォームを簡単に自由に作成できる設定パネルが WordPress管理画面内に用意されています。
  52. 52. 今回使用しているプラグイン一覧 Custom Field Template カスタムフィードの入力支援 FE Advanced Search 絞り込み検索を可能にします。 Lightbox 2 画像拡大アニメーション表示 Lightweight Google Maps Google Map表示支援 Simple Tags タグ管理支援
  53. 53. カフェ・ジェネーべオンラインショップ WordPressで構築する場合
  54. 54. 使用するプラグイン1. WelcartURL:http://www.usconsort.com/プラグインをインストール有効化するとサンプルデザインテーマも同時にインストールされます。あとはショップの基本設定と配送設定、商品データの登録を行うだけで簡単にネットショップを体験できます。カートは、商品ごとに違った条件選択などが必要といった複雑な販売にも対応が可能です。また「業務パック割引」機能を使うことで業者購入時の価格に差別化を行うことも可能です。その他「会員制」の導入、「配送方法」の選択、「キャンペーン」特典の付与など様々な機能を備えています。
  55. 55. カート機能Welcart*商品マスター*新規商品追加*商品画像登録*基本設定*営業日設定*配送設定*メール設定*システム設定*クレジット決済モジュール*ウィジェットの設定*受注リスト

×