ChromeのみiOSは機種やブラウザに関わらずiOS10が必要みたい(要検証)Androidの標準ブラウザは恐らく全滅、Chromeは新しめのものならだいじょうぶっぽい(要検証)PCはモダンブラウザなら大体だいじょうぶ。参考シェアボタンってあんまり使わないよねスマホでシェアボタンをタップすると、ブラウザでSNSが開いて、いちいちログインする必要がありますよね。SNSはアプリしか使わないので、ログイン情報なんて覚えていない......という人はかなり多いのです。PCではURLは問題ないのだけど、タイトルがうまくコピー出来ないサイトが多い(どうしても周辺の余計な文字も選択してしまう)。記事をシェアする場合、シェアボタンでSNSへ飛ぶのではなく“タイトルとURLをコピー”し、使い慣れた方法でSNSに投稿する、というほうが使いやすい人も多いのではないでしょうか。調べてみると、クリップボードを操作するのは仕様上なかなかに面倒だけど、出来ないことはないみたい。一部のブラウザやスマホは非対応なのだけど、この便利さには抗えません。非対応だったり、エラーでコピーできなかった場合は「コピーできませんでした」というフィードバックをきちん返すことにしました。実装はjQueryとclipboard.jsというプラグインを使用します。src="https://cdn.jsdelivr.net/clipboard.js/1.5.13/clipboard.min.js"></script>まずはjQueryとclipboard.jsを読み込みます。?>">この記事のURLとタイトルをコピー</span>data-clipboard-textという属性にコピーしたい文字列を入れます。http://〜〜〜という形式でコピーされます。WordPressの場合は上記のコピペで使用できるよ。?>を相当する関数に書き換えて使用してください。$("#share_btn").addClass('is-copied').text('お使いの端末はこの機能に対応していません');});#share_btnの部分は任意のIDやclassに書き換えてください。.on('success')で成功時の処理を書き、.on('error')で失敗時の処理を書きます。この処理分けをしないと、コピー出来ていなかったときにイラッとしちゃう。ボタンの文字列を変更する他、より明確なフィードバックがほしい場合はアラートを出してもよいと思います。実際に使用してみた試しにこのサイトに実装してみました。PCブラウザやiOS10で動作しています。iOSでは画面がガタガタするという謎の副作用があるけど、コピー機能自体に問題はないみたい。コピーできた時は「コピーしました!」できなかった時は「お使いの端末はこの機能に対応していないようです」というダイアログを出しています。iOS9以前や、Android標準ブラウザは対応していないようなのでエラーダイアログが表示されます。Android版Chromeはだいじょうぶそう。標準ブラウザはたぶん全滅だ。まとめこうした便利な機能は、非対応ブラウザに気を使って実装しないよりは、エラー時のフォローまで含めて実装してしまったほうがメリットが大きいように思う。スクリプトからクリップボードを操作するのはセキュリティ上の問題があるようなので、OSやブラウザ側で仕様変更される可能性もあります。クライアントワークでの実装は、慎重な検討が必要でしょう。さくらは他のサーバとくらべ、SSL対応時に特殊な対応が必要になります。キャンペーンなどで固定ページが増える運用のサイトは、固定ページを作るたびにテンプレートの追加・修正工数が増えてしまうので、なるべくダッシュボード側で完結させたい場合があります。Fieldの値をmeta_queryのkey,valueとして投稿を絞りたかったのだけど、あんまり情報が落ちてなかったので、時間を浪費してしまった。Fieldsで、カスタムフィールドの追加や設定変更が保存できなくなり、ちょっと困ったので備忘録メモ。metrograph.jp。