カテゴリー: WordPress

wordpress カテゴリIDの確認

wordpress カテゴリIDの確認

wordpress テーマが未だすべてのカテゴリで
同じ動作をするので、これをカスタマイズします

まずはカテゴリごとに表示できるようにします

これにはカテゴリIDを調べます

ダッシュボードで
投稿 > カテゴリでカテゴリを表示します

今回は試しに ubuntu カテゴリのIDを調べますので
ubuntu をクリックします

wp-c

するとURLにカテゴリIDが表示されます

wp-c2

今回の場合

http://192.168.10.248/wordpress/wp-admin/edit-tags.php?action=edit&taxonomy=category&tag_ID=2&post_type=post

ととても長いですが

&tag_ID=2
の部分が
カテゴリのIDになります

今回なら ID は 2 になります

wordpress 自作テーマのアップロード

wordpress 自作テーマのアップロード

以前作成した wordpress のテーマを
ダッシュボードからアップロードしてみます

まず作成したテーマは vagrant の仮想マシン中にあるので
これを ubuntu にコピーします
vagrant の環境と
vagrant の設定ファイルが置かれているディレクトリは
/vagrant/
で
つながっているので
ここへコピーします

まずは

cd /var/www/html/wordpress/wp-content/themes/

でテーマのあるディレクトリに移動し

cp -rp test/ /vagrant/shoplist_theme

として
test というテーマを
shoplist_theme というテーマ名にしてコピーします

次に ubuntu 側で

mkdir aws_theme

でディレクトリを作成
ここへコピーしてから zip で圧縮します

cp -rp shoplist_theme/ ../aws_theme/

一度コピーしておけば失敗してもやり直しができます

圧縮する前に、style.css のテーマの解説の編集をしておきます

Theme Name: test
Theme URI: http://example.com/ 
Description: jquey theme test
Author: Gen snowpool
Author URI: http://example.com/ 
Version: 1.0

と適当になっているので
これらを変更します

Theme Name: テーマ名
Theme URI: テーマのURL
Description: テーマの説明
Author: テーマ製作者
Author URI: テーマ製作者のURL
Version: 1.0
へ変更します

設定項目の意味は
WordPressではじめてテーマをカスタマイズ・自作するときありがちな10のつまずき

を参考にさせていただきました

今回は

Theme Name: shoplist
Theme URI: http://snowpool.info/
Description: station near shoplist
Author: snowpool
Author URI: https://wp.developapp.net/
Version: 1.0

にしました

次にファイルを圧縮します

圧縮には zip コマンドを使います

zip コマンドに関しては
【 ファイルを圧縮・展開する（拡張子.zip） 】

を参考にさせていただきました

テーマはフォルダになっているので
圧縮時には -r オプションをつけます

zip -r shoplist.zip shoplist_theme/

これで
shoplist.zip ができたので
これをダッシュボードからアップロードすれば
テーマとして使うことができます

追加方法は
ダッシュボードの外観 > テーマをクリックして
新規追加をクリック

theme

テーマのアップロードをクリック

theme2

参照をクリックして作成した zip ファイルを選択

theme3

今すぐインストールをクリックすれば
アップロードが完了します

footer の電話と地図ボタンの動作設定

footer の電話と地図ボタンの動作設定

まず電話番号から

<?php echo post_custom("tel")?>

で電話番号がでるので

<li><a href="#" data-icon="phone">電話</a></li>

の部分をかえてみます

電話発信用のリンクを設定する

にあるように

<a href="tel:0312345678">電話はこちらへ</a>

というように

href="tel:電話番号"

となるようにすればOK

<li><a href="tel:<?php echo post_custom("tel")?>" data-icon="phone">電話</a></li>

でOK
ただしPCでは確認できないので
ipod touch や　スマホでの確認が必要

次にナビ機能

href="http://maps.google.com/maps?q=クエリ"

で起動するので

地図に関しては

<?php echo post_custom("Address")?>

で取得できるので

<li><a href="#" data-icon="location">地図</a></li>

を

<li><a href="http://maps.google.com/maps?q=<?php echo post_custom("Address")?>" data-icon="location">地図</a></li>

とすることで
google map によるナビが起動します

こちらはPCで動作確認できました

今回の変更で footer.php は以下のようになります

