11月
4
2016

WordPressにおいて全記事にカスタムフィールドを追加、もしくは、値の一括変更 #wordpress

%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-04-01-26-27

WordPressにおいて全記事にカスタムフィールドを追加(かつ値を設定)、もしくは、値の一括変更を行いたい時のプログラム
%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-04-01-26-27


<?php
query_posts('posts_per_page=-1'); //全記事のループ
while ( have_posts() ) {
	the_post();
	add_post_meta( get_the_ID(), "カスタムフィールドの名称", 値, true );
	//最後のパラメータについて
	//「true」→該当記事に指定カスタムフィールドが既に存在する場合は何もしません。
	//「false」→該当記事に指定カスタムフィールドが既に存在していても指定した値に書き換わります。
}

?>

参考:
関数リファレンス/add post meta – WordPress Codex 日本語版


10月
9
2016

[WordPress]ナビゲーションメニューのメニューの個数を数えて各メニュー幅のサイズを自動調整する #wordpress

menu

久しぶりの記事です。

概要

WordPressのグローバルメニューに設定する各メニューの個数が変わった時に、各メニューの表示幅を自動で設定する方法です。

使用例

・グローバルメニューが増減した際に、画面のウインドウ幅に対して等分割で各メニューを表示したい場合に使用します。

前提条件

・Wordpress4.6.1で動作確認しています。

実際に実装した際の表示例(スクリーンショット)

menu
※メニューが6個の場合

サンプルプログラム

ソース

<?php
//ナビゲーションメニューの親メニューの個数を数える
$locations	= get_nav_menu_locations();
$items 		= wp_get_nav_menu_items( $locations['primary'] );
$num_menu 	= 0;
 
foreach( $items as $item ) {
	if( $item->menu_item_parent == 0 ){	//親メニューの場合、menu_item_parentの値が0、子メニューの場合、親メニューの番号が戻り値
		$num_menu++;
	}
}
?>

<!-- 親メニューの個数によって各メニューの幅を自動的に変える -->
<!-- 「.main-navigation .primary-menu > li」の箇所はテーマによって異なります。 -->
<style type="text/css">
<!--
.main-navigation .primary-menu > li {
	width:<?php echo sprintf( "%.4f" , (100/$num_menu)) ."%" ?>;
}
-->
</style>

</head>

WordPress関数補足

get_nav_menu_locations
wp_get_nav_menu_items

最後に

以前より、メニューの個数が変わった場合、CSSを直接書き換えていたのですが、クライアントさんに納品する際に、CSS書き換えが難しいクライアントさんもいらっしゃるわけでそういう場合には、この方法、有効だと思います。さらにいえばフォントサイズ等もケアすればいうことないのでしょうが、それはまた機会を改めて。


3月
19
2016

[WordPress/twitter/cron]条件合致したWordPress記事を定時に自動ツイートする仕組み #WordPress #twitter #cron #php #TwitterOAuth

スクリーンショット 2016-03-19 16.28.15

概要

条件合致したWordpress記事を定時に自動ツイートする仕組みを構築してみました。

主な使用技術

・twitterアプリ設定
・twitterアプリを用いてphpでツイートするプログラム作成
・Wordpressの記事を読み込むプログラム作成
・ロリポップcron設定

処理の流れ

(1)ロリポップcronにより、指定された時刻等にsh起動(実験の結果、php直接起動が出来ないため)
(2)phpプログラム起動
・Wordpress記事読み込み
・記事のタイトル、リンク、アイキャッチ画像をtwitterに投稿
(3)twitterに自動投稿される

適用例

WordPress対象サイト:http://sample.nakamurayuji.com/wp2/art/exhibition
自動投稿されるtwitter: https://twitter.com/testug1965
※twitter投稿例の画像:
スクリーンショット 2016-03-19 16.28.15

各技術ごとの詳細(参考サイトとともに)

(1)twitterアプリ設定
Twitter Application Managementにアクセスし、
・Consumer Key
・Consumer Secret
・Access Token
・Access Token Secret
の4つを取得します。
こちらのサイトを参考にすれば比較的簡単に処理可能と思います。
PHPからTwitterツイート(2015年2月版) – Qiita

(2)twitterアプリを用いてphpでツイートするプログラム作成
・こちらも先ほどのサイト( PHPからTwitterツイート(2015年2月版) – Qiita )で問題ないですが、あとで設定するロリポップのcronのマニュアルに、プログラム内部の参照は絶対パスで記述する旨記載されていたのでそこを対応。
・また、画像を投稿する場合も、同じサイトの別記事に参考ありました!→abraham/twitteroauthを使う – Qiita

