WordPress Contact Form7 + ajaxzip3 で郵便番号住所検索

今日は、みみです。

自作する時間が無かったので、みんな大好き Contact Form7 を使わせてもらって、ちょっと項目多めなフォームを作ってみたのですが、郵便番号検索の導入方法をメモ。

ajaxzip3 https://github.com/ajaxzip3/ajaxzip3.github.io

を使ってみました。Contact Form 7の設定で、郵便番号入力と出力先にIDを付与すればOK。(出力先へのID付与は要らないかも?)

凄い簡単に導入できるようになったなあ…。

ついプレーンJavaScriptで書いちゃったけれど、そもそも jQuery 使われているのであった…。

簡易スタイルガイド(パターンライブラリ)を作ろう

こんにちは、みみです。

今日は先日の WordBench 三鷹の LT でお話した簡易スタイルガイド(パターンライブラリ)の作り方というか、テンプレをご紹介します。

スタイルガイドって今、色々ツールがでてるんですけれど、よっぽど大規模な案件で無い限り(あとそういう大規模な案件をあんまり WordPress だけで作らない方が良いし)そんなの導入しなくても WordPress で固定ページか投稿ページを非公開で作って開発しながらメモっていくのがローコストでハイリターンなやり方だと思います(※ 個人の感想です)。

CSSに大体慣れてきた人向けのアドバイスとしてご紹介したのですが、スライドだけだと現物が無いのでアレだなーと思って(LTでは実例をお見せしました)。

でも、パッとお見せ出来るものも無いんですよ、基本納品物だし非公開だから。なのでこのサイトで適当に作りました。色も嘘っぱちですしボタンとか無いしSVGも使ってないし、カスタムしているところがほぼないので、例としていまいちなのですけれど。

こんな感じのものです。

という凄い単純なものですが、すぐ導入できて、開発時の簡易テストにもなるし、クライアントさんに納品する時に簡易ドキュメントになるし、HTML分かる人だったら自分で活用して貰えるし、何より数カ月後とか数年後(!)とかに再開発になった時に楽ちんです。

これは別に玄人さん向けだけの話じゃなくて、個人ブログでコツコツとカスタムスタイルを積み上げて行っている方とか、テーマをちょこっとだけ弄ってる人にも便利だと思うのです。

何故なら、

人はコードを忘れるから。

… イイコトっぽく書いてみたけど、情けない事実であります。

でも良いの。外部記憶装置に任せるのが一番だよ!

“簡易スタイルガイド(パターンライブラリ)を作ろう” の続きを読む

人生初のLTハシゴ – WordBench 東京編

ゆるりとした三鷹編から電車移動で東京編@渋谷 GMO へ。(GMO の名前から連想して、電車の中で前の会社での大顧客だった某企業名を思い出せなくて唸ってたのは内緒。)

WordBench東京 6月勉強会 LT 大会 @ 渋谷 GMO Yours – WordBench東京 | Doorkeeper

に参加してきました。

ドーンと大きなビル。入館パス。警備員さん。まじか。同じWordBenchの会場とは思えないぜ…。

“人生初のLTハシゴ – WordBench 東京編” の続きを読む

2回目のWordBench三鷹にて – 人生初のLTハシゴ

2回目のWordBench三鷹で、LTをしてきました。

今回はほぼスタートから参加出来たので、主催の岡部さんの軽妙なトークを楽しめました。自分がLTやったから余計に、岡部さんのトーク術凄いなと改めて思いました。あのゆるりとした感じ、WordPressの敷居をさらにぐっと下げてくれる感じ、素晴らしいなあ。

“2回目のWordBench三鷹にて – 人生初のLTハシゴ” の続きを読む

Gutenberg にカスタムブロックを追加してみよう

こんにちは、mimiです。

Gutenberg 3.0 がリリースされて、本年中のWordPress 5.0 リリースが現実味を帯びてきましたね。そろそろ、カスタムブロックの作り方ぐらい予習しておいても良さそうな感じなのでやってみました。

といってもやり方は
Creating Block Types – The new Gutenberg editing experience – WordPress
に全部載っているんですけども。

