前回の投稿でワードプレスのテキストモードではonclick、oninputなどの機能が通常設定のままでは使えないことがわかった。
内部リンク：ウェブサイトの言語周りについてお勉強を始めよう in Finland!
ウェブサーチで見つけた一つの解決策はショートコードの機能を使う方法。今回の投稿ではショートコードでhtmlを走らせることを目的とする。
wordpressのショートコードの使い方
公式ページは以下のリンク。Developerの方のリンクを貼っとくけど、codexの方にもある。
外部リンク：WordPress API Shortcode
編集する必要があるのはfunction.php。ってやっぱりwordpressで何かしようと思うとfunction.phpをいじる必要が出てくる模様。
function add_text() {
$code = 'this is shortcode test for showing text';
return $code;
}
add_shortcode('addt','add_text');
function.phpに書き加えたのはとりあえずこんな感じ。
んでaddtを[]で囲むとショートコードが使えることになる。
アウトプットは以下のような感じ。
this is shortcode test for showing textよくできました、ちゃんちゃん……っておしまいにしたいところだけど、もう少し続く。
ショートコードならばhtmlのoninputやonclickは動く仕様
さて、本題はこちら。
html直接打ち込むとテーマ設定か何かに蹴られて使えなかったoninputをワードプレスブログで動かしたい。
oninputのコードから作ったショートコードはこちら。
おお、動いたっ！
onclickはどうだろうか？
onclickのコードから作ったショートコードはこちら。
こっちも動いたっ！
ってことで無事ワードプレスのブログ内でユーザーインプットを受けて、ちょっと処理して出力するってことができました。
で、なんでコードを貼らないんだってことなんだけど……整形済みテキストでコードを近くに貼るとなぜかショートコードの方が動かなくなる変なバグがある。
というわけで一応スクショをここに貼っておくけれど、htmlコードをコピーしたかったら（内部リンク：ウェブサイトの言語周りについてお勉強を始めよう in Finland!）を見て欲しい。いやコピーするほどのものじゃないけどさ。
しかし、これ毎回sftpでhtml直編集しないといけないってのがかなり面倒くさいな。ワードプレス内でテーマのphp編集できなくなってるのも解決するべきだろうか……
関連記事
D