(3)Wordpressの記事を読み込むプログラム作成
これが難関かとおもいきや、たった1行の追加で実現できました。これさえ行えば、あとは、Wordpressの関数を思いの通り使用すれば良いです。
外部の php クラスや関数から WordPressの関数あるいはタグを含めた API を扱う方法 : WordPressをインストールしてみた

(4)ロリポップcron設定
ここが一番ハマりました。
ロリポップのcronマニュアル:cron設定 / ユーザー専用ページ / マニュアル – レンタルサーバーならロリポップ!
を参考に設定したものの、下記のようなエラーが。

X-Powered-By: PHP/5.2.17
Content-type: text/html

<br />
<b>Parse error</b>:  syntax error, unexpected T_STRING, expecting T_CONSTANT_ENCAPSED_STRING or '(' in <b>/home/users/ユーザディレクトリ/web/sample/wp2/◯◯◯.php</b> on line <b>11</b><br />

まず、コチラのサイト:ロリポップサーバーでCronの使い方の下の方に、

■ロリポップのphpは初期設定でphp5.2になっています。
スクリプトの先頭には「#!/usr/local/php5/bin/php」と記入してください。
phpを5.3や5.4に変更していた場合は「#!/usr/local/php53/bin/php」か「#!/usr/local/php54/bin/php」に変更してください。

とあり、該当サイトのPHPが5.4だったことから、「#!/usr/local/php54/bin/php」と記述したものの、実は、「php54」ではなく「php5.4」と記述することがロリポップのこちら( PHP設定 / ユーザー専用ページ / マニュアル – レンタルサーバーならロリポップ! )
スクリーンショット 2016-03-19 19.26.03
に記載されておりましたので修正。

それでもエラーのまま動作しなかったので色々ググった結果、こちらのサイトがまさにどんぴしゃ!!(Google万歳ですよ!)
ロリポップでcron向けのPHPのバージョンがおかしい件

このサイトの説明通り、シェルスクリプトをcronで指定し、そこからphpを起動する方法に変更したら動作しました!!

最終的なphpコード(一部省略しています)

#!/usr/local/php5.4/bin/php

<?php

//Wordpressと連携、フルパスで記述
require (dirname( __FILE__ ) . '/wp-blog-header.php');

// OAuthライブラリの読み込み、フルパスで記述
require (dirname( __FILE__ ) . '/twitteroauth/autoload.php');
use Abraham\TwitterOAuth\TwitterOAuth;

//twitter認証情報4つ(桁数も実際とは異なります)
$consumerKey = "XXXXXXX";
$consumerSecret = "XXXXXXXXXXX";
$accessToken = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
$accessTokenSecret = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";

//twitter接続
$connection = new TwitterOAuth($consumerKey, $consumerSecret, $accessToken, $accessTokenSecret);

//日本の時間に設定
date_default_timezone_set('Asia/Tokyo');

//Wordpress Query 定義、あるカスタムフィールドの値で降順に並び替えた上で、3記事を投稿しています。これは一例ですので仕様に応じて修正を。
query_posts( array( 'posts_per_page' => 3, 'orderby' => 'meta_value' , 'meta_key' => 'カスタムフィールド名称' , 'order' => 'DESC' ) );

// ループ(改変したメインクエリ)
if ( have_posts() ) : 
    while ( have_posts() ) : the_post();
		//記事タイトルとリンクを取得
		$temp_title = get_the_title();
		$permalink = get_permalink();

		//アイキャッチがある場合は画像付きで投稿
		if (has_post_thumbnail()) {
			//時刻取得
			$nowtime = date( "m/d H時i分" ) ;
			
			// アイキャッチ画像のIDを取得
			$thumbnail_id = get_post_thumbnail_id();
			//アイキャッチ情報取得
			$image_info = wp_get_attachment_image_src($thumbnail_id);
			//リンクは配列[0]
			$image_link = $image_info[0];
			//メディアアップロード
			$media_id = $connection->upload("media/upload", array("media" => $image_link));
			//投稿、時間、タイトル、リンク、画像
			$res = $connection->post("statuses/update", array("status" => ( $nowtime . ' ' . $temp_title . " " . $permalink) , "media_ids" => $media_id->media_id_string ));
		//アイキャッチがない場合はタイトルとリンクのみ投稿
		} else {
			//投稿、時間、タイトル、リンク
			$res = $connection->post("statuses/update", array("status" =>  ( $nowtime . ' ' . $temp_title . " " . $permalink) ));
		}

		//動作確認用としてタイトルを表示
		echo "<p>" . $temp_title ."</p>";
    endwhile; 
else:
    // 何も取得されなかった
endif;

// クエリをリセット
wp_reset_query();
?>

最終的なshコード

#!/bin/bash
/usr/local/php5.4/bin/php /home/users/ユーザフォルダ/web/sample/wp2/◯◯◯◯◯.php

