Wonderful! WordPress

WordPress の DIY　備忘録

画像サイトをオリジナルデザインで作りたいと思っていた時に出会ったWordPress。
そのカスタマイズの自由度の高さにより、やりたいことのほぼ全てが実現可能でした。ただそのためには、PHP、SQL、JavaScript、HTML、CSS の知識が必須ではある。
Do it yourself で思いのままにサイト構築。
その Do It Yourself の備忘録。

New Entry
♠

99. ぼけ防止用 – かなもじ計算脳エクササイズ

テレビで見た、ボケ防止用のひらがなで書かれた計算式で暗算する脳エクササイズ。これがやってみると結構難しかったりする。たしかに脳トレには良さそうなので、ちょっと作ってみることにした。

Update! : 2024/07/30

98. php8 の match とはいかに

php8 で使えるようになった match式。使い勝手は良さそうだけど、はたして if 構文よりも高速なのか？

Update! : 2023/02/11

95. Get Active Blocks List – 稼働ブロック一覧取得

WordPress のBlockEditor で自作ブロックをあれやこれやと作っていると、実際にいったいどれが必要なものかわからなくなってしまう。なので、サイトで稼働しているblockが簡単にわかればありがたい

2022/10/16 18:55

90. Ubuntu と MySQL と php と WordPress と phpMyAdmin

Ubuntu を22.04にアップデート。WordPress をインストールしようかと MySQL をいじろうとしたらログインできない。そこからはじまったphpやらphpMyAdminやらWPでのじたばたの備忘録

2022/08/24 16:40

89. Block Editor Innerblock & css grid layout on edit-page

WordPress で innerblock を使った自作ラッパーブロックにおいての css grid layout。編集ページにおいては、余分なinnerblock の存在で grid になってくれない。その対策など。

2022/08/13 19:07

88. WordPress6とphp8.1とDebug modeとDeprecatedと

WordPress6.0 は php8.1 に完全に対応しているわけではなく、いくつものDeprecated が排出される。その中に混じっていたmbstring。これはWPとは無関係。phpのerror_reportingのことなど。

2022/07/29 18:43

87. いまさらの php で連続するスペースを一つに

php で連続するスペースを一つにまとめる常套手段は正規表現を使う preg_replace。でも、他にもっと速い処理の方法はないのだろうかと？strtr、str_replace、explode、string index access など

2022/07/20 21:06

86. XML-Sitemap を自作

検索エンジンクローラー用の XML-Sitemap の自作。管理画面にそれ用のページを追加して、各項目の priority の設定などをオプションとして保存させたりなど。

2022/06/17 12:53

84. TypeScript と HTMLElement と style と

TypeScript における HTMLElement の型指定とスタイルを設定する時に Element.style[ property-name ] のブラケット記法の書き方がエラーになることの対策など。

2022/05/21 14:17

82. Gutenberg Block Editor 自作その３ – form編

Gutenberg Block Editor の自作カスタムブロックのform編。innerblock の form から input やら textarea やら select、ついでに span label などの non-JSX のブロック。

Update! : 2024/01/10

81. Gutenberg Block Editor 自作その２ – id指定

block に htmlアンカーというか id属性を指定できるようになった。それなら自作block でもということで。あと、インラインスタイルを設定でき、section、article、divのタグを選択できる non-JSX なグループボックスと。

Update! : 2022/07/30

80. wp_nav_menu のフィルターフック と

wp_nav_menu に付いてくる鬱陶しいほどの使いそうもない class をフィルターフックで好きなようにすっきりと。他のフックやらキャッシュ化なども。

2022/02/22 23:00

78. JavaScript の object の copy で忘れないように

JavaScript の 配列などのオブジェクト（複合型）のコピーが参照渡しだというのは忘れることはないけれど、コピーにおける浅いとか深いとかの事の確認。JSON.parse( JSON.stringify())、Object.assign、Array.from など。

2021/12/21 00:04

77. そろそろ webp でいいかな

少しでもページの表示速度をよくしたい。そろそろ画像のサイズを小さくできる webp を使いだしてもいいのでは。といっても BASE64 化のためということもある。で、php の webp converter。

Update! : 2023/03/24

76. Content-Security-Policy と X-Frame-Options と

個人のブログやギャラリーなんかのサイトにはあまり必要のないことだろうけれど、Content-Security-Policy & X-Frame-Options のちょっとセキュリティなことを。ob_start、script_loader_tag など

Update! : 2023/02/15

74. 管理画面にページを追加 #2

プラグインを一つでも減らすために自作できるものは作る。今回は revision を delete する機能。そしてそのページを管理画面の設定メニューに追加すると。使うのは、add_options_page、check_ajax_referer, wp_delete_post_revision といったところ

