(Wordpress)カスタムフィールドのテキストを改行させる。

「(Wordpress)カスタムフィールドのテキストを改行させる。」

Wordpressのビジュアルエディタでテキストを打っても
改行されない。<br />が続くのは良くないとかでWordpressのシステムで
消されてしまう。

なので以下のような記述を加えると改行出来るようになる。

(1)普通のカスタムフィールドのきじゅつを

<?php echo get_post_meta($post->ID, 'カスタムフィールド名', true);?>
(2)以下のようにnl2br()で囲む

<?php echo nl2br(get_post_meta($post->ID, 'カスタムフィールド名', true)); ?>  

(3)これで改行されるようになるがEnterキーで普通に改行すると
余計に空白がとられるのでShift+Enterで改行すると普通の改行が可能になる。

＜参考サイト＞
WordPressでカスタムフィールド使用時に改行したい。

カスタム投稿タイプの本文とカスタムフィールドを表示させる記述

「カスタム投稿タイプの本文とカスタムフィールドを表示させる記述」

<?php $myQuery = new WP_Query(); // WP_Queryオブジェクト生成 $param = array( //パラメータ。 'posts_per_page' => '10', //（整数）- 1ページに表示する記事数。-1 ならすべての投稿を取得。 'post_type' => 'staff', //カスタム投稿タイプのみを指定。※function.phpに記述してあるもの。 'post_status' => 'publish', //取得するステータスを指定：publish（公開済み） 'orderby' => 'ID', 'order' => 'DESC' //降順。大きい値から小さい値の順。 ); $myQuery->query($param); // クエリにパラメータを渡す ?> <?php if($myQuery->have_posts()): while($myQuery->have_posts()) : $myQuery->the_post(); ?> <?php the_title(); ?><!--タイトルを取得--> <?php the_content(); ?><!--本文を取得--> <?php echo get_post_meta($post->ID, 'StaffPosition', true);?><!--カスタムフィールドを取得--> <?php echo get_post_meta($post->ID, 'StaffNameRome', true);?><!--カスタムフィールドを取得--> <?php endwhile; endif; ?>


'post_type' => 'staff',
上記の記述でどのカスタム投稿タイプかを判別している。 例では「staff」となっている。
「staff」はfunction.phpに書いたカスタム投稿タイプ追加の記述によって決まる。
以下 function.phpカスタム投稿タイプ追加の記述例。

//Staffカスタム投稿タイプ追加 register_post_type( 'staff', array( 'label' => 'Staff', 'hierarchical' => false, 'public' => true, 'query_var' => false, 'supports' => array( 'title', 'editor', 'thumbnail', 'custom-fields' ) ) ); register_taxonomy( 'staffcat', 'staff', array( 'label' => 'Staffのカテゴリー', 'hierarchical' => true, ) );


<参考サイト>
WordPress3.0のカスタム投稿タイプを、実案件を想定して実践してみる

(wordpress)カスタム投稿タイプについて

カスタム投稿タイプについて
参考サイト
WordPressのカスタム投稿タイプを企業サイトに使う場合の（超個人的）決定版

【日本語ファイル】WordPressで画像のトリミング等を可能にするプラグイン・Scissors

wordpressのカテゴリの表示順を簡単に変えられるプラグインMy Category Order

wordpressのカテゴリの表示順を
簡単に変えられるプラグイン
「My Category Order」を入れてみた。
流れは以下の通り。

(1)My Category Orderをダウンロードしてwpのpluginフォルダの中に入れる有効化する。
日本語版にしたかったら以下のサイトを参考にする。
My Category Order日本語化する

(2)カテゴリの表示順を変えたい<?php wp_get_archives('type=yearly&cat=11&limit=10'); ?>などの中にorderby=order&title_li=を追加する。
 (例)
 <?php wp_get_archives('type=yearly&cat=11&limit=10&orderby=order&title_li='); ?>

(3)WPダッシュボードの投稿メニューのところに「My Category Order」のボタンが
増えているのでドラッグ&ドロップ→カテゴリー順をクリックで適用される。