最終的なcron設定

スクリーンショット 2016-03-19 19.28.23

参考サイト(ありがとうございます!上記で紹介したものをまとめているのみです)

・twitterアプリを用いてphpでツイートする
http://qiita.com/tsunet111/items/9309801cd3e3bcf6e32a
・twitterへphpを用いて画像投稿する
http://qiita.com/kino0104/items/9f9e6f75d58b40663673
・Wordpress連携
http://wp-setting.info/setting/php-use-wordpress-api.html
・cron設定する際の注意(PHPプログラム側、及び、cron側)
http://servercheap.info/lolipop/cron.html
http://specialized.jp/lolipop_cron_trouble/
・ロリポップcronマニュアル
https://lolipop.jp/manual/user/cron/
・ロリポップPHP設定
https://lolipop.jp/manual/user/php-setting/

後日談

動作しているロリポップのcron、1時間おき動作のはずが、時々動作しないことがあるようで、これについてはちょっとよくわかりません。
しばらく様子見したいと思います。
スクリーンショット 2016-03-19 19.22.59

これで紹介は以上になります。


2月
11
2016

[WordPress]投稿記事内においてショートコードで外部PHPを呼び出す。

スクリーンショット 2016-02-11 10.46.49

久しぶりのWeb系、Wordpressの記事です。
スクリーンショット 2016-02-11 10.46.49

概要

WordPressのショートコードで外部PHPファイルを読み込む方法の紹介です。また後半では、外部PHPでPC用/モバイル用各々のウィジェットを呼び出す例も紹介しています。

使用例

・投稿記事の途中に定型文や広告コード(PHPファイルに直接記述したものも、テキストウィジェットに記述したものも可能です)を挿入したい。
・投稿記事の途中にブログの最新記事5つのタイトル一覧を表示したい。
などなど。
※プラグイン等を利用することで可能になる場合もありますが、例えば広告を挿入したいが、パソコンとスマホで別サイズの広告を挿入したい時などは便利です。

前提条件

・本投稿でのサンプルコードはテーマ「STINGER5」の子テーマ上に準備しています。
・途中、is_mobile()関数を使用していますが、これは、「STINGER5」に実装されている関数ですので、Wordpress全環境での動作は保証しません。Wordpress標準でwp_is_mobile()関数は用意されているようです。このあたりは適時読み替えて下さい。

実際に実装した例のURL

・実装例1:オリジナルのショートコード実験1(単純テキスト読み込み) | sample2
・実装例2:オリジナルのショートコード実験(PC/モバイル別にウィジェット読み込む例) | sample2
・実装例3:オリジナルのショートコード実験(最新記事タイトル表示例) | sample2

基本的な実装(単純テキスト出力)

準備1:ショートコードの定義

・functions.phpに任意の文字列で定義されたショートコードを使用可能にするための記述を行います。
・ショートコードを「myphp」とした例を記述します。

//ショートコードを使ったphpファイルの呼び出し方法
function Include_my_php($params = array()) {
    extract(shortcode_atts(array(
        'file' => 'default'
    ), $params));
    ob_start();
    //include(get_theme_root() . '/' . get_template() . "/$file.php"); //子テーマ利用の時に動作しないのでコメントアウト
	get_template_part($file,'');	//$fileで取得した外部PHPファイルを読み込みます
    return ob_get_clean();
}
add_shortcode('myphp', 'Include_my_php');	//'myphp'がショートコードの文字列となります。

準備2:外部PHPファイルの準備

・読み込む外部PHPファイルを準備し、動作させたい処理を記述します。
・ここでは、定型文を挿入することを前提に単純にテキストをechoする例を載せておきます。
・「echo_text.php」というファイル名で準備

<p>
<?php echo '●ここに定型文を記載します'; ?>
</p>

準備3:表示させたい箇所にショートコードを記述します

・投稿本文内などに、準備2で準備したPHPファイルの内容を表示させたい場合は、以下のように記述します。

[myphp file='echo_text']

・下記の’ファイル名’の部分に読み込みたい外部ファイル名を記述します

[myphp file='ファイル名']

・このあと紹介する実際の例では下記のように記述しています。

テスト投稿です
[myphp file='echo_text']
テスト投稿です

以上で準備完了です。

実装例1

・上記を実際に実装した例はコチラです。→オリジナルのショートコード実験1(単純テキスト読み込み) | sample2
・表示例
スクリーンショット 2016-02-11 10.00.21

実装応用編(外部PHPでウィジェットをPC/モバイルにあったウィジェットを読み込む)

応用1ー1:ウィジェットを読み込む外部PHPファイルの準備