2021/08/20 18:46

73. 管理画面にページを追加

管理画面のメニューのどこかに項目を追加して新たにページを表示させる。テーマとかプラグインでは既にやっていることで、基本的には同じこと。今回使うのは、add_posts_page。あとは、admin_menu、admin_print_styles、get_current_screen() など。

Update! : 2023/03/16

72. php の error_get_last と debug_backtrace

php でエラーが出た場合にそれを知る簡単な方法として、error_get_last を使ってる。で、どこで発生したエラーなのかわからない時に便利なのが、debug_backtrace。

2021/08/12 18:46

70. Lighthouse との闘い – Chrome DevTools

Google PAGESPEED INSIGHTS のブラウザ版というか、Chrome DevTools Lighthouse でフルマークをとりたいがためにじたばたした事など

2021/07/22 13:34

69. いまさらの Javascript style.cssText

いまさらだけどJavaScript の .style.cssText のちょー基本的な部分の再確認。"+=" の疑問点とか、どのやり方が一番良い方法なのかとか、そのあたり。

2021/05/14 00:28

68. Google PAGESPEED INSIGHTS との闘い – それから

Google PAGESPEED INSIGHTS の数値を上げるため（CLS に関する問題）にした対策の続編。Javascript file のノンブロッキングなロードやページのキャッシュ化などなど。

2021/03/27 08:43

67. var_dump の代替 foreach 再起関数

php の var_dump がどうも分かりづらくてなじめない。もっと直感的にわかりやすいものを作ろうかと。同じことを何度も再起呼び出しさせるだけのことなんだろうけれど。

2021/03/16 21:02

65. Google PAGESPEED INSIGHTS との闘い

Google PAGESPEED INSIGHTS の数値を上げるため（CLS に関する問題）にした対策。画像のBASE64化、jquery からプレーンな javascript への変換、スタイルシートのダイエットなどなど。

Update! : 2021/02/20

63. 余談です

まったくの余談ですが、自分が長年使い続けてきたトラックボールのはなしなんぞを。

2020/12/08 21:26

62. いまさらの php の global と $GLOBALS と

phpにおいて関数のブロック内でグローバル変数にアクセスするためのglobalキーワードと連想配列の$GLOBALS。基本的で常識的な事ながら、ちょっと思い違いしてたことなど。

2020/12/04 11:53

61. Gutenberg Block Editor だとさ

いずれ主流となる Gutenberg Block Editor。とりあえずよく知るために カスタムブロック などを ES5 でいくつか作ってみました。React と server side render と InspectorControlsと。

Update! : 2021/09/07

60. プラグイン Simplistic Prism Highlighter Loader

少し手を入れて使い始めたJavascript で作られた Syntax Highlighter prism.js 。せっかくだから、簡単にロードさせるためのシンプルなプラグインにでもしてみようかなと・・・。Gutenberg block editor 対応の wp.blockEditor.PlainText、 InspectorControls を使用した custom code block なんてのも

Update! : 2023/01/07

59. 管理画面、投稿一覧の既存のカラムに表示項目を追加

WordPress管理画面、投稿一覧に新たにカラムを追加するのはフィルターフック manage_posts_columns でできますが、今回はフィルターフック post_date_column_time を使って既存のカラム、日付の欄に更新日の項目も一緒に表示します。

2020/05/24 11:44

58. いまさらのさらば Crayon Syntax Highlighter

phpのバージョンアップのたびに不具合が出るようになってしまったCrayon Syntax Highlighter。なんとか使えてはいるけれど、そろそろ代替を考えましょうか。そして使ってみたhighlight.js。そしてprism.jsはちょっとカスタマイズして。

2020/05/23 15:51

57. Ubuntuで起動ごとのPython壁紙チェンジャー

Ubuntu18.04 GNOMEにおいて、起動するごとに壁紙を変更させるためのコードを Python でって・・・？まっ、ほんとにどおってことないことです。しかも WordPress とはまったく関係がないし。まっ！いっか。

Update! : 2021/10/28

56. たわいもないこと

いつからなのかJavascript の関数の引数にデフォルト値を設定できるようになってた。でも、それをやるとie でエラーになってしまう。で、ちょっと気になった現在においてのブラウザのシェア、とか。

2020/04/07 18:31

55. Javascript のエラーを知りたい！

思わぬところで発生するのがプログラムエラー。そういうerror を逐一、知ることができればちゃんと対処することもできる。Javascript はどうすればそれを知ることができるのだろう？で、とりあえず window.onerror

2020/03/31 13:54