</div>
<div data-role="footer" <?php if(is_single()):?>data-position="fixed"<?php endif;?>>
<?php if(is_single()):?>
 <div data-role="navbar">
        <ul>
          <li><a href="tel:<?php echo post_custom("tel")?>" data-icon="phone">電
話</a></li>
          <li><a href="http://maps.google.com/maps?q=<?php echo post_custom("Address")?>" data-icon="location">地図</a></li>
          <li><a href="#" data-icon="edit">tweet</a></li>
        </ul>
      </div>
<?php endif; ?>
</div>
 Copyright　2015 <?php if(date_i18n('Y')!=2015){
   echo '- ';
   echo date_i18n('Y');
 } ?><br>
 <?php bloginfo('name'); ?>
</div>
</div>
<?php wp_footer(); ?>
</body>
</html>

お店情報ページのカスタマイズ

お店情報ページのカスタマイズ

まずは、投稿記事にサムネイル画像が表示されるようにソースを書き換えます

なお、サムネイルをダッシュボードで設定するには
functions.php で

add_theme_support('post-thumbnails');

の追記が必要になります

  <img src="image/tee.jpg" alt="" width="300" height="300">

の部分を

<?php if(has_post_thumbnail()): ?>
   <?php the_post_thumbnail('medium'); ?>
<?php else : ?>
        <img src="<?php echo get_template_directory_uri();?>/img/noimage.png" width="300" height="300"/>
<?php endif;?>

とします

これでサムネイル画像が表示されます

cshop

なお
post_thumbnail()の
パラメータでサイズ指定ができます

the_post_thumbnail();                 
// パラメータなし -> 'post-thumbnail'サムネイル
 
the_post_thumbnail( 'thumbnail' );      
// サムネイル(デフォルト 150px x 150px ：最大値）

the_post_thumbnail( 'medium' );         
// 中サイズ（デフォルト300px x 300px：最大値）

the_post_thumbnail( 'large' );          
 // 大サイズ（デフォルト640px x 640px：最大値）

the_post_thumbnail( 'full' );            
// フルサイズ　（アップロードした画像の元サイズ）
 
the_post_thumbnail( array(100, 100) );  
// 他のサイズ

詳しくは
テンプレートタグ/the post thumbnail

の解説を参考に

これでサムネイルが表示されるようになったので
次に簡単にお店にアクセスできるように
ボタンを追加していきます

footer.php の最初の div の下へ

 <div data-role="navbar">
        <ul>
          <li><a href="#" data-icon="phone">電話</a></li>
          <li><a href="#" data-icon="location">地図</a></li>
          <li><a href="#" data-icon="edit">tweet</a></li>
        </ul>
      </div>
</div>

を追加します

これでフッターにボタンが表示されます

cshop2

これでフッターのソースfooter.php は

</div>
<div data-role="footer">
 <div data-role="navbar">
        <ul>
          <li><a href="#" data-icon="phone">電話</a></li>
          <li><a href="#" data-icon="location">地図</a></li>
          <li><a href="#" data-icon="edit">tweet</a></li>
        </ul>
      </div>
</div>
 Copyright　2015 <?php if(date_i18n('Y')!=2015){
   echo '- ';
   echo date_i18n('Y');
 } ?><br>
 <?php bloginfo('name'); ?>
</div>
</div>
<?php wp_footer(); ?>
</body>
</html>

となります

アフィリエイトとWebサービス連携方法

WebサービスAPIとアフィリエイト連携
Yahoo!ショッピング
Yahoo!オークション
リクルートWebサービス
これらのサービスは、
アフィリエイト広告とつなげて収益を出すことができます
今回は、
WebAPIとアフィリエイトの連携方法は同じ書き方になるので
よく使うことがある
ホットペッパーの店舗ページへのリンクを
バリューコマースのアフィリエイトURLと連携させる方法
やり方は、
リンクになっているURLを
バリューコマースのURL + URLエンコードした
ホットペッパーのURLにするということ
バリューコマースのURLは
バリューコマースから発行それた
sid
pid
を含む
URLのことです
例えば
http://ck.jp.ap.valuecommerce.com/servlet/referral?sid=発行されたsid&pid=発行されたpid
毎回、ベースURLや、エンコードしたURLを書くのは大変なので
変数へ格納するとやりやすくなります
詳しくは
リクルートWEBサービス × バリューコマース
に載っています
参考書籍でおすすめは
WordPressプラグイン & WebAPI 活用ガイドブック [Version 3.x対応]
です

