WordPressのキャッシュを比較してみる

WordPressでどのようなツールでキャッシュするとどうなのか比較してみました。

 

初期値のスペック。

GTMETRIXで比較(https://gtmetrix.com/

 

abコマンド(ab -n 1 -c 1):Requests per second: 1.67 [#/sec] (mean)

abコマンド(ab -n 10 -c 10):Requests per second: 2.39 [#/sec] (mean)

abコマンド(ab -n 100 -c 100):Requests per second: 1.78 [#/sec] (mean)

abコマンド(ab -n 1000 -c 100):NG

スペックをかなり落としているのでここまでらしい…

 

 

kusanagiのbcacheをON

 

abコマンド(ab -n 1 -c 1):Requests per second: 24.79 [#/sec] (mean)

abコマンド(ab -n 10 -c 10):Requests per second: 71.82 [#/sec] (mean)

abコマンド(ab -n 100 -c 100):Requests per second: 134.61 [#/sec] (mean)

abコマンド(ab -n 1000 -c 100):Requests per second: 362.26 [#/sec] (mean)

abコマンド(ab -n 10000 -c 1000):Requests per second: 274.28 [#/sec] (mean)

 

「onにします。失敗しました。WP_CACHE定数が重複して定義されています。完了しました。」と表示される場合

キャッシュはONではありません。ややこしいのですが「wp-config.php」に下記の行が必要です。重複でないのでメッセージがややこしくしてます。

define('WP_CACHE', true);

 

WordPressプラグインのWP Super Cacheを使用

※kusanagiのキャッシュはオフ

とりあえず、設定は初期値で。キャッシュを有効化

abコマンド(ab -n 1 -c 1):Requests per second: 95.30 [#/sec] (mean)

abコマンド(ab -n 10 -c 10):Requests per second: 137.31 [#/sec] (mean

abコマンド(ab -n 100 -c 100):Requests per second: 394.15 [#/sec] (mean)

abコマンド(ab -n 1000 -c 100):Requests per second: 744.06 [#/sec] (mean)

abコマンド(ab -n 10000 -c 1000):Requests per second: 886.51 [#/sec] (mean)

 

キャッシュの結果まとめ

-N1 -C1 -N10 -C10 -N100 -C100 -N1000 -C100 -N10000 -C1000
初期値 1.67 2.39 1.78
bache 24.79 71.82 134.61 362.26 274.28
WP Super Cache 95.3 137.31 394.15 744.06 886.51

 

あれ、kusanagiのbacheよりwp super cacheの方が1秒間あたりに処理できる数が多いことが判明!!

bacheにこだわっていたがそうでもないようだ。ただ、これは計測結果の一つなので環境やHP構成によっても異なるので注意を。

 

 

kintoneをはじめてみました。

この度「kintone」(キントーン)を始めてみることにしました。

 

kintone(キントーン)とは

 

サイボウズのkintoneでは、顧客管理、案件管理、アンケート、〇〇業務…などなど多目的に利用できるツールです。

くわしくは↓

https://kintone.cybozu.co.jp/

 

簡単にフォームを作ることはできるのですが、IF文などはjavascriptにて作成するとのこと。

例:選択Aが選択されているときだけ有効になる入力ボックス等

 

下準備

とりあえず、デベロッパー登録

https://developer.cybozu.io/hc/ja

 

そして、チュートリアル

 

まあ、簡略するとjavascriptを使うときには自分で作ったファイルをアップロードするかJSEdit for kintoneを利用するようだ。

「JSEdit for kintone」はJSEdit for kintoneを使ってみようコーナーからダウンロードしてプラグインとして読み込む。

 

その後、個別のアプリで「アプリの設定」>「プラグイン」から「JSEdit for kintone」プラグインを追加する。

追加したプラグインの設定欄の歯車からコード作成画面を開くことが可能

 

覚えたてのhogehogeコード

詳細を開いたときに処理を行う

    kintone.events.on('app.record.detail.show', function(e) {
~略~
    });

※「https://developer.cybozu.io/hc/ja/articles/360000903686」を参照

 

一覧を表示したときに処理を行う

    kintone.events.on('app.record.index.show', function(e) {
~ 略 ~
    });

※「https://developer.cybozu.io/hc/ja/articles/360000903686」を参照

 

イベントはまとめて書くとよいみたいなので

    var events = ['app.record.detail.show',
        'app.record.create.show'];

    kintone.events.on(events, function(event) {
~略~

 });

って感じで詳細のときと追加の時の処理になる。

 

↓イベント。チュートリアルサイトより。

| app.record.detail.show | レコード詳細画面表示時 |
| app.record.create.show | レコード追加画面表示時 |
| app.record.create.change.past | レコード追加画面表示でフィールドコード[past]変更時 |
| app.record.create.change.radio2 | レコード追加画面表示でフィールドコード[radio2]変更時 |
| app.record.create.change.radio3 | レコード追加画面表示でフィールドコード[radio3]変更時 |
| app.record.create.change.radio4 | レコード追加画面表示でフィールドコード[radio4]変更時 |
| app.record.create.change.radio5 | レコード追加画面表示でフィールドコード[radio5]変更時 |
| app.record.edit.show | レコード編集画面表示時 |
| app.record.edit.change.past | レコード編集画面表示でフィールドコード[past]変更時 |
| app.record.edit.change.radio2 | レコード編集画面表示でフィールドコード[radio2]変更時 |
| app.record.edit.change.radio3 | レコード編集画面表示でフィールドコード[radio3]変更時 |
| app.record.edit.change.radio4 | レコード編集画面表示でフィールドコード[radio4]変更時 |
| app.record.edit.change.radio5 | レコード編集画面表示でフィールドコード[radio5]変更時 |

 

よくある「その他」の選択肢を選ぶと理由を書く場合(選択肢(input_select)、理由ボックス(input_select_other)とした場合

    //レコードの追加、編集、詳細画面で適用する
    var events = ['app.record.detail.show',
        'app.record.create.show',
        'app.record.edit.show',
        'app.record.create.change.input_select', 
        'app.record.edit.change.input_select'];

    kintone.events.on(events, function(event) {
        var record = event.record;
        var input_select = record['input_select']['value'];
        if (input_select === 'その他') {
            kintone.app.record.setFieldShown('input_select_other', true);
        } else {
            kintone.app.record.setFieldShown('input_select_other', false);
        }
    });

こんな感じでその他の選択肢が表示非表示となる。

 

 

 

Zoomのブレークアウトルームを使ってみる

Zoomにもいろいろな機能があり、使ってみないと??っていうわからない機能があります。その中の機能で気になったのがブレークアウトルーム!!

 

文字通り、ホストで開催した会議から少人数の会議へ異動して戻ってくるというような機能です。

※初期状態ではブレークアウトルームがオフになっています。

 

初期設定

「個人」>「設定」を開きます。

 

「ミーティングにて(詳細)」のブレークアウトルームを有効にする

 

ミーティング中もしくは準備でブレイクアウトルームを使う

 

・スケジューリングの場合は「ミーティングオプション」にブレークアウトルームが追加される。

 

・ZOOMアプリの場合は

バーのところにブレークアウトセッションが追加される

 

セッション割り当てを行う。参加人数に対して何人で割り振るのかって感じ。

 

割り振られたメンバーは、セッションに参加というメッセージが表示され参加を押す

 

自分(ホスト)がブレークセッションに参加する場合は、「参加」をクリックすると入れる。

 

 

ブレークアウトセッションにいった人の一部の人だけ強制的に戻すことはできないみたいだ。

ホストがブレークアウトセッションを強制停止するには1分かかるようだ。

 

オプションで、いろいろと設定できるみたい。

 

その他ブレークアウトルームを使ってみて気になった点

 

ブレークアウトルームは、ミーティングモードのみで利用可能。

詳しくはこちらのヘルプを参照

 

一度、割り振りしたルームからの変更はできない。

Aさんは、ルーム1に参加してね。やっぱりルーム2に参加してねってだめっぽい。(ブレークアウトセッションを停止しないとNG)

 

ホストしかブレークルームに往来できない?

例えば、リアルのワークショップを想定した場合にメインの進行役とサブの補助的な人がいると思いますが、

補助的な人を各ブレークアウトを巡回させるには共同ホストの機能を有効化して、あれこれすればいけるようだ。

事前設定:「個人」>「設定」で「共同ホスト」欄があるのでオンにする。

 

1.補助的な人を共同ホストにする

2.ブレークアウトセッションに共同ホストの人も参加させる

3.共同ホストの人のZOOMにはブレークアウトセッションが表示さているので表示すればルーム移動が表示される

 

※イメージ的には、スタッフセッションでも作ってそこに参加させておいて、回るイメージでしょうか…

・共同ホストになったときのブレークアウトセッション

 

ブレイクアウトとブレークアウト?

ところどころごっちゃな感じで表示されていますが…

 

 

使い方の練習が必要ですなぁ

Publish kintone dataプラグインでWordPressにデータを送ってみるのまき

kintoneを前回、WordPressからkintoneにデータを送るのを試してみました。今度はkintoneからWordPress側にデータを反映してみたいと思います。

 

利用するプラグインは「Publish kintone data」です。(https://ja.wordpress.org/plugins/import-kintone/

使い方は「https://ht79.info/2017/08/19/how-to-publish-kintone-data/」を参照していただければ、簡単に連携できます。

 

気になった点をまとめてみた。

・ACF(Advanced Custom Fields)との連携。

⇒そのままカスタムフィールドに値を設定すればいい感じ。repeatはちょっとね…

 

・kintoneから新規に追加された記事が下書きとなる。

⇒プラグインを見てみたところ、「import_kintone_insert_post_status」でフィルターを掛ければ、指定できそうだということでざっくりと。

function func_import_kintone_insert_post_status($status)
{
	return 'publish';
}
add_filter('import_kintone_insert_post_status', 'func_import_kintone_insert_post_status',10,3);

こんな感じで「公開」になる。

 

・kintoneから更新された場合にステータスを変えられるのか

⇒だめそうっすな。そのままだと。更新時は、ステータスは変更しないみたい。

 

 

 

 

 

ContactForm7とkintoneを連携していみる

ワードプレスの問い合わせフォームとしてコンタクトフォーム7が定番ですが、これをkintoneと連携してみたいと思います。

 

■初期準備手順

・contactform7プラグインをインストールする

・「Form data to kintone」プラグインをインストールする

 

・kintoneにユーザー登録をする

https://kintone.cybozu.co.jp/」無償お試しがあるのでそれで行ってみます。

 

すでに登録があったらしくサイボウズストアからパスワードリセットをして、お試しでkintoを選んでみました。

 

 

 

■kintoneで問い合わせフォームのアプリを作る

・「設定」>「アプリ管理」>「アプリを作成する」をクリックする

・「はじめから作成」をクリックする

 

・ペタペタとパーツを入れてフォームを作る

 

・「フィールド名」と「フィールドコード」を設定する

 

・「設定」タブ>「APIトークン」をクリックする

APIトークンを生成する。レコード閲覧とレコード追加のアクセス権を付与した

 

・URLのところに「app=XX」と数字があるのでこの数字がAPP IDになるので記録しておく。

 

■WordPressのコンタクトフォームでkintoneの設定をする

・コンタクトフォームのkintoneのタブを開く

・下記の設定を行い、「GET」ボタンを押す。

kintoneのドメイン:取得した時のドメイン名

kintone へ登録エラーを送信するメールアドレス:エラーを送信するアドレス

APP ID:URLで「app=XX」となっていた数字

API TOKEN:作成したAPIトークン

 

 

 

・コンタクトフォームのフィールドとkintoneのアプリのフィールドを一致させ、保存する

 

あとはフォームを設定してテスト。

成功すればkintoneのアプリにデータが格納される。

 

■その他

・添付ファイルについて

「Form data to kintone」プラグインでは、Add onとなっているが今とのころ未定っぽい。

以前はフォームクリエイターというのが別サービスであっただのが今は終わってしまい「フォーム」ブリッジというのを利用するとkintoneのフォームを一般公開できるみたい。

あとは、自作するしかないっぽいな…

 

・ルックアップフィールドは登録、更新ができない。

そのような仕様とのこと。

https://developer.cybozu.io/hc/ja/articles/201941754#step12

 

 

welcartで見積書、請求書、納品書、領収書に印鑑のイメージやロゴを入れたい

welcartで見積書、請求書、納品書、領収書に印鑑のイメージやロゴを入れたい場合のメモです。

 

結論からするとfunctionでfilterを追加することになります。

 

・function.phpに追記

function my_filter_pdf_sign() {
	return get_template_directory() . '/画像ファイル.jpg';
}
add_filter( 'usces_filter_pdf_estimate_sign', 'my_filter_pdf_sign' );//見積書
add_filter( 'usces_filter_pdf_invoice_sign', 'my_filter_pdf_sign' );//納品書
add_filter( 'usces_filter_pdf_receipt_sign', 'my_filter_pdf_sign' );//領収書
add_filter( 'usces_filter_pdf_bill_sign', 'my_filter_pdf_sign' );//請求書

 

・サイズや位置を指定する場合(横の位置、縦の位置、画像の幅、画像の高さ)

function my_filter_pdf_sign_data() {
	return array(110, 50, 50, 50);
}

 

うーん。複数は設定できなさそうなので、どっちか1つですかね。。

 

ワードプレステンプレートのTCDのテーマカスタマイズ承ります。

ワードプレステンプレートのTCDで販売されているテーマのカスタマイズを行います。

 

■TCDとは

「私たちは、この市場のニーズに応え、低コストでハイクオリティ、
そして、驚異的にインパクトのあるサイトが構築できるWordPressテーマTCDを開発し続けています。」とことで作られているテーマです。TCDはこちら

 

■カスタマイズって何するの?

TCDのテンプレートだけで、それなりに全部できてしまいます!!じゃあ、何をどうするのかというと作りこんでいくといくつか欲望!?が出てくるのでそれを実現するために行います。

 

・カスタム投稿を追加したい

・会員機能を追加したい

・投稿ページを追加したい

・お問い合わせフォームを追加したい

・検索機能をカスタマイズしたい

・TCDのテーマ設定オリジナル設定項目を追加したい

・TCDのテーマをベースにして多店舗展開用のHPを用意したい

…などの他、

・TCDのテンプレートへ移行したい。

 

を行っていきます。

 

■料金について

カスタマイズする内容によって、正直なところ金額が変わります。それなので具体的にどうしたいのか示していただかないとお見積りをすることが難しいです。(数万円~数十万円??)

詳しくは「ホームページ作成東京.com」からお問い合わせください。

 

 

welcartでpaypalエクスプレスチェックアウトの決済を設定してみる

WordPressのショッピングサイトツールのWelcartでPaypalエクスプレスチェックアウトの決済を設定してみたいと思います。

※Paypalアカウントが登録されていることが前提。

 

■本番用のAPI情報を取得する

・PayPalのサイトにアクセスします

・右側の設定アイコンから「アカウント設定」をクリックします。

 

・APIアクセスの更新をクリックします。

 

 

・「NVP/SOAP APIの実装(旧バージョン)」の「API認証情報の管理」をクリックします。

 

・APIの情報が表示されます。

この内容は本番用として、何かにメモとして保存しておきます。

 

■ウェブペイメントの設定

ウェブペイメント設定ページを開きます。

https://www.paypal.com/businessmanage/preferences/website

 

自動復帰の設定

顧客がペイパルで決済を完了した際、ペイパルの決済画面から自動的にECサイトに戻るよう設定を行います。とのこと。

↓自動復帰の説明(Paypal)

https://www.paypal.com/jp/webapps/mpp/developer/paypal-button/checkout-setting

・自動復帰のURL(?acting=paypal_wpp&acting_return=1を付けるとのこと)詳しくはこちら

https://ECサイトURL?acting=paypal_wpp&acting_return=1

 

PayPalアカウントオプションサービス

「オン」にする。アカウントが無い人でも支払いできるようにするためのオプション

 

 

■テスト用アカウントの準備

Sandbox test accountsは下記のURLから。

https://developer.paypal.com/developer/accounts/

 

アカウントが無い場合は「Create Account」から作成する。TypeがBusinessは販売、Personalは買う人

「Manage accounts」欄からAPIに必要な情報を記録する。あとメールアドレスも。

 

 

 

■Welcartの設定手順

・WordPressの管理画面で「Welcart Shop」>「クレジット決済設定」をクリックします。

・利用できるクレジット決済モジュール欄から「Paypalエクスプレスチェックアウト」を右側の「利用中のクレジット決済モジュール」に移動させて「利用するモジュールを更新する」をクリックします。

 

・そうすると「Paypal(EC)」タブが表示されます。

 

 

・上記の作業で本番用とテスト用のAPIを取得しているので利用する用途に合わせて入力します。

 

※最初はテストで動作させて動くか確認します。

 

・「Welcart Shop」>「基本設定」で支払い方法にPaypalを追加する。

 

 

■動作確認

実際に適当な商品をカートに入れて決済に移動します。Paypalで支払うと表示されたら、テスト用のアカウントでログインして決済します。

 

正しくできていればよいのですがエラーメッセージが表示された場合は、「Welcart Management」ページを開き、上部に「決済エラーログ」の文章が表示されているのでそこでエラーを確認できます。

 

一度できてしまえばそんなもんというところですがPaypalの設定は、マニュアルと実際の画面が異なったり、新旧の情報が散乱しているので、ほかと比べて面倒くさいと感じてしまいます。

 

こんなところです。

welcartで商品一括登録を行ってみるって言いながらもその他もろもろ

WordPressのショッピングカートのwelcartの商品一括登録を行ってみました。

その時のメモを残しておきます。

 

※Welcartの商品一括のマニュアルはこちら

 

 

商品一括登録手順

・メニューの「Welcart Shop」>「商品マスター」をクリックする。

・「操作フィールド表示」をクリックする

 

・そうすると右側に「商品一括登録」「商品データ出力」が表示される

 

・商品インポートの元ファイルは、マニュアルサイトにサンプルのエクセルがあるのでそちらをベースに用意します。

SKU展開するしない等あるので、実際に一括取込する前にテストサイトで試すのが良いです。

※注意:1.9.31で試したところインポートはCSVのみ。1行目にヘッダーは必須

 

元のファイル(Excelで開いたところ)

 

インポートした画面

 

 

■インポートをやってみてわかったこと

存在しないカテゴリを指定した時は、何も選択もカテゴリの追加もされない。

カテゴリは、スラッグ指定ではうまくいかなかった。IDは問題なし

 

取込のCSVのPost IDが空欄だと新規登録となり、商品コードがすでに登録されていると登録がスキップされる

⇒既存の商品を更新したい場合はPost IDを指定する

 

 

商品をゴミ箱に捨てた場合は、「検索項目」>「表示状態」>「ゴミ箱」とすることで表示される

 

Advanced Custom Fields PROを利用することができない!??

Advanced Custom Fields PRO を Welcart で使えるようにするためのパッチが出ているようです。

そのまま、カスタムフィールドを利用した場合は商品にフィールドは追加されませんでした。

商品のpost_typeが「post」なのできつめの設定で行う場合は、投稿にも影響するので注意が必要

カテゴリを商品で指定すれば何とかなるのかな。

インポートする際にもカスタムフィールド列に「カスタムフィールド名=値」で登録できた。

 

リピート項目の場合にはちょっとした注意事項が必要だった。

イメージをつかむためには、一度、リピート項目に値を追加し、商品のデータをダウンロードし、カスタムフィールド列を見てみるのが良い。

 

下記のようにカスタムフィールドを作ってみた。

 

では、どのように商品インポート時にカスタムフィールドを設定すればよいのかというと

 

1.フィールドラベル(繰り返しフィールド)のフィールド名で、何件追加するのか指定する。2行の場合は「itemrepeat=2」となる。

2.サブフィールドのフィールド名を指定する

・サイズの場合

1行目に入れる値:itemrepeat_0_size=1234

2行目に入れる値:itemrepeat_1_size=576

 

まとめると、2件のデータで上記のサイズを入れる場合は

itemrepeat=2;itemrepeat_0_size=1234;itemrepeat_1_size=576

となる。

また、指定されていないフィールドは上書きされないので空欄などにしたい場合は空欄で指定が必要

 

 

WordPressのwelcartの商品インポートについてはこんなところでしょうか…

オンラインショップってどういうものがあるのか再度まとめてみる

オンラインショッピング、ショッピングサイト、ECサイトってやっぱり、一定に割合でお仕事のお話があります。この機に再度、ショッピングサイトについてまとめてみたいと思います。

 

まずは、呼び名を考えてみる

ショッピングサイト

ECサイト

Eコマース

EC

ネットショップ

オンラインショップ

等と呼ばれています。

 

キーワードのトレンドを見ると「オンラインショップ」が多いみたいなのでオンラインショップでとりあえず進めます。

 

 

 

オンラインショップを開設するにあたりどんなものがあるのか?

まずは、1店舗なのか多店舗型なのか

 

1店舗型オンラインショップ

一般的に言うショップかと思います。比較的簡単なツールから独自色を出したい場合等多種多様にあります。お手軽なものからスタートっていうのもありかな。

技術力があれば、EC-CUBEやwooCommerce、Welcart等のオープンソースのツールを利用するのも一つの手です。

オンラインショップのツールではカスタマイズできないところも手が届きます。

 

 

多店舗型オンラインショップ(モール型ECサイト)

結構、仕様が分かれてきますのでどうしたいのかが大事です。また、運営したいというのであれば、初期投資も1000万円以上を。

 

・マーケットプレイス型

マーケットプレイス型は、商品データのみ掲載するタイプのモール型タイプ。商品データ等は、モール側で管理することになる。決済等もモール側で管理するタイプ。

店舗ページのカスタマイズなどはできない感じ。

 

オンラインショップイメージとしては Amazon。

 

・テナント型

普段接することがあるショッピングモールのイメージ。店舗毎の特徴を出すことが可能。

商品の登録から、受注管理、売上集計もすべての業務を独自に行う必要がある。

 

オンラインショップイメージとしては、楽天市場やYahoo!ショッピング

 

 

ショッピングサイトも開設すれば、売り上げが上がるというものでもないのでどうのように集客するのかが大事ですね。