53. 予期せぬ出来事

wordpress5.3とモジュール版php7.3とwordpress debugモードでの予期せぬ出来事エトセトラ & フィルターフック request

Update! : 2020/12/08

51. 画像の自動並び替え機能

複数の画像をまとめてアップロードしたときに、そのファイル名による順番が乱れてしまう。いちいちドラッグして並び替えているのにも面倒になったので、自動的に並び替える機能を付加しました。

Update! : 2021/05/17

50. いつのまにか get_category_link が機能していない

wordpress が4.9になってから、カスタム投稿用のカスタム分類のページへのリンクを出力するのに使用していたget_category_link()が機能しなくなっているのに気が付きました。

2017/12/19 00:06

49. いまさらのz-indexでの重なりと疑似要素と

いまさらではあるものの、あたりまえのようにわかっているつもりのz-indexによる要素の重なりを、疑似要素:before、:afterも含めて再チェック。わかっていたつもりなんだけれど・・・？

Update! : 2021/05/14

48. カスタムフィールドの値で絞込み

複数の条件で絞り込んだ投稿を得るのに、WP-Queryでカスタムフィールドの値を使ってやれば良いということで。そして、その場合のページネーションの有効化などを。

Update! : 2018/07/10

47. プラグイン Holiday Class Post Calendar

日曜、土曜、祭日及び独自の休日などのスタイル設定するためのclassを付加することができる自作投稿カレンダーのプラグインです。独自の休日のスタイルを設定できるclassが4種類あり、日本語と英語表記、週の始めを日曜から始めるか月曜にするかそれぞれ選択可能です。Gutenberg Block Editor 用の custom block も内蔵。

Update! : 2023/01/17

46. phpのarray_searchとarray_count_valuesではまった事

phpのarray_searchは引数のstrictにtrueを指定しなければ==での比較であり、array_count_valuesの戻り値で数字による文字列がキーになるときの型変換でつまづいたこと。でも、実のところはphp における配列の基本的な部分でのことだったのです。

2016/09/14 20:10

45. WordPress のFilesystemとかAjaxとか

WordPressのテーマやプラグインでファイル操作をするときには、用意されているFilesystem APIのお世話にならないといけないらしいのです。いろいろとやってみたときに一緒にお世話になったAjax のことなどもあれこれ。

2016/08/24 10:32

44. 画像をアップした時に自動生成されるサムネイルたち

画像をアップロードすると自動で生成されるサムネイルたち。設定では小と中サイズだけの設定にしてあったはずなのに・・・。ふと、気が付くと768というサイズがたくさん並んでた。こっ、これはいったい・・・、となったのでありますが・・・。

2016/07/22 17:56

43. お遊びなプラグイン おじゃまなサンコウチョウ

WordPressのデスクトップマスコットプラグイン。鳥好きの私が特に好きなサンコウチョウ。そのちょっとデフォルメされたサンコウチョウが出て来て作業の邪魔をするだけの何の役にも立たないプラグイン。せっかく作ったので、一応、お披露目をと。

2016/05/13 17:18

42. 二か国語表示とnext_post_link

ブラウザの言語設定が日本ではない時には、画像サイトのページを全て英語表記にしています。その場合のシングルページにおいてのnext_post_link（previous_post_link）におけるフックを使ったカスタマイズなどなど。

2016/05/02 21:41

41. コメントの編集機能、nonceで作り直してプラグイン

コメントをしようと思ったときに、編集や削除が出来た方が誤字や変な改行がついてしまうときもあるし、自分で修正できたほうがありがたいはず。WordPress の nonce を使用してプラグインにしてみました。

2015/12/16 11:16

40. 投稿の自動保存(Autosave)の判別について

たとえばアクションフックのsave_post などを使う時に、自動保存（autosave によるrevision）を判別したい時があって、その時にいろいろやってみたこと。”if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )”　とか”wp_is_post_autosave()” とか。

2015/11/20 15:08

38. 全てのアップ画像によるスライドショーのjQuery

以前にjavascript で作った全てのアップロード画像によるスライドショーをjQuery にて作り直し。いわゆるAjaxによるjQuery のget メソッドでのファイルの読み込みはxml もテキストファイルも簡単で便利。アクションフックのsave_postを使用。

Update! : 2016/10/06

37. リンク先を変更したり逆順にするJavascript

タグクラウドのリンク先を必要な時に切り替えて二つ設定出来れば便利だと。そしてリストを逆順に表示するためのjavascript。getElementsByTagNameを使用して子要素のa タグを取得しています。

Update! : 2018/04/22

33. WordPress Javascript コーディング基準

