Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WordPress_テーマのつくりかた.pdf

 WordPress_テーマのつくりかた.pdf

Takashi Kitajima

December 23, 2019
Tweet

More Decks by Takashi Kitajima

Other Decks in Technology

Transcript

  1. 8PSE1SFTTςʔϚͷ
    ͭ͘Γ͔ͨ

    View full-size slide

  2. ςΩετ
    ΩλδϚλΧγ
    !JOD

    ϑϦʔϥϯε ϞϯΩʔϨϯν௕࡚

    4OPX.POLFZ
    .881'PSN

    View full-size slide

  3. 4OPX.POLFZ
    ԁ ੫ผ

    (1-
    ϒϩοΫΤσΟλʔରԠ
    ։ൃऀ޲͚"1*

    View full-size slide

  4. ͪΐͬͱ͚ͩσϞ

    View full-size slide

  5. w ·ͱ΋ͳ8PSE1SFTTςʔϚͱ͸
    w ϋϯυϒοΫΛಡ΋͏
    w ςϯϓϨʔτλάΛ࢖͓͏
    w 8PSE1SFTTͷηΦϦʔʹԊ͓͏
    w ϒϩοΫΤσΟλʔରԠ
    ΞδΣϯμ

    View full-size slide

  6. w ͜Ε͔Β8PSE1SFTTςʔϚΛͭ͘Ζ͏ͱͯ͠
    ͍Δํ
    w ձࣾͷ࢓ࣄͰΦϦδφϧͷ8PSE1SFTTςʔϚ
    Λ৮Γ͸͡Ίͨํ
    ର৅

    View full-size slide

  7. ·ͱ΋ͳ8PSE1SFTT

    ςʔϚͱ͸

    View full-size slide

  8. w 8PSE1SFTTࣗମͷػೳ͕࢖͑Δ
    w ϓϥάΠϯΛ௥Ճͯ͠΋յΕͳ͍
    w Ͳ͜ͰͳʹΛ΍͍ͬͯΔ͔༧૝͕ͭ͘
    ·ͱ΋ͳ8PSE1SFTTςʔϚͱ͸

    View full-size slide

  9. w ϝχϡʔػೳ
    w ϗʔϜϖʔδઃఆ
    w ΤσΟλʔ
    w ӈدͤࠨدͤதԝἧ͑ɺશ෯෯޿
    w FUD
    8PSE1SFTTࣗମͷػೳ͕࢖͑Δʁ

    View full-size slide

  10. w ϓϥάΠϯͷ+4$44͕ಡΈࠐ·Εͳ͍
    w K2VFSZΛࠩ͠ସ͍͑ͯΔͨΊόʔδϣϯ͕ׯ
    ব͠Τϥʔ
    w ಈ࡞΍දࣔΛมߋ͢ΔܥϓϥάΠϯͰɺΤϥʔ
    Λى͍ͯ͜͠ͳ͍ͷʹͳ͔ͥը໘্ʹ൓ө͞Ε
    ͳ͍
    ϓϥάΠϯΛ௥Ճͯ͠΋յΕͳ͍ʁ

    View full-size slide

  11. w ਺ઍߦɺ਺ສߦͷGVODUJPOTQIQ
    w ໋໊نଇ͕ҙຯෆ໌ʢ$441)1ʣ
    Ͳ͜ͰͳʹΛ΍͍ͬͯΔ͔૝૾͕ͭ͘ʁ

    View full-size slide

  12. w ద੾ʹςϯϓϨʔτλά͕࢖ΘΕ͍ͯΔ
    w 8PSE1SFTTͷηΦϦʔʹԊ͍ͬͯΔ
    w ϑΝΠϧߏ଄໋໊نଇ͕੔ཧ͞Ε͓ͯΓ༧૝
    Ͱ͖Δ
    ·ͱ΋ͳ8PSE1SFTTςʔϚͱ͸

    View full-size slide

  13. ϋϯυϒοΫΛಡ΋͏

    View full-size slide

  14. w 5IFNF)BOECPPL

    IUUQTEFWFMPQFSXPSEQSFTTPSHUIFNFT
    w 5IFNF3FWJFX(VJEFMJOFT

    IUUQTNBLFXPSEQSFTTPSHUIFNFTIBOECPPL
    SFWJFXSFRVJSFE
    w (PPHMF຋༁Ͱ΋ΘΓͱ·ͱ΋ʹಡΊ·͢
    w Ҏ্ʂ
    ϋϯυϒοΫΛಡ΋͏

    View full-size slide

  15. w @TʢVOEFSTDPSFTʣ

    IUUQTVOEFSTDPSFTNF
    w 5XFOUZ5XFOUZɺ5XFOUZ/JOFUFFOʜ
    ࢀߟςʔϚ

    View full-size slide

  16. ςϯϓϨʔτλάΛ
    ࢖͓͏

    View full-size slide

  17. w %#಺ͷ஋΍ίϯςϯπΛऔಘ͢ΔͨΊʹ࢖༻͢Δ
    ؔ਺
    w ྫ͑͹ɺHFU@IFBEFS
    ɺUIF@UJUMF
    ɺUIF@QPTU
    ͳͲ
    w 8PSE1SFTTͷઃఆ΍ίϯςϯπ͸શ෦%#ʹೖͬͯ
    ͍ΔͷͰ42-Ͱͱͬͯ͘Δ͜ͱ΋Ͱ͖Δ͚Ͳɺςϯ
    ϓϨʔτλά͕͋Δ৔߹͸ʮઈରʹʯςϯϓϨʔτ
    λάΛ࢖͍·͠ΐ͏
    ςϯϓϨʔτλάͱ͸

    View full-size slide

  18. w ྫ͑͹HFU@IFBEFS
    ͷதʹ͸HFU@IFBEFSΞΫγϣϯϑοΫ
    w ྫ͑͹UIF@UJUMF
    ͷதʹ͸UIF@UJUMFϑΟϧλʔϑοΫ
    w ϓϥάΠϯʢ΍ίΞʣ͸͜ͷϑοΫʹର͠ॲཧΛ͓͜ͳ͏ͷ
    ͰɺςϯϓϨʔτλάΛ࢖͍ͬͯͳ͍ͱϓϥάΠϯʢ΍ί
    Ξʣͷॲཧ͕ൈ͚ͯ͠·͏ɻ
    w طଘͷςϯϓϨʔτλά͕͋Δʹ΋ؔΘΒͣಠࣗॲཧͰͳΜ
    ͱ͔ͯ͠͠·͏ͱҾ͖ܧ͕͗େมʢ௒͋Δ͋Δʣ
    ςϯϓϨʔτλάΛ࢖Θͳ͍ͱͲ͏ͳΔ͔

    View full-size slide

  19. 8PSE1SFTTͷηΦϦʔ
    ʹԊ͓͏

    View full-size slide

  20. w JOEFYQIQ͸࠷ޙͷࡆ
    w $44ͷಡΈࠐΈ͸XQ@FORVFVF@TUZMF

    w +4ͷಡΈࠐΈ͸XQ@FORVFVF@TDSJQU

    w ݟͨ໨ͱػೳͷ෼཭
    w FUD
    8PSE1SFTTͷηΦϦʔʹԊ͓͏

    View full-size slide

  21. w 5FNQMBUF)JFSBSDIZ

    IUUQTEFWFMPQFSXPSEQSFTTPSHUIFNFTCBTJDT
    UFNQMBUFIJFSBSDIZ
    w JOEFYQIQ͸τοϓϖʔδ༻ͷςϯϓϨʔτʮͰ͸ͳ
    ͍ʯʂͲͷςϯϓϨʔτ΋Ϛον͠ͳ͔ͬͨͱ͖ͷ࠷ޙͷ
    ࡆͷςϯϓϨʔτɻ
    w τοϓϖʔδ༻͸GSPOUQBHFQIQɺ

    ϒϩάͷτοϓ͸IPNFQIQ
    JOEFYQIQ͸࠷ޙͷࡆ

    View full-size slide

  22. w IFBEʹ௚ॻ͖ʁ
    w XQ@FORVFVF@TUZMF
    Λ࢖͏͜ͱͰಡΈࠐΈॱ
    ͷ੔ཧɺΩϟογϡରࡦɺϓϥάΠϯ౳͔Βͷ
    ແޮԽͳͲͷૢ࡞͕Մೳ
    $44ͷಡΈࠐΈ͸XQ@FORVFVF@TUZMF

    View full-size slide

  23. wp_enqueue_style(
    ‘ϋϯυϧ໊’,
    get_theme_file_uri( ‘/css/style.css’ ),
    [ ‘ઌʹಡΈ͍ͨ CSS ͷϋϯυϧ໊’, … ],
    filemtime( get_theme_file_path( ‘/css/style.css’ ) )
    );

    View full-size slide

  24. w IFBEʹ௚ॻ͖ʁ
    w XQ@FORVFVF@TDSJQU
    Λ࢖͏͜ͱͰಡΈࠐΈॱ
    ͷ੔ཧɺΩϟογϡରࡦɺϓϥάΠϯ౳͔Βͷ
    ແޮԽͳͲͷૢ࡞͕Մೳ
    +4ͷಡΈࠐΈ͸XQ@FORVFVF@TDSJQU

    View full-size slide

  25. wp_enqueue_script(
    ‘ϋϯυϧ໊’,
    get_theme_file_uri( ‘/js/app.js’ ),
    [ ‘ઌʹಡΈ͍ͨ JS ͷϋϯυϧ໊’, … ],
    filemtime( get_theme_file_path( ‘/js/app.js’ ) ),
    true // ϑολʔ = trueɺhead = false
    );

    View full-size slide

  26. w IUUQTNBLFXPSEQSFTTPSHUIFNFTIBOECPPL
    SFWJFXSFRVJSFEQSFTFOUBUJPOWTGVODUJPOBMJUZ
    w ഑෍ςʔϚɺࣗࣾར༻डୗ։ൃͰͲ͜·Ͱ΍Δ͔
    ͸ҧ͏ͱࢥ͍·͕͢ʜ
    w جຊతʹ͸ςʔϚΛ੾Γସ͑ͨͱ͖ʹফ͑ͨΒࠔ
    Δ΋ͷʢΧελϜ౤ߘλΠϓɺγϣʔτίʔυ౳ʣ
    ͸ϓϥάΠϯྖҬʹॻ͘͜ͱ͕ਪ঑͞Ε͍ͯ·͢ɻ
    ݟͨ໨ͱػೳͷ෼཭

    View full-size slide

  27. w ςʔϚ͕·ͱ΋͔Ͳ͏͔ࣗಈνΣοΫͰ͖·͢ɻ
    w ؆қతͳ΋ͷͳΒςʔϚνΣοΫϓϥάΠϯ͕ศར

    IUUQTXPSEQSFTTPSHQMVHJOTUIFNFDIFDL
    w ίϚϯυͰ΍Γ͍ͨɺνΣοΫ಺༰ΛΧελϚΠζ͍ͨ͠
    ͳΒ8PSE1SFTT$PEJOH4UBOEBSETGPS1)1@$PEF4OJ⒎FS

    IUUQTHJUIVCDPN8PSE1SFTT8PSE1SFTT$PEJOH
    4UBOEBSET
    FUD

    View full-size slide

  28. ϒϩοΫΤσΟλʔ
    ରԠ

    View full-size slide

  29. w #MPDL&EJUPS)BOECPPL

    IUUQTEFWFMPQFSXPSEQSFTTPSHCMPDL
    FEJUPS
    ϒϩοΫΤσΟλʔରԠ

    View full-size slide

  30. w 8PSE1SFTT͔ΒΤσΟλʔ͕มߋ
    w 8:4*8:(ΤσΟλʔʢΫϥγοΫΤσΟ
    λʔʣ͔ΒϒϩοΫΤσΟλʔʹ
    ϒϩοΫΤσΟλʔରԠ

    View full-size slide

  31. w ʮจষΛॻ͘ʯͱ͍͏جຊతͳૢ࡞ײ͸Ϋϥ
    γοΫΤσΟλʔͱ΄΅ಉ͡
    w ϒϩοΫ୯ҐͰૢ࡞ɻฒͼସ͕͑Ͱ͖ͨΓૢ࡞
    ײ͕޲্ɺઃఆ΋ϒϩοΫ୯ҐͰ࣋ͯΔ
    w )5.-͕͜ΘΕͳ͍
    ϒϩοΫΤσΟλʔͷϝϦοτ

    View full-size slide

  32. w ʮΤσΟλʔͷதʹೖྗͨ͠จࣈʯ
    Λ૷০
    w )5.-͕Α͘͜ΘΕΔͷͰɺ)5.-
    ͷཧղ͕ඞཁ
    ৽چΤσΟλʔͷ͕͍ͪ
    w ϒϩοΫΛॏͶͯίϯςϯπΛߏ੒
    w )5.-Λॻ͔ͤͳ͍ͱ͍͏ڧ͍ҙࢤ
    w ಠࣗʹϒϩοΫΛ௥Ճ͢Δʹ͸
    +BWB4DSJQUྗ 3FBDU+49
    ͕ඞ

    ΫϥγοΫΤσΟλʔ ϒϩοΫΤσΟλʔ

    View full-size slide

  33. w ΫϥγοΫΤσΟλʔʢϓϥάΠϯʣͷαϙʔτ͸
    ·Ͱ

    IUUQTNBLFXPSEQSFTTPSHDPSF
    DMBTTJDFEJUPSQMVHJOTVQQPSUXJOEPX
    w ϒϩοΫΤσΟλʔ͸(VUFOCFSHϓϩδΣΫτͷϑΣ
    ʔζɻϑΣʔζͱͯ͠αΠτશମͷϒϩοΫԽ͕ਐ
    ߦத

    IUUQTDBQJUBMQKQCMPDLCBTFEUIFNF
    ϒϩοΫΤσΟλʔରԠ

    View full-size slide

  34. w 5IFNF)BOECPPL

    IUUQTEFWFMPQFSXPSEQSFTTPSHUIFNFT
    w 5IFNF3FWJFX(VJEFMJOFT

    IUUQTNBLFXPSEQSFTTPSHUIFNFTIBOECPPL
    SFWJFXSFRVJSFE
    w #MPDL&EJUPS)BOECPPL

    IUUQTEFWFMPQFSXPSEQSFTTPSHCMPDLFEJUPS
    ·ͱΊ

    View full-size slide