前提として Gutenberg プラグイン自体もインストールされている必要があります。

1. gutenberg-examples をダウンロード

https://github.com/WordPress/gutenberg-examples をダウンロードします。

これが WordPress のプラグインとして扱われます。ダウンロードしたものをプラグインディレクトリに入れてください。

2. 有効化の前にコメントアウト

現状、2018/06/14の時点では、そのまま有効化するとエラーが出るので、gutenberg-examples-master/index.php 内をいくつかコメントアウトします。

include '01-basic/index.php';
//include '01-basic-esnext/index.php';
include '02-stylesheets/index.php';
include '03-editable/index.php';
//include '03-editable-esnext/index.php';
include '04-controls/index.php';
//include '04-controls-esnext/index.php';
include '05-recipe-card/index.php';
//include '05-recipe-card-esnext/index.php';

ESnext で書いた場合のサンプルも入っているのですが、npm install して build しないと動かないようになっています。

ESnext の記述に慣れておいた方が良いので、書き方はそちらで覚えた方が良いと思いますが、ここでは取り敢えずカスタムブロックを表示することを目標にします。

3. サンプルがレイアウト要素として表示されます

有効化して、記事作成すると、「ブロックの追加」から追加したサンプルがレイアウト要素として表示されます。Example: Basic、Example: Stylesheets、Example: Recipe Cardの3つです。

日本語化してない時に撮ったスクショですみません。

ちょっとしたカスタムブロックなら、このサンプルを弄るだけで作れると思います。
お試しあれ。

WordPress 4.9.6がリリースされました。

WordPressの4.9.6がリリースされました。
ちょっと、いつものマイナーアップデートとは違うようです。

プライバシーポリシーのページを作成しましょう

このプライバシーおよびメンテナンスリリースには、37の拡張機能、51のバグ修正、2つのタスクが含まれています。(中略)欧州連合の一般データ保護規制(GDPR)に関連する変更には、コメント、プライバシーポリシーページ、およびデータ処理が含まれます。

https://codex.wordpress.org/Version_4.9.6


ということで、話題のGDPRに対応したので、プライバシーポリシーページの作成を促すようになっています。

このブログにも(当然のように!)無かったので、試しに作成してみました。

“WordPress 4.9.6がリリースされました。” の続きを読む

Gutenberg Meetup vol.2に参加してきた

Gutenberg Meetup vol.2 – connpass

に参加してきました!赤坂とか何年ぶりでしょうか。

そもそも、Gutenbergとは

えー、ここで言うGutenbergとは活版印刷技術の発明者ではなくて、WordPressに近々導入されるテキストエディタのプロジェクトの名前です。絶賛開発中。

現在はプラグインの形でリリースされていますが、WordPress5.0で公式エディタとして統合される予定になっているそうです。

一般向けの公式の紹介ページ的なのは多分ココ
The new Gutenberg editing experience – WordPress – A new editing experience for WordPress is in the works, code name Gutenberg. Read more about it and test it!
開発者向けなページは多分ココ
Introduction – The new Gutenberg editing experience – WordPress

えー、今この記事自体を頑張ってGutenbergで書いているのですが、6日前にアップデートが出ていました、今気がついた・・・(!)。リリースノートを見ると30個以上の変更点があるみたいです。アップデートしたら大分と改善されてたYO!もうほんと只今絶賛全力シャカリキに開発中です。

Githubのページはここ。多分、ココ見たほうが早いと思います。
WordPress/gutenberg: Printing since 1440. Development hub for the editor focus in core. Beta plugin is available from the official WordPress repository.

あ・・・!もしかしてショートコードの改行が効かない問題、解決したんじゃ・・・?!

TEST TEST 

あ、やっぱりそれはまだ駄目ぽいですね・・・。でも大分と期待される動きに近づいて来ています。凄いな・・・。

という訳で、いずれ来るGutenbergの荒波を共に乗り越えよう

というタカイココロザシを持った方々が集まった今日のMeetup、とても楽しかったです。参加者が10人ぐらい?で、言いたいことも聞きたいこともバシバシ発言できる丁度良い規模だったかも。

“Gutenberg Meetup vol.2に参加してきた” の続きを読む