ホットペッパーグルメサーチAPI

ホットペッパーグルメサーチAPI
これは、名前のとおり、ホットペッパーのサイトから
レストランとかカフェの店舗情報を検索するもの
たぶん、私的には一番使いそうなものです
ほかのAPIみたいに、条件の絞り込みができます
詳細については
http://webservice.recruit.co.jp/hotpepper/reference.html
に書かれています
これにより
特定の場所の近所のレストランやカフェの表示
さらに、
キーワード
料理のジャンルも指定できるため
条件をうまく組み合わせることで
地域グルメ情報、
旅行先のグルメガイドなどができます
アプリにして、
旅行ガイドとかにするのもおもしろいと思います
あと、グルメサーチAPIは
バリューコマースの
アフィリエイトが使えるため
ガイド+アフィリエイトということもできます
ホットペッパーグルメサーチAPIも
リクルートWebサービスへ登録し
APIキーを取得する必要があります
登録するには
http://webservice.recruit.co.jp/
へアクセスし、
新規登録をクリック、規約に同意して
メールアドレスを登録すれば
あとは、メールアドレスあてにキーが送られてきます
あと、
リクルート WEBサービス とバリューコマースのアフィリエイトサービスを
連携させる方法については
http://webservice.recruit.co.jp/docs/vc/
にかかれています

中古車検索APIでリクエストURL作成

中古車検索APIでリクエストURL作成
カーセンサーAPIてほ、
パラメータのkeyは必須になります
ベースURLへ
パラメータをつなげて、リクエストURLを作成てきます
今回は、
都道府県
車種
を指定して、
年式の新しい順で表示します
都道府県は、pref
車種は、model
年式を新しい順にするには、order=5
として組み上げます
http://webservice.recruit.co.jp/carsensor/usedcar/v1/?key=APIキー&model=車種名&pref=都道府県コード&order=5

中古車検索API

中古車検索API
これは、カーセンサーnetのデータから
車種、色、販売地域など、
条件を指定して、表示するというもの
走行距離、年数などの情報も取得可能なため
アフィリエイトと組み合わせて
中古車検索ページや
中古車サイトも作成できる
カーセンサー中古車検索APIを使うには
リクルートWebサービスに登録し
APIキーを取得する必要があります
APIの
基本仕様は
http://webservice.recruit.co.jp/carsensor/reference.html
ベースURLほ
http://webservice.recruit.co.jp/carsensor/usedcar/v1/
リクエストパラメータの必須パラメータはkey
これほ、APIキー
その他検索用パラメータとして
model
車種
large_area
中古車店所在エリアをコードで指定
pref
中古車店の所在する都道府県をコードて指定
body
ボディの形をコードで指定
color
車の色をカラーコードで指定
keyword
ブランド
車種
モデル
説明
国
色
など、キーワードを指定
price_min
最低価格
price_max
最高価格
missiin
ATか、MTか指定
１ならAT
2ならMT
order
検索結果の並び順を指定
0 デフォルト設定で、これほ、ブランド順
1 価格の安い順
2 価格の高い順
3 車種名順
4 年式古い順
5 走行距離少ない順
start
検索結果の何件目から表示するか指定
count
検索結果の最大出力データ数
デフォルトは10
1~100で設定
レスポンスフィールドは、いかの用になります
results_available
検索結果の全件数
results_returned
レスポンス結果に含まれる検索結果の件数
results_start
検索結果の開始位置
usedcar->brand->code
ブランドコード
usedcar->brand->name
ブランド名
usedcar->model
車種名
usedcar->geade
グレード名
usedcar->price
本体価格
usedcar->inspection
車検情報
usedcar->maintenance
整備情報
usedcar->warranty
保証情報
usedcar->recycle
リサイクル規定
usedcar->desc
説明文
usedcar->body->code
ボディタイプコード
usedcar->body->name
ボディタイプ名
usedcar->odd
走行距離
usedcar->year
登録年
usedcar->shop->name
店名
usedcar->shop->pref->code
都道府県コード
usedcar->shop->pref->name
都道府県名
usedcar->shop->lat
緯度
usedcar->shop->lng
経度
usedcar->shop->datum
測地系
usedcar->color
ボディカラー
usedcar->maintenance_comment
整備に関するコメント
usedcar->maintenance_free
整備にかかる金額
usedcar->photo->main->l
大きいメイン画像のURL
usedcar->photo->main->s
小さいメイン画像のURL
usedcar->photo->main->caption
キャプション
usedcar->photo->sub
その他の画像URL
usedcar->urls->pc
PC向けURL
usedcar->urls->mobile
携帯向けURL
usedcar->urls->qr
QRコード向けURL
usedcar->warranty_comment
保証に関するコメント
usedcar->warranty_distance
保証距離
usedcar->warranty_length
保証期間
usedcar->warranty_fee
保証費用