(参考URL)
http://netsupman.com/affili/176.html

wordpress IE6でループしたところが階段状になるバグ解決方法

wordpress IE6でループしたところが階段状になるバグになるという
超マイナーでwp独自のIE6バグがあったのでメモ。

以下の条件の時にループさせている部分が階段状になっていた。

(1)下記の様なループタグの中に
<?php if ( have_posts()):while(have_posts()): the_post(); ?>
<?php endwhile; endif; ?>

(2)赤字の様なテンプレートタグ/bloginfo
をpタグでくくった時に階段状になるバグが出た。(固定ページではバグがなかったが
アーカイブページでバグがみられた。)

<p class="page_top"><a href="#top"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/blog/btn_page_top.jpg" alt="ページトップへ" /></a></p>

※因にstylesheet_directoryはVersion 2.3.1から非推奨なので
template_directoryに替えるのが正しいです。

(参考URL)
テンプレートタグ/bloginfo

スムーズスクロール JS (今回wordpressで喧嘩しなかった)

jQueryでページ内リンクをスムーズに移動。
そして止まる位置の調整も速さも調整出来る。

(以下の2つを読み込んで)
jquery.js
jQuery Easing Plugin（jquery.easing.js）
 

（以下をheader内に記述）

<script language="JavaScript">
$(function() {
 $('a[href*=#]').click(function() {
  if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
   var target = $(this.hash);
   target = target.length && target;
   if (target.length) {
    var sclpos = 30;
    var scldurat = 1200;
    var targetOffset = target.offset().top - sclpos;
    $('html,body')
     .animate({scrollTop: targetOffset}, {duration: scldurat, easing: "easeOutExpo"});
    return false;
   }
  }
 });
});
</script>

通常のページ内リンクをhtml上に記述すれば完成。

※Wordpressの場合は$をjQueryに変える(4箇所)

参考URL

http://www.detelu.com/blog/2008/09/jquery%E3%81%A7%E3%83%9A%E3%83%BC%E3%82%B8%E5%86%85%E3%82%B9%E3%83%A0%E3%83%BC%E3%82%BA%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB/ 

(wp)mampからサーバーへの移行方法

Wordpressのmamp(ローカルで構築)→サーバへの移行の流れ

(１)
MAMPのphpMyAdminにログインし、データベースを選択し、エクスポートでSQLファイルを出力する。こんなデータが出てくる→「localhost.sql」

(2)
SQLファイル(ex:localhost.sql)をテキストエディタ（もしくはメモ帳など）で開く、
ローカルのURL（”http://localhost:8888/mysite”など）を自分のドメイン（”http://www.yourdomain.com”など）で置換する。

(3)
WebサーバーのCパネルへログインしてまずphpMyAdmin、データベース新規作成か既にあるデータベースを選択してインポートボタンを押す。SQLファイルをインポートするとローカルで作ったデータべースがアップロードされる。

(4)
そのデータベースの権限などのところからユーザー名、パスワードなどを
設定する。