・ここでは、パソコンではパソコン用のウィジェット、スマホではモバイル用のウィジェットに定義された内容を表示しています。
・「myphpwidget.php」というファイル名で準備

<div class="myphp-widget">
	  <!--PC用のウィジェット読み込み -->
		<?php  if ( (!is_mobile()) && is_active_sidebar( 'pc-myphp-widget' ) ) { ?>
		<ul class="pc-myphp-widget">
			<?php dynamic_sidebar('pc-myphp-widget'); ?>
		</ul>
		<?php  } ?>
	  <!--mobile用のウィジェット読み込み -->
		<?php  if ( (is_mobile()) && is_active_sidebar( 'mobile-myphp-widget' ) ) { ?>
		<ul class="mobile-myphp-widget">
			<?php dynamic_sidebar('mobile-myphp-widget'); ?>
		</ul>
		<?php  } ?>
</div>

応用1ー2:ウィジェットの準備

・ウィジェットエリアは既に存在していることを前提とし、そのウィジェットにテキストウィジェットを追加し定型文を表示させるための準備です。
 ※ウィジェットエリアそのものを追加する方法についてはこちらを参照下さい→[WordPress]フッター(フッタ以外にも応用可能)にウィジェットを追加する方法 #wordpress « curation by nakamurayuji

・ウィジェット’pc-myphp-widget’定義内容
スクリーンショット 2016-02-11 09.30.40

●これはPC用ウィジェットです●
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。

・ウィジェット’mobile-myphp-widget’定義内容
スクリーンショット 2016-02-11 09.33.52

●これはモバイル用ウィジェットです●
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。
ここにショートコードmyphpを利用して挿入したいテキスト、HTML等を記述します。

応用1ー3:投稿への記述

テスト投稿です


[myphp file='myphpwidget']


テスト投稿です

応用1ー4:表示例

・上記を実際に実装した例はコチラです。→オリジナルのショートコード実験(PC/モバイル別にウィジェット読み込む例) | sample2
 ※スマホとPC両方でアクセスして頂けると違いがわかるかと思います。

・表示例(PC)
スクリーンショット 2016-02-11 10.35.08

・表示例(スマホ)
IMG_1155

●パソコンとスマホで表示内容が異なることがわかると思います。

実装応用編その2(おまけの実装:ブログ最新5記事のタイトル一覧を表示させてみました)

応用2ー1:最新5記事タイトルを読み込む外部PHPファイルの準備

・「new_article_list.php」というファイル名で準備

<ul>
  <?php query_posts('posts_per_page=5'); ?>
  <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
  <li>
    <a href="<?php the_permalink(); ?>"><?php the_title();?></a>
  </li>
  <?php endwhile; endif; ?>
  <?php wp_reset_query(); ?>
</ul>

応用2ー2:投稿への記述

ここから本ブログの最新記事5つのタイトルを表示します。
[myphp file='new_article_list']

応用1ー4:表示例

・上記を実際に実装した例はコチラです。→オリジナルのショートコード実験(最新記事タイトル表示例) | sample2
・表示例
スクリーンショット 2016-02-11 10.44.26

●最新5記事のタイトルが記事内に表示できました

参考サイト

ショートコードを使ったphpファイルの呼び出し方法。 | 小さな会社の経営者の為のWeb集客実践塾
※こちらの参考サイトですと子テーマでは何かしらのカスタマイズが必要になるかと思いますが、とても参考になりました。ありがとうございます!!

最後に

今回、これを使用しようと思った最大の理由は、記事内の任意の位置に広告を表示したいというお客様の要望によるもの。※いつもありがとうございます!
広告ってレスポンシブサイズの広告もあるけれど、やはり、パソコンはパソコン用のサイズで、スマホはスマホ用のサイズで表示したいという要望も多いので、今回の方法はとても役に立ちました。


1月
13
2016

[design works]capture works and music | 両面名刺

omote_justsize-01

前回名刺の反省と2015.9の個人事業主登録(屋号:capture works and music)を契機に名刺作りなおしました。
よりシンプルにしました。

ura_justsize-secret

omote_justsize-01

Illustrator CC / Photoshop CC
欧米名刺サイズ(89mm×51mm)
印刷;printpac
2016.1.11








About

中村勇治 nakamura yuji
Fukuoka, Japan

ICT and Electronics engineer
blogger
musician

portal site is here:
http://www.nakamurayuji.com/

as a musician:
http://capture.nakamurayuji.com/
as a curator:
http://curation.nakamurayuji.com/
DIARY:
http://diary.nakamurayuji.com/

Counter

Access
Total:410996
Today:155
Yesterday:147
Unique Access
Total:99980
Today:69
Online Users:1

CALENDER

2016年12月
« 11月    
 123
45678910
11121314151617
18192021222324
25262728293031