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)
僕が考える 「HTML サイトを WordPress にする」話 / 2023-11-05 Kansai WordPress Meetup
torounit
9
7.3k
Cloudflare Pages に入門してみた / 2023-10-14 Cloudflare Meetup Nagano Vol.2
torounit
2
1.5k
ブロックエディタをゴリゴリに使い倒してサイトを作った話 / Kansai WordPress Meetup 2023 09 23
torounit
14
9.6k
ブロックエディターカスタマイズことはじめ #wpshinshu / 2023-06-17 Shinshu WordPress Meetup vol.24
torounit
1
370
FSE時代におけるWEBサイト制作の研究 #wpshinshu / 2023-05-20 Shinshu WordPress Meetup vol.23
torounit
0
410
ブロックエディターを用いたWEBサイト開発とカスタムフィールドのあり方を考える。/ WordCamp Japan 2021
torounit
0
530
ブロックエディターで変わる、WordPress でのウェブサイト開発 / SaCSS Special 26
torounit
4
840
Block Editor カスタマイズ入門 #WPmeetupOsaka / Get started customize for block editor
torounit
12
3.2k
本当にだれにでもできる、WordPress をよりよいものにする方法。/ wordcamp tokyo 2019
torounit
2
3.2k
Other Decks in Technology
See All in Technology
Jetpack Composeで始めるServer Cache State
ogaclejapan
2
160
祝!Iceberg祭開幕!re:Invent 2024データレイク関連アップデート10分総ざらい
kniino
2
240
Password-less Journey - パスキーへの移行を見据えたユーザーの準備 @ AXIES 2024
ritou
3
1.4k
NilAway による静的解析で「10 億ドル」を節約する #kyotogo / Kyoto Go 56th
ytaka23
3
370
アップデート紹介:AWS Data Transfer Terminal
stknohg
PRO
0
170
20241220_S3 tablesの使い方を検証してみた
handy
3
220
継続的にアウトカムを生み出し ビジネスにつなげる、 戦略と運営に対するタイミーのQUEST(探求)
zigorou
0
510
プロダクト開発を加速させるためのQA文化の築き方 / How to build QA culture to accelerate product development
mii3king
1
260
WACATE2024冬セッション資料(ユーザビリティ)
scarletplover
0
190
Snowflake女子会#3 Snowpipeの良さを5分で語るよ
lana2548
0
220
TSKaigi 2024 の登壇から広がったコミュニティ活動について
tsukuha
0
160
Turing × atmaCup #18 - 1st Place Solution
hakubishin3
0
470
Featured
See All Featured
Site-Speed That Sticks
csswizardry
2
190
Rails Girls Zürich Keynote
gr2m
94
13k
How GitHub (no longer) Works
holman
311
140k
Visualization
eitanlees
146
15k
Rebuilding a faster, lazier Slack
samanthasiow
79
8.7k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
Producing Creativity
orderedlist
PRO
341
39k
Making the Leap to Tech Lead
cromwellryan
133
9k
Automating Front-end Workflow
addyosmani
1366
200k
The Invisible Side of Design
smashingmag
298
50k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
159
15k
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