復習がてら公式のスターター(gatsby-starter-minimal、gatsby-starter-wordpress-blog)をTypeScript化したメモ。
wordpress
GatsbyでWebサイトを4つ作ってみたメモ
3月からGatsbyでWebサイトを4つ作った。
ずっとVue(Nuxt)とちちくりあっていたのでReactを触るのは3〜4年ぶりだった。
[WordPress] カテゴリー一覧で表示されている記事に登録されたカスタムフィールドの値を配列で得る
例えばこれは Product というカテゴリーがあったとして、登録されている記事に Price というカスタムフィールドがあり、
カテゴリーアーカイブで Price の値を一覧にしたい…という場合に使えるかもしれないやつです。
[php] GeSHi v1.0.8.4 Compilation failed error on line 2132
GeSHiの最新バージョン1.0.8.4でWarningレベルのエラーが出まくる件についての対処法。
[jQuery]リンクに新しいウィンドウを開くアイコンを自動で追加する
殴り書きは続く…AutoExternalLinkのjQuery版。mootools版の同タイトル記事とほぼ同じです。
jQueryは馴染みが浅いのでもっさり感漂う残念なソースになってます。
自分がサイト組む時は外部リンクに大抵relかclass属性を付与するんで、relかclass持ちにだけ追加するライト版も書いてみた。
ダウンロードはスクリプトファイル2種と、jQuery版に修正したAutoExternalLinkプラグインファイルのセット。
元ソースからの入れ替えとかは自己責任でお願いします。
wordpressプラグイン本体の改造はこちらの記事で解説していますが、
zipに修正済みのプラグインファイルも突っ込んどいたので上書きでおk。動作デモはこのブログそのものです。
jQueryプラグインなので普通のサイトでも使えると思います。
varは1.2.6以上対応です多分。(1.2.6と1.3.2でしか確認してない)
Header
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery.jExternalLink.plugin.js"></script> <script type="text/javascript"> //<![CDATA[ $(document).ready(function(){ $("#main").jExternalLink(); }); //]]> </script>
上記指定で#main以下にあるaタグを全てチェックします。
wordpress2.1.3から2.6.3にバージョンアップしてみたメモ
このブログの時のように5分では終わらなかったので、適当に作業メモを残すことにした。
2.1.3はMEの一番普及してるバージョン(だと思っている)だから使ってる人も多いのでは無かろうか。
私の場合はゲーム用ブログがそれで、幸いコアには手を入れてないものの、自作テーマとプラグインで結構弄ってある。
思い立ったが吉日。詳しいwordpressのアップグレード方法はCODEXに任せるとして、
とりあえずデータベースをエクスポートした。これは忘れちゃいけない。
プラグインとか使ってる場合はwordpressのとプラグインのテーブルを別にエクスポートする方がいい。
また、サイズが大きくなるとインポートで弾かれる可能性が高まるので、wordpressのテーブルそのものも分割エクスポートしといた方が何かと安全だったりもする。サイズの大きいテーブルは単体エクスポートがオススメ。
エクスポートの前にはテーブルの最適化をやっておく。
面倒臭がって無駄に大きなsqlファイルを作ったりすると、インポートで失敗して涙目になるので
上記のことは気をつけた方がいいな、と今書きながら思った。バックアップで手抜きするのは良くない。
[WP]カスタムフィールドの値で記事を並び替える
質問された、カスタムフィールドで設定した値で記事を並び替えて表示するサンプルを晒してみる。
オススメ度とかでランキングっぽいことしたい時に使えるのか・・・な?
やってることはarray_multisortによる多次元配列のソートです。
サンプル関数の使い方は次の通りです。
- 記事にソート用のカスタムフィールドを作成
- 10進数の半角数字で値を入力
- テンプレートの表示したいところにサンプルのコードを入れる
以上。
サンプルソースは用途に応じて適当に変更するといいと思います。
参考ページ
追加
- 他のカスタムフィールドも表示したい場合
- ページナビゲーションによる分割表示
WordPress2.6 Tyner is now available
キタ━━━(゚∀゚)━( ゚∀)━( ゚)━( )━(゚ )━(∀゚ )━(゚∀゚)━━━!!!! Wordpress2.6英語版出ました。 wikiっぽいリビジョン管理 テーマプレビューついた 投稿ページへのブッ … 続きを読む
[WP]Category, Tag and Taxonomy Functions
公式にあるFunction Referenceの自分用適当メモその2。
Category, Tag and Taxonomy Functionsの関数リストを上から順に書き散らした。
分からないのは華麗にスルー。
またまた長いけどこのまま行くことにした。途中で力尽きた
[WP] Post, Page, and Attachment Functions
公式にあるFunction Referenceの自分用適当メモその1。
Post, Page, and Attachment Functionsの関数リストを上から順に書き散らした。
分からないのは華麗にスルー。
とんでもなく長くなった。分けた方がいいかな…
[WP]wordpress付属のJavascriptを使用する
wordpressにはwp-includeのjsディレクトリにprototypeやjQuery等のライブラリーが色々入っている。
テーマやプラグインでこれらを使用出来るようheadにscriptタグを挿入するにはwp_enqueue_script()を使用します。
独自に作成したjsファイルや、プラグインやテーマに同封したjsファイルにも使えるので便利。
[WP]wordpressでRSSを取得して表示
wordpressにはRSSを取得して配列に整形する機能が備わってるらしい。…というのを最近TwitterAPI調べてた時知ったのでそれについてのメモ。
バージョンいくつからか詳しく確認してないんだけど、手元にあるので一番古いvar2.1.3には入ってた。
よく考えたらダッシュボードのRSSもコレだよな…ので、新しい情報ではありません。
外部サイトのRSSを取得するには次のように書く
include_once(ABSPATH . WPINC . '/rss.php'); $rss = fetch_rss($uri);
で、これだけ書いたら詳しい人にはティン!と来るかも。
[WP]カテゴリーのアイコンを表示するプラグイン「Category Icons」
各カテゴリーに任意のアイコンを設定・表示するWordpress用プラグイン「Catgory Icons」の紹介と日本語化ファイルの配布。
このプラグインは、カテゴリーそれぞれに独自のアイコンを設定することが出来て、
サイドバーのカテゴリーリストや記事のタイトルに設定したアイコンを表示してくれます。
インストール
WordPress2.3~2.6.1対応
最新バージョン2.0.7
※ver2.0.5の翻訳ファイルそのまま使用してても問題はありません。
ダウンロード後展開、wp-content/plugins/にアップロードしたら、有効化する。
日本語化ファイルは、解凍したmoファイルをlanguagesフォルダに入れます。
moファイルのアップロード形式はバイナリで。
2.0.5からプラグインに同胞されたようです。ワーイ
ダウンロード
- var2.0.7»
“category_icons-ja(2.0.7)” をダウンロード
category_icons-ja_v207.zip – 3890 回のダウンロード – 7.73 KB - var2.0.5»
“category_icons-ja(2.0.5)” をダウンロード
category_icons-ja_v205.zip – 2841 回のダウンロード – 7.74 KB - var2.0.2»
“category_icons-ja(2.0.2)” をダウンロード
category_icons-ja_v202.zip – 2974 回のダウンロード – 7.68 KB - var1.9.9»
“category_icons-ja” をダウンロード
category_icons-ja.zip – 3052 回のダウンロード – 7.25 KB
若干エラーの日本語が怪しいかもしれない。
2.0.7の変更点は大体次の通りです。
- My Category Orderに対応。
- アイコンリストにソート機能が付いた(テーブルのヘッダクリックで動作)
- ウィジェットが本体に内包された(category-icons_widget.phpが無くなり、本体有効化だけでウィジェットが使用可能に)
- 不要なフィールドの削除とMySQLに関する修正
- イタリア語・トルコ語翻訳ファイルの追加
2.0.2→2.0.5はSEO Friendly Imagesに関する差分です。
[WP]SEO対策系プラグイン比較まとめ
WordPress用のSEO対策・ヘッダ操作系プラグインを比較したまとめ。
タイトルやメタタグを操作するもの中心。サイトマップは除外。
メタタグ操作はテーマでやれなくもないけど、プラグイン使う方が楽です。
選択条件
- 公式サイトでのダウンロード数の高い順
- WordPress2.5に対応している
- 日本語で使える(翻訳の有無は問わない)
[WP]テンプレートファイルの仕様と構成
テンプレートファイルの役割やら構成なんかについてのまとめ。そこそこ初心者向け。
WordPressテーマ概要
WordPressのデザインはテーマと呼ばれてます。テーマを構成するファイル群がテンプレートファイルです。
他のブログのようにテーマをテンプレートと呼んでも通じるけど、検索するときはテーマ(Theme)を使う方が良いかも。
ダウンロードしたばかりだと”Classic” と “Default”の2つがプリインストールされてますが、
テーマ新しく追加する場合は、ダウンロードして解凍したテーマのフォルダをWordpressのwp-content/themes/にアップロードするだけ。
デザイン(表示)に並ぶテーマのスクリーンショットをクリックすれば即座に変更されます。
テーマ変更で再構築が必要ない、というのがWordpressの良いところ。
WordPressは1.x系、2.0.x系、2.1.x系、2.2以降と2.5以上では内部仕様が違ってるので、テーマやプラグインはバージョンにあったものを選ばないとエラーが出たりするので注意。
特に2.7は最新とあって対応してるテーマやプラグインもまだ少ないようです。
公式のリスト»
WordPress 2.7 Theme Compatibility List
WordPress 2.7 Plugin Compatibility List
ver2.5→ver2.7に修正
WordPressはコアファイル・プラグイン等全てPHPなので、PHPとmySQLに通じていればかなり色々なことができます。
テーマを構成するテンプレートファイルは、XHTMLとPHPのテンプレートタグで作成されてます。
XHTMLとUTF-8で記述するのがベターですが、HTMLでも文字コードさえ合ってれば問題はないです。
文字コードはWordpress2.5ではUTF-8のみになりました。
テキストエディタはBOM無しのUTF-8で保存できるものを選ぶ必要があります。(メモ帳はダメ!絶対)
テンプレートに記述するWordpress独自のPHPコードはテンプレートタグの他、ループやファンクションなどかなり色々使えます。
PHPの関数や変数なんかも使えます。
[WP]WordPress オプションページの作成
どうしても作りたいプラグインが出来たので試しに作ってみてるが、その際避けて通れないオプション設定ページ。
テーマの独自設定を作りたい時にも使える。
Creating Options Pagesから適当に抜粋。
ページそのものの追加は前のエントリーで紹介してるので省略。
最後の方に設定保存のメカニズムについても適当に解説をつけてみた。
[WP]投稿ページにオプションエリアを追加する
タグとかカテゴリーみたいなクリックで開閉するオプションエリアを追加する方法について。
ページと同じくこれもテーマのfunction.phpで可能です。プラグインで作っても良い。