Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
最近作ったプラグインをせっかくなので紹介する #wpshinshu / 2019-01-12 ...
Search
Toro_Unit (Hiroshi Urabe)
January 12, 2019
Technology
0
69
最近作ったプラグインをせっかくなので紹介する #wpshinshu / 2019-01-12 WPShinshu
信州 WordPress Meetup vol.9 登壇資料です。
Toro_Unit (Hiroshi Urabe)
January 12, 2019
Tweet
Share
More Decks by Toro_Unit (Hiroshi Urabe)
See All by Toro_Unit (Hiroshi Urabe)
Cloudflare Meetup Nagano Vol.3
torounit
1
58
僕が考える 「HTML サイトを WordPress にする」話 / 2023-11-05 Kansai WordPress Meetup
torounit
9
7.4k
Cloudflare Pages に入門してみた / 2023-10-14 Cloudflare Meetup Nagano Vol.2
torounit
2
1.6k
ブロックエディタをゴリゴリに使い倒してサイトを作った話 / Kansai WordPress Meetup 2023 09 23
torounit
14
9.8k
ブロックエディターカスタマイズことはじめ #wpshinshu / 2023-06-17 Shinshu WordPress Meetup vol.24
torounit
1
380
FSE時代におけるWEBサイト制作の研究 #wpshinshu / 2023-05-20 Shinshu WordPress Meetup vol.23
torounit
0
420
ブロックエディターを用いたWEBサイト開発とカスタムフィールドのあり方を考える。/ WordCamp Japan 2021
torounit
0
540
ブロックエディターで変わる、WordPress でのウェブサイト開発 / SaCSS Special 26
torounit
4
850
Block Editor カスタマイズ入門 #WPmeetupOsaka / Get started customize for block editor
torounit
12
3.2k
Other Decks in Technology
See All in Technology
JavaにおけるNull非許容性
skrb
2
2.5k
ソフトウェアエンジニアと仕事するときに知っておいたほうが良いこと / Key points for working with software engineers
pinkumohikan
1
140
スキルだけでは満たせない、 “組織全体に”なじむオンボーディング/Onboarding that fits “throughout the organization” and cannot be satisfied by skills alone
bitkey
0
150
【内製開発Summit 2025】イオンスマートテクノロジーの内製化組織の作り方/In-house-development-summit-AST
aeonpeople
2
530
CDKのコードを書く環境を作りました with Amazon Q
nobuhitomorioka
1
150
OPENLOGI Company Profile
hr01
0
60k
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
6
2k
サイト信頼性エンジニアリングとAmazon Web Services / SRE and AWS
ymotongpoo
6
1.1k
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
17
45k
いまからでも遅くない!コンテナでWebアプリを動かしてみよう!コンテナハンズオン編
nomu
0
110
短縮URLをお手軽に導入しよう
nakasho
0
140
速くて安いWebサイトを作る
nishiharatsubasa
15
15k
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
22
1.4k
A designer walks into a library…
pauljervisheath
205
24k
Done Done
chrislema
182
16k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
Speed Design
sergeychernyshev
27
810
Dealing with People You Can't Stand - Big Design 2015
cassininazir
366
25k
Large-scale JavaScript Application Architecture
addyosmani
511
110k
Side Projects
sachag
452
42k
A better future with KSS
kneath
238
17k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
It's Worth the Effort
3n
184
28k
Gamification - CAS2011
davidbonilla
80
5.2k
Transcript
࠷ۙ࡞ͬͨϓϥάΠϯΛ ͔ͤͬ͘ͳͷͰհ͢Δ Toro_Unit@ Shinshu WP Meetup vol.9 1
$ whoami 2
Toro_Unit ෦ ߛ (͏Β ͻΖ͠) • Frontend Engineer • WordPress
Plugin and Theme Developer Github: @torounit Twitter: @Toro_Unit 3
ࡳຈͷձࣾͰϦϞʔτϫʔΫͯ͠·͢ 4
5
Contribution • WordPress 5.0.1 and 5.1 (Α͍ͯ) • WordCamp Kyoto
2017 / Osaka 2018 / Ogijima 2018 ࣮ߦҕһ • WordCamp Osaka 2018 Speaker. • etc... 6
Plugins and Themes • Custom Post Type Permalinks • Simple
Post Type Permalinks • Powerful Posts Per Page (PPPP) • Smart PWA <- new! • Vanilla • and more... 7
͚͋·͓ͯ͠ΊͰͱ͏͍͟͝·͢ɻ 8
࢝Կͯ͠·ͨ͠ʁ 9
࣮ՈͰೣٔΕͨΓ 10
11
χϡʔΠϠʔӺݟͨΓ ݩ͕܈അݝଠాࢢ 12
13
ϓϥάΠϯ࡞ͬͨ Γͯ͠·ͨ͠ 14
Δ͜ͱ͕ͳ͗ͯ͢͞… 15
࡞ͬͨϓϥάΠϯ • Advanced Posts Blocks • Advanced Archive Blocks •
Code Editor Blocks • Review Mode 16
Advanced Posts Blocks 17
18
Advanced Posts Blocks https://wordpress.org/plugins/advanced-posts-blocks/ • ʮ࠷৽ͷߘʯϒϩοΫΛڧԽͨ͠Ϡπͱ͔ͦͷ΄͔Ζ Ζɻ • ςʔϚʹPHPϑΝΠϧΛઃஔ͢Δ͜ͱͰݟͨͷΧελϚΠ ζ͕Մೳɻ
• WEB੍࡞Ͱ͍Ζ͍ΖͬͨϒϩοΫΛ·ͱΊͨɻ 19
Posts Blocks • ߘλΠϓɾΧςΰϦʔɾλάɾλΫιϊϛʔ ͰߜΓࠐΜͩ ߘҰཡΛදࣔɻ • τοϓϖʔδɺࣄۀհϖʔδͰͷؔ࿈χϡʔεͱ͔ɻ 20
Post Blocks • ಛఆͷߘΛબΜͰදࣔɻ • ؔ࿈هࣄͱ͔Λखಈઃఆ͢Δͱ͖ͱ͔ɻ 21
Children Blocks • ಛఆͷߘͷࢠϖʔδΛͯ͢දࣔɻ • ݻఆϖʔδͳͲͰαϒϝχϡʔΛ࡞ͬͨΓɻ 22
Advanced Archive Blocks 23
24
Advanced Archive Blocks https://wordpress.org/plugins/advanced-archive-blocks/ • ௨ৗͷΞʔΧΠϒϒϩοΫ݄ผ͔͠ग़དྷͳ͍ͷͰɺɾ ݄ɾɾि ͷΞʔΧΠϒ͑ΔΑ͏ʹͨ͠Ϡπɻ 25
Code Editor Blocks 26
27
Code Editor Blocks https://wordpress.org/plugins/code-editor-blocks/ • ΧελϜHTMLϒϩοΫͷϓϨϏϡʔ͕ iframe ͳͷͰɺී௨ ʹϨϯμϦϯά͢ΔΑ͏ʹͨ͠ɻϝσΟΞΫΤϦʔͳͲ͕ద ༻͞Ε͍ͯͯྑ͍ײ͡ʹϓϨϏϡʔ͢ΔΑ͏ʹɻ
• λμͷςΩετΤϦΞͰͳͯ͘ɺΤσΟλʔ(CodeMirror) Λ͏Α͏ʹͯ͠ΤϥʔͳͲΛݕͰ͖ΔΑ͏ʹɻ 28
Review Mode 29
30
Review Mode https://wordpress.org/plugins/review-mode/ • ϨϏϡʔϞʔυ͕༗ޮʹͳ͍ͬͯΔ߹ʹɺެ։ࡁΈʹՃ͑ ͯʮϨϏϡʔͪʯͷߘؚΊͯදࣔ͢ΔΑ͏ʹ͢Δɻ • ϨϏϡʔϞʔυͷઃఆϢʔβʔ͝ͱʹɻͪΖΜϩάΠϯ ͍ͯ͠ͳ͍ϢʔβʔଞͷϢʔβʔͷը໘ʹӨڹ͠ͳ͍ɻ ެ։͍ͨ͠هࣄ͕ΞʔΧΠϒҰཡͳͲͰͲͷΑ͏ʹݟ͑Δ
ͷ͔Λ֬ೝ͢ΔͨΊͷϓϥάΠϯɻ 31
ײ • ࣝͷ୨Է݉͠ͶͯɺࣄͰ࡞ͬͨػೳͰසग़ͨ͠ϠπΛϓϥάΠϯʹɻ • খ͞ͳ୯ҐͰϓϥάΠϯʹ͓ͯ͘͠ͱϝϯςφϯεָͰখճΓޮ͍ͯྑ ͍ײ͡ɻ • All in One
ͳϞϊ͕ྑ͍͔Ͳ͏͔έʔεόΠέʔε͚ͩͲɺϒϩοΫप Γখ͚ʹͨ͠ํ͕͍উखྑͦ͞͏ɻ • ৭Μͳػೳ͕ೖͬͯΔϞϊػೳ͕ڝ߹ͨ͠ͱ͖໘͍͘͞ɻ • ཉ͍͠ͷ͚ͩΠϯετʔϧ͢Ε͍͍ɻ 32
ΧελϜϒϩοΫͷϓϥάΠϯʹ͍ͭͯ • Gutenberg ͷιʔείʔυɺಘʹ block-library ลΓͷιʔείʔυΛ໓ ۤಡΜͩํ͕͍͍ɻ࣮ྫͳͲ͕গͳ͍ͷͰιʔεΛಡΉͱࢀߟʹͳΔɻ • HOC ɺReact
ͷษڧʹͳΔ͠ɺศརͳϥΠϒϥϦଟ͍ͷͰ WP API Λ͏ͱ͖ʹʹཱ͕͍ͭࣝΖ͍Ζɻ (@wordpress/data,@wordpress/ api-fetch) • ΧελϜϒϩοΫΛҊ݅͝ͱʹຖճ࡞ΔͷຊʹۤߦɻʢϒϩοΫ͝ͱͷ ೖྗͷ༷ܾΊͳͲ͕େมʣ • γϯϓϧͳίϯϙʔωϯτΛ࡞ͬͯϓϥάΠϯʹ͓ͯ͘͠ͷ͕ྑ͍ɻ 33
Thanks! Github: @torounit Twitter: @Toro_Unit Facebook: fb.me/torounit Blog: https://torounit.com 34