yahooオークション検索API

yahooオークション検索APIは
通称ヤフオクで出品されている商品を検索して
条件にあったものを表示できるAPI
ちなみに、ヤフオクは
http://auctions.yahoo.co.jp/
ちなみに、これもYahoo関連なので、
アプリIDが必要になります
このYahooデベロッパー登録は
http://developer.yahoo.co.jp/
から取得可能です
今回のAPIの詳細は
http://developer.yahoo.co.jp/webapi/auctions/auction/v2/search.html
になります
APIの基本仕様として
ベースURLが
XMLなら
http://auctions.yahooapis.jp/AuctionWebService/V2/search
となります
リクエストパラメータは
必須なのが
appID
アプリID
そして
query
検索キーワード、ただしUTF-8エンコード必須
その他のパラメータとして
type
検索種類、デフォルトはすべてを対象にするall
any にすれば文字列のうちいずれかを含むになります
category
http://batchsubmit.auctions.yahoo.co.jp/show/batch_categorylist
にあるカテゴリ一覧から
カテゴリIDを数値で指定
コンピュータなら
http://batchsubmit.auctions.yahoo.co.jp/show/batch_categorylist?bigCatID=23336
となるので
23336
sort
並び替え
order と組み合わせて使う
検索結果に
注目のオークションが含まれているなら
注目のオークションが上から優先して表示される
end 終了時間
img 画像の有無
bids 入札数
cbids 現在価格
bidorbuy 即決価格
order
並び順を指定
a 昇順
b 降順
store
商品の区分状態を指定
0 すべての商品
1 オークションストアの出品
2 一般出品者の出品
aucminprice
商品価格の下限値
aucmaxprice
商品価格の上限値
aucmin_bidorbuy_price
即決価格の下限値
aucmax_bidorbuy_price
即決価格の上限値
new
newアイコンのついた商品に絞り込むときに
１　を指定する
freeshipping
送料無料に絞り込むなら
１を指定
buynow
即決価格に絞り込むなら
１を設定
thumbnail
画像のある商品に絞り込むなら
１を設定
attn
注目のオークション商品に絞り込むなら
１を設定
item_status
商品状態で絞り込み
０　指定なし
１　新品
２　中古

Amazon AdvertisingAPIでリクエストURL作成

Amazon AdvertisingAPIでリクエストURL作成
ベースURLは
http://ecs.amazonaws.jp/onca/xml
必須パラメータは
Service
AWSAccessKeyId
AssociateTag
Timestamp
Signature
Operation
SearchIndex
Service
AWSAccessKeyId
AssociateTag
については、固定、
または
発行された固有パラメータを指定します
Operationは、商品検索の
ItemLookup
を指定して、
SearchIndexは、すべてにするので
Allを指定
Timestamp
Signature
は、認証のためのパラメータ
それでは、リクエストURLの作成
これも、ベースURLへ、
リクエストパラメータをつなげデータ取得URLを作成
Amazon AdvertisingAPIでは、
Signature以外のパラメータの順番を
バイト順に並び替えたうえで、最後に
Signatureパラメータをつける
これで、リクエストURLは、
http://ecs.amazonaws.jp/onca/xml?AWSAccessKeyId=アクセスキーID&AssociateTag=アソシエイトタグ&ItemPage=1&Keywords=検索キーワード&Operation=ItemSearch&ResponseGroup=Large&SearchIndex=All&Service=AWSECommerceService&Timestamp=時刻認証&Version=20110802&sigunature=署名認証
となります
しかし、なぜか、今回自宅サーバーで
実験したときにはwordpress で表示されませんでした
もっとスキルをあげて再挑戦したいと思います