(5)
自分が設定したドメイン下のディレクトリに
Wordpressのフォルダーをすべてアップロードする。
※ドメイン直下でなくても設定でトップページをドメイン名で表示
出来るらしい。
(参照:http://suirakukai.com/wordpress/22/wordpress-change-in-directory/)


(6)
wp-config.phpがWPのフォルダに入っているのでそれを開き、
Webサーバーの設定にあうようにデータベースの情報を変更。
さっきphpMyAdminで設定したデータベース名、データベースユーザー名、パスワードを
設定する。それを元あった場所に(Wordpressのフォルダーに)アップロードする。

(7)
完成。
自分で設定したドメインやディレクトリの場所（”http://www.yourdomain.com”など）に
アクセスするとログイン画面が出て来て移行完了。

＜参考サイトURL＞
※以下をみれば必ずわかる。
http://www.webcreatorbox.com/tech/wordpress-theme-uploa/
http://mizushima.ne.jp/Windows/DB/phpMyAdmin/phpMyAdmin-setting.php

※本サーバーアップの時につまずいた点があったのでメモ
固定ページなどが表示されずport80のエラーがでていたのだが
仮アップしていた時の.htaccessのファイルを入れたらみられるようになった。

一応その記述を記載

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index¥.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

※注意2
さくらインターネットサーバーだとwp-configの/** MySQL のホスト名 */の
設定がデフォルトのlocalhostだとデータベースと繋がらない。
コントロールパネルのmyphpAdminから「データベース サーバ」に載っている。
「mysql○○.db.sakura.ne.jp」 (○○の中はそれぞれに割り振られた数字)を
ホスト名として書き換えないと行けない。
<下記キャプチャ参照>

(wp)最終更新日を表示

以下の記述

<?php echo mysql2date('Y/n/j', get_lastpostmodified(), false); ?>

(wpプラグイン)メールアドレス表示時のスパムメール対策「Akismet」

(wpプラグイン)メールアドレス表示時のスパムメール対策「Akismet」

使い方とAPIの取得の仕方は下記
(参考URL)
http://www.seotemplate.biz/blog/wordpress-plug/1034/

(wpプラグイン)記事に挿入する画像のサイズの種類を増やせるAdditional image sizes［超便利］

Additional image sizesがかなり使える。
プラグインをダウンロードしてプラグインフォルダに入れて直ぐ使える。
サイズ指定の設定はメディアのサイドバーのところで出来る。

自動縮小、トリミングも可能。

 (参考URL)
http://kachibito.net/wordpress/additional-image-sizes.html

(wp)カスタムフィールドで改行できるようにする記述

カスタムフィールドを表示させる記述に「nl2br()」を加える。
<?php echo get_post_meta($post->ID,コメント,true); ?>
 ↓
<?php echo nl2br(get_post_meta($post->ID,コメント,true)); ?>

（参考URL）
http://hm-blog.jugem.jp/?eid=106

Custom Field Templateプラグインを使ってカスタム投稿タイプでカスタムフィールドを使いたい(wordpress)［便利］

(1)まずカスタム投稿タイプをつくる。
function.phpに以下のような記述を書く。
//Galleryボタン追加 register_post_type( 'gallery', array( 'label' => 'Gallery', 'hierarchical' => false, 'public' => true, 'query_var' => false, 'supports' => array( 'title', 'editor', 'thumbnail', 'custom-fields' ) ) ); register_taxonomy( 'gallerycat', 'gallery', array( 'label' => 'Galleryのカテゴリー', 'hierarchical' => true, ) );
すると以下のようなWPの管理画面メニューに「Gallery」というカスタム投稿ボタンが出来る。

(2)(wordpress)カスタムフィールドのプラグイン
「Custom Field Template」を「pluguin」フォルダに入れて
管理画面からプラグインを有効化する。

(3)管理画面メニューの「設定」>「カスタムフィールドテンプレート」で
カスタムフィールドの設定をする。

(4)上記の画面で
テンプレートタイトルを「任意の名前(図例ではギャラリー)」
カスタムポストタイプ（カンマ区切り）:をfunction.phpで記述した
（例だと3行目のgallery） を記述する。



(5)以下のような記述でカスタムフィールドを自由にカスタマイズする。

[Hidden Thought]・・・・・フィールド名
type = textarea・・・・・・テキストエリアを作る
rows = 4・・・・・・・・・テキストエリアの高さ
cols = 40・・・・・・・・・テキストエリアの幅
tinyMCE = true・・・・・・テキストにタグをつけられる
htmlEditor = true・・・・・テキストエリアをhtmlベースに切り替えられる
mediaButton = true・・・・テキストエリアにメディアを追加出来る

 <参考URL>
http://8works-web.com/2011/06/29/wordpress_register_post_type_custom_field_template/


(6)それでカスタムフィールドを表示する記述は下記

 get_post_meta($post_id, $key, $single);

・$post_id は、メタデータの値を取得する記事のIDです。 $post->ID を使って記事のIDを取得してください。 

・$key は取得する名前の文字列です。 

・$single は true または false としてください。true に設定されている場合、結果を1つの文字列として返します。falseを設定すればリストを取得します。

(ex)
<?php echo get_post_meta(358, 'lesson_charge_02_2', true); ?>

 <参考URL>
http://wpdocs.sourceforge.jp/%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0%E3%83%95%E3%82%A3%E3%83%BC%E3%83%AB%E3%83%89%E3%81%AE%E4%BD%BF%E3%81%84%E6%96%B9

(wordpress)サムネイル画像表示方法

普通に下記のようにする。

function.phpに以下を記述
add_theme_support( 'post-thumbnails' ); //投稿サムネイルを有効

テンプレート部分に(xxx.php)以下を記述

<?php the_post_thumbnail('full'); ?>

※ fullの部分は他に以下の設定がある。

the_post_thumbnail();                  // パラメータなし -> サムネイル

the_post_thumbnail('thumbnail');       // サムネイル
the_post_thumbnail('medium');          // 中サイズ
the_post_thumbnail('large');           // 大サイズ

the_post_thumbnail( array(100,100) );

※ここで、サムネイルをこのように表示する為には

アップロード時に「アイキャッチ画像として使用」のボタンを押さないと

表示されない。(wordpress3.2現在)分からぬと何時間も時間を取られる。。

 添付画像！

(wordpress)アップロードした大きい写真をリサイズするプラグイン

(wordpress)アップロードした大きい写真をリサイズするプラグイン

「Resize at Upload plus」

wordpressの設定画面。最大幅と高さを入れるだけ。

(wordpress)記事を繰り返す記述

query postsを利用したループ。

(例)  
<?php if (have_posts()) :  query_posts('posts_per_page=5&cat=10');  ?>
<?php while (have_posts()) : the_post(); ?>
<div class="">
<?php the_title(); ?><!--タイトルを取得-->
<?php the_content(); ?><!--本文を取得-->
<?php the_time('Y年n月j日') ?><!--投稿の年月日を取得-->
<a href="<?php the_permalink() ?>">詳細を見る</a><!--パーマリンクを取得-->
</div>
<?php endwhile; endif; ?>

(参考URL)
・公式サイト
http://wpdocs.sourceforge.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88%E3%82%BF%E3%82%B0/query_posts

・スグラボさんのblog
http://blog.sugulab.com/?p=690

(wordpress)特定のページのみに特定のCSSを効かす。

wordpressで生成されたページのソースを見ると
<body class="aaaa bbbb">というようにclass名が自動的についているので
CSSで指定している記述の頭に<body>のclass名を付ければそのページにのみ
特定のCSSが効く。

(例)
.aaaa #header{
width:900px;
margin:7px;
}

(Wordpress)今表示しているページのカテゴリID取得の仕方

例）

<?php if ( have_posts() ) : 

foreach((get_the_category()) as $cat) {

$cat_id = $cat->cat_ID ;

break ; 

}

$query = 'cat=' . $cat_id. '&showposts=3';

query_posts($query) ; 

?>

<ul>

　<?php while (have_posts()) : the_post(); ?>

　<li>

　　　<?php the_content();?>

　</li>

　<?php endwhile;?>

　</ul>

<?php endif; ?>
 

参考サイト

http://blog.magical-remix.net/igalog/archives/96 

http://blog.magical-remix.net/igalog/archives/99 

(wordpress)親カテゴリと子カテゴリのID取得

get_category_childrenというタグで子カテゴリIDを取得。

(wordpress)Light Box2 プラグイン

ダウンロードしてwordpressのプラグインフォルダに入れる。
ダッシュボードの設定>Light Boxで自動でリンクが貼られるようにチェックするだけ。

<参考URL>
http://wppluginsj.sourceforge.jp/i18n-ja_jp/lightbox-2-wordpress-plugin/