wordpressにおけるjavascriptのコーディング規約。wordpressのページにあるものとその基本となるjavascritp、およびjqueryによるものをまとめて抜粋しました。

2015/07/06 11:22

32. wordpress管理画面にテーマのオプション設定ページを表示

テーマを作る時にそのテーマ独自のオプションを設定して使いたいときがあります。そのオプションが管理画面で変更、設定することができれば便利です。管理画面にメニューを追加してオプション設定ページを表示させます。また、アンインストールというか使わなくなった時はswitch_themeフックにてオプションを消去します。

Update! : 2023/02/27

30. カスタムフィールドの投稿一覧への表示

カスタムフィールドの入力フォームをプラグインを使用することなく投稿入力フォームに表示することはできました。そして次なるは投稿一覧にカスタムフィールドをリスト表示させます。通常投稿postとカスタム投稿でそれぞれ表示をかえて。

2014/11/07 09:47

29. カスタムフィールドの投稿入力フォームへの表示

秀逸なプラグイン、カスタムフィールドテンプレートを使えば、入力フォームを投稿入力フォームや投稿一覧に表示してくれるのでとてもありがたい。でもプラグインを使わなければ出来ないものだろうかと。

2014/11/05 00:47

28. ページネーション（ページャー）自作

ページネーション（ページャー）にはあまりにも有名なwp-pagenaviを使っていましたが、これもプラグインに頼っていなくても簡単にできるものだし、自分で書いてしまったほうがシンプルに出来て少しでも軽くなるかもと。

Update! : 2023/01/19

27. 知らなくて損してたcssの更新をブラウザに確実に反映させる方法

cssでサイトのデザインやjavascriptにより機能の更新をしたときなどに、すぐにブラウザに反映されないということはよくあること。ブラウザのキャッシュが原因なんですが、変更があったときはそのキャッシュを使わせないですぐに反映させるこんな方法があったとは。wp enqueue style と wp enqueue script についても。

Update! : 2015/03/02

26. wordpressのカレンダーを自作

日曜や土曜、祭日に色を付けたりローマ字表示にしたりするのにwordpressが生成したものを置換して実現してましたが、そんな二度手間なことをしていなくても、いっそのことカレンダーを表示する関数を自作してしまおうと。さらにプラグインにもしてみました。

Update! : 2023/01/15

25. Guest book

新たに固定ページをひとつ作ってコメントのテンプレートを配置すれば、ゲストブックというか掲示板のようなものもwordpressではすぐに作ることが出来ます。あとはcssでデザインを整えたりするだけなのですが、考えないといけないのは通常の投稿ページとのコメントフォームの違いや承認をいかにするかということ。コメントのstatusを操作するフィルターフックの pre_comment_approvedを使用します。

2013/11/25 15:08

24. 知らなくて損してた$post->IDとかcssの::afterとか

ほんのちょっとしたことを知らないだけで随分損してたというのはよくあることで、どこで思い込んだのかループ内でしか使えないと思っていたwordpressの$post->IDとかcssのpseudo-elements（疑似要素）の:beforeと:afterとかについて。

2013/10/03 14:56

23. 画像クリック時のjquery

通常はミドルサイズになっている画像をクリックしたときに拡大表示させるjquery。軽くフェイドインして表示され、閉じるときもブラウザの戻るボタンやタブを閉じたり×ボタンを押したりしなくても拡大された画像をクリックするかスクロールさせるだけでフェイドアウトして閉じられれる、手間がかからないシンプルなもの。

Update! : 2013/09/19

22. position:fixedの基点

position:fixedにおいての絶対配置における基点に関して。

Update! : 2017/08/21

20. 続、画像の枚数によるタグクラウドの自作

投稿の件数ではなく、画像の枚数を基準として自作したタグクラウド。なんとか少しでも軽い動作となるようにと試行錯誤し改良しています。アクションフックpublic_postを使っています。

Update! : 2013/06/09

19. phpのチューニングによるサイト表示速度の改善

いろいろな機能や表示項目を加えていくと、どうしても重くなってしまいがちなサイトの表示。基本的な事から見つめ直し、小さなことからphpのチューニングにより表示速度の改善を試みました。

2013/04/02 22:50

18. スパムコメント対策

外国からのスパムコメント対策に簡単にできるものはないかと試しに施してみた、送信時にチェックボックスをチェックしなければコメントを受け付けないカスタマイズ。コメントフォームに関するアクションフック、comment_form_after_fieldsとpre_comment_on_postを使用します。

Update! : 2012/12/09

17. 投稿一覧ページ

投稿日、投稿タイトル、投稿に属する画像の枚数などの情報が一目でわかる投稿一覧ページがあった方が便利です。一覧ということでたくさんの投稿や関係する情報を読み込むことで重くなってしまう処理を、SQLを使って取得するデータを限定することで、処理が早くなるかということを試してみました。

2012/11/27 10:31

16. sessionについての些細なこと

セッションを使った時に作成されるセッションデータ用の一時ファイルを消去することに関しての些細なことです。

2012/11/22 22:02

15. 続、コメントの編集機能session版

一般に公開しているサイトでは、コメントの編集、削除においてもフォームからのユーザーの入力を受け付けるわけだから、基本的にセキュリティの事も考慮しないといけないのですね。session機能を使って造り直してみました。

2012/11/07 09:29

14. htmlエディタのクイックタグの追加

htmlエディタにおけるクイックタグは便利なようで今まであまり使ってはいませんでした。が、自分が良く使うタグや文字列を登録できるならこれは使い勝手が良くなるというものです。そのquicktags の追加方法など。

Update! : 2022/05/25

13. [caption]ショートコードとpタグの問題

［caption］ショートコードにより生成されるdivタグとpタグがthe_content関数により生成されるpタグに内包されてしまう問題を解決するためにいろいろ試してみた事です、img_caption_shortcodeであっさり解決！それとは別にcaptionに入力した文字数により、少ない場合はalign:center、複数行に渡る場合はalign:leftで表示させるために考えたこと。

Update! : 2015/03/16

12. 続々、画像クリック時のjavascript

画像をクリックして拡大表示させたまま、別の画像を連続して見れるようにすれば使い勝手が良くなります。そのためのjavascriptを追加します。

2012/08/11 13:14

10. taxonomyで絞り込んだ画像一覧ページ-改

画像一覧ページもカテゴリーや投稿タグで絞り込んで表示することもできれば画像を探すときなどに便利そうです。Ajax　など。全て新しく書き直してます。

Update! : 2016/08/21

9. スライドショー

アップ画像のスライドショーに関してもプラグインが数多くありそうなのですが、モニター表示領域に可能な限り大きく、そしてアップしてあるすべての画像を対象にするとなると、どれで可能なのかはなかなか探しても見つかりませんでした。自作すればよいのですが。XMLHttpRequestなど。

Update! : 2015/11/14

8. get_children()で投稿にアップロードした画像を全て表示

投稿にアップロードしたが記事に挿入していない画像を、単一記事テンプレート（single.php)等で、get_children()を使って全て表示させます。そして wp_postmeta テーブルにある _wp_attachment_metadata の情報を使った方法も。

Update! : 2021/07/15

6. 画像一覧ページ

画像サイトに画像一覧ページはつきものです。無いと困るというものでもありませんが、やはり一覧表示できれば便利ですからこだわりたいところです。そしてそれに必要な画像のメタデータとget_post_meta() とwp_get_attachment_image_src() と。

Update! : 2020/03/16

5. 画像をクリックした時のログ

画像をクリックし拡大表示にて見てくれる人はいるのだろうか、はたまたどの画像をクリックしてくれたのだろうかと画像サイトにおいては興味のつきないところです。画像をクリックしたときのログは残せないものだろうか。

Update! : 2012/11/28

4. wordpressのカレンダーを英語化

wordpressをインストールしたままだと、カレンダーの表記は当然のごとく日本語。これを英語表示に変える方法はいろいろあるようですが言語ファイルを編集しました。

Update! : 2012/12/31

3. wordpressのカレンダー

とても味気ないwordpressのカレンダー。日曜も土曜も祝日もなにもつかない。id=todayだけ。でも、それぞれのｔｄにclassをつけるのはそんなにむずかしいことではないかも、制限つきだが。

Update! : 2013/01/12

2. カスタム分類による画像個別の分類

鳥見報告サイトにおいて、鳥見に行った場所をカテゴリー、鳥種を投稿タグで分類していますが、当然、行った先で複数の鳥を見る事になり、この場合、一つの投稿に複数の投稿タグが混在してしまうわけで、ある鳥の画像だけ投稿タグで分類しようとしてもその投稿に属している投稿タグの別の鳥も入って来てしまいます。画像を個別に分類できれば良いのですが。

Update! : 2016/04/21

1. SyntaxHighlighterがつかえない！

このwordpress DIY 備忘録をつけはじめて、記事中にhtmlやらjavascriptやらphpのコードを表示することが必要になった。 有名な定番のプラグインSyntaxHighlighterを使ってみたがなぜかちゃんと表示されない。それと、ショートコードの自作。

2012/05/10 12:34

Sanbanse Funabashi

Top

スクロールさせるか画像をクリックすると元に戻ります。