a-blog cms を使ったサイト制作ガイドラインを作ってみた

2019-11-22（金）a-blog cms Training Camp 2019 Autumn

Transcript

1. BCMPH
   DNT
   Λ࢖ͬͨ
   αΠτ੍࡞ΨΠυϥΠϯΛ
   ࡞ͬͯΈͨ 2019೥11݄22೔ a-blog cms Training Camp 2019 Autumn ੁݪ࠼
2.  ࣗݾ঺հ
    ΨΠυϥΠϯΛ࡞ͬͨ໨త
    ΨΠυϥΠϯஔ͖৔ͷڞ༗
    ಛʹ஫ҙ͍ͨ͠ͷ͜ͱ
    ·ͱΊ ໨࣍
3. ໊લɿੁݪ
   ࠼
   ॴଐɿ༗ݶձࣾΞοϓϧοϓϧ ʢ೥݄ೖࣾʣ
   ৬छɿϚʔΫΞοϓΤϯδχΞ ࣗݾ঺հ
4. ࣾ಺Ͱͷ$.4࣮૷ํ๏ڞ௨Խ
   ͳΜͱͳ͘΍͍࣮ͬͯͨ૷ཧ༝ Λ࠶֬ೝ
   ৽ਓ΁ͷڭҭίετ࡟ݮ
   ֎஫࣌ͷϚχϡΞϧͱͯ͠࢖͍ ͍ͨ ΨΠυϥΠϯΛ࡞ͬͨ໨త
5. ෳ਺ਓ਺Ͱͷ࣮૷͕΍Γ΍͍͢
   ϝϯςφϯε͠΍͘͢ͳΔ
   ࠷௿ݶͷ඼࣭อূ ΨΠυϥΠϯΛ࡞ͬͨઌʹ͋Δ΋ͷ ΨΠυϥΠϯΛ࡞ͬͨ໨త
6. IUUQTHJUIVCDPNBQQMFQMFHVJEFMJOF ΨΠυϥΠϯஔ͖৔ͷڞ༗
7. !JODMVEF lQBUIUPpMFz ͸ɺ
   ςʔϚϑΥϧμΑΓԼ͔Β
   ઈରύεͰ͔͘ ⁞ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
8. )5.-ϑΝΠϧͷΠϯΫϧʔυ ❶@include(“/path/to/file”)͸ɺςʔϚϑΥϧμҎ͔߱ΒઈରύεͰ͔͘ !JODMVEF lQBUIUPpMFz ը૾ϑΝΠϧͷಡΈࠐΈ JNH
   TSDlQBUIUPpMFz
   ʜ
   IUUQTEFWFMPQFSBCMPHDNTKQEPDVNFOUUFNQMBUFFOUSZIUNM
9. !JODMVEF lJODMVEFDBUFHPSZMJTUIUNMz ❶@include(“/path/to/file”)͸ɺςʔϚϑΥϧμҎ͔߱ΒઈରύεͰ͔͘
10. ௚઀දࣔͨ͘͠ͳ͍ςϯϓϨʔτ͸
    ϑΝΠϧ໊ͷ࠷ॳʹ
    ΞϯμʔείΞΛ͚ͭΔ   ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
11. ❷௚઀දࣔͨ͘͠ͳ͍ςϯϓϨʔτ͸ϑΝΠϧ໊ͷ࠷ॳʹΞϯμʔείΞΛ͚ͭΔ
12. ❷௚઀දࣔͨ͘͠ͳ͍ςϯϓϨʔτ͸ϑΝΠϧ໊ͷ࠷ॳʹΞϯμʔείΞΛ͚ͭΔ
13. IUUQTEFWFMPQFSBCMPHDNTKQEPDVNFOUQSBDUJDFFOUSZIUNM ❷௚઀දࣔͨ͘͠ͳ͍ςϯϓϨʔτ͸ϑΝΠϧ໊ͷ࠷ॳʹΞϯμʔείΞΛ͚ͭΔ
14. ؅ཧςϯϓϨʔτ΍ΠϯΫϧʔυϑΝΠϧ͸
    ཧ༝͕ͳ͍ݶΓܧঝݩςʔϚʹ࡞੒͢Δ ⁠ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
15. ❸؅ཧςϯϓϨʔτ΍ΠϯΫϧʔυϑΝΠϧ͸ཧ༝͕ͳ͍ݶΓܧঝݩςʔϚʹ࡞੒͢Δ ྫʣ site … ܧঝݩςʔϚ member@site … ࢠϒϩάͷςʔϚʢsiteςʔϚΛܧঝʣ memberϒϩάʢࢠϒϩάʣ ɹɾmemberϒϩάͷΧελϜϑΟʔϧυ ɹɾmemberϒϩάઐ༻ͷΧςΰϦʔϦετϞδϡʔϧ
16. ྫʣ site … ܧঝݩςʔϚ event@site … ࢠϒϩάͷςʔϚ eventϒϩά ɹɾeventϒϩάͷΧελϜϑΟʔϧυ ɹɾeventϒϩάઐ༻ͷΧςΰϦʔϦετϞδϡʔϧ ❸؅ཧςϯϓϨʔτ΍ΠϯΫϧʔυϑΝΠϧ͸ཧ༝͕ͳ͍ݶΓܧঝݩςʔϚʹ࡞੒͢Δ
17. ❸؅ཧςϯϓϨʔτ΍ΠϯΫϧʔυϑΝΠϧ͸ཧ༝͕ͳ͍ݶΓܧঝݩςʔϚʹ࡞੒͢Δ
18. ίϯςϯπ͝ͱͷΧελϜϑΟʔϧυΛ
    ΠϯΫϧʔυ͢Δͱ͖͸
    ίʔυ໊ΛؚΊͯϑΝΠϧ෼ذ͢Δ ⁡ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
19. ❹ίϯςϯπ͝ͱͷΧελϜϑΟʔϧυΛΠϯΫϧʔυ͢Δͱ͖͸ίʔυ໊ΛؚΊͯϑΝ Πϧ෼ذ͢Δ V V
20. ςϯϓϨʔτΛ෼ذ͢Δ࣌͸
    άϩʔόϧม਺Λ࢖͏ ⁡ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
21. ❹-2ςϯϓϨʔτΛ෼ذ͢Δͱ͖͸άϩʔόϧม਺Λ࢖͏
    Š
    #&(*/@*'
    <\#$%^FRNFNCFS>
    Š
    !JODMVEF lQBUIUPpMFNz
    Š
    &-4&
    Š
    !JODMVEF lQBUIUPpMFz
    
    Š
    &/%@*'
    Š
22.  άϩʔόϧม਺Λղܾ
     ΠϯΫϧʔυॲཧΛղܾ
     TFU5FNQMBUFΛղܾ
     HFU5FNQMBUFΛղܾ
     λονϞδϡʔϧΛղܾ
     ϞδϡʔϧྨΛ಺ଆ͔Βղܾ
     *'ϒϩοΫΛղܾ
     ʜҎԼলུ ❹-2ςϯϓϨʔτΛ෼ذ͢Δͱ͖͸άϩʔόϧม਺Λ࢖͏
23. ❹-2ςϯϓϨʔτΛ෼ذ͢Δͱ͖͸άϩʔόϧม਺Λ࢖͏
    Š
    #&(*/@*'
    <\#$%^FRNFNCFS>
    Š
    !JODMVEF lQBUIUPpMFNz
    Š
    &-4&
    Š
    !JODMVEF lQBUIUPpMFz
    
    Š
    &/%@*'
    Š !JODMVEF lQBUIUP\#$%^IUNMz
24. https://developer.a-blogcms.jp/document/template/entry-1442.html ❹-2ςϯϓϨʔτΛ෼ذ͢Δͱ͖͸άϩʔόϧม਺Λ࢖͏
25. ʢίϯςϯπͰ෼ྨͰ͖ͳ͍ʣ
    ڞ௨ͷΧελϜϑΟʔϧυͳͲͷ
    ϑΝΠϧ໊͸
    pFMEʓʓIUNMɹʹ͢Δ ⁢ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
26. field- ͳ͠ field- ͋Γ ⁢ʢίϯςϯπͰ෼ྨͰ͖ͳ͍ʣڞ௨ͷΧελϜϑΟʔϧυͳͲͷϑΝΠϧ໊͸pFMEͳ Μͱ͔IUNMʹ͢Δ
27. ܧঝݩςʔϚʹ
    ϧʔτϒϩάઐ༻ͷ
    ςϯϓϨʔτΛஔ͔ͳ͍ ⁣ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
28. ❻ܧঝݩςʔϚʹϧʔτϒϩάઐ༻ͷςϯϓϨʔτΛஔ͔ͳ͍
29. IUUQυϝΠϯ໊DPOUBDU ❻ܧঝݩςʔϚʹϧʔτϒϩάઐ༻ͷςϯϓϨʔτΛஔ͔ͳ͍
30. IUUQυϝΠϯ໊NFNCFSDPOUBDU ❻ܧঝݩςʔϚʹϧʔτϒϩάઐ༻ͷςϯϓϨʔτΛஔ͔ͳ͍
31. ❻ܧঝݩςʔϚʹϧʔτϒϩάઐ༻ͷςϯϓϨʔτΛஔ͔ͳ͍ NG OK
32. ΤϯτϦʔ಺Ͱ͸
    )5.-λάࣗମʹελΠϧΛద༻͢Δ ⁤ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
33. ؅ཧը໘ίϯϑΟάฤूઃఆ ❼ΤϯτϦʔ಺Ͱ͸HTMLλάࣗମʹελΠϧద༻͢Δ
34. Ϣχοτ಺ͷཁૉʹ͸ΨλʔΛ֬อ͢Δ ⁥ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
35. ❽Ϣχοτ಺ͷཁૉʹ͸ΨλʔΛ֬อ͢Δ
36. ❽Ϣχοτ಺ͷཁૉʹ͸ΨλʔΛ֬อ͢Δ
37. BDNTBENJONJODTT͸ඞͣಡΈࠐΉɻ
    ΧελϚΠζ࣌ʹ͸ɺ
    BDNTTDTTΛ࢖༻ςʔϚ಺ʹ͖࣋ͬͯͯ
    ϢχοτελΠϧ΋ಡΈࠐΉɻ ⁦ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
38. ❾acms-admin-min.css͸ඞͣಡΈࠐΉɻΧελϚΠζ࣌ʹ͸ɺacms.cssΛ࢖༻ςʔϚ಺ʹ ͖࣋ͬͯͯϢχοτελΠϧ΋ಡΈࠐΉɻ @import "functions"; @import "variable"; @import "mixins"; @import "grid"; @import "unit"; BDNTTDTT
    ͰΠϯϙʔτ͢Δ΋ͷ ઃఆϑΝΠϧ Ϣχοτ
39. Ϣχοτͷը૾αΠζΛ
    ʮͦͷ··ʯʹ͠ͳ͍ ➓ ಛʹ஫ҙ͍ͨ͠10ͷ͜ͱ
40. ➓Ϣχοτͷը૾αΠζΛͦͷ··ʹ͠ͳ͍
41. ࠓճ঺հͨ͠಺༰͸
    BQQMFQMF
    ಺
    ͰͷΨΠυϥΠϯ ·ͱΊ
42. ͝ҙݟड෇ઌɿ
    BQQMFQMFΨΠυϥΠϯ࡞੒൝
    ʢ৿ాɾງɾྛాɾੁݪɾҏ౻ʣ ͝ҙݟɺ͝ײ૝
    ౳
    ͓଴͍ͪͯ͠·͢ ·ͱΊ
43. ͝ਗ਼ௌ
    ͋Γ͕ͱ͏͍͟͝·ͨ͠ ͝ҙݟड෇ઌɿ
    BQQMFQMFΨΠυϥΠϯ࡞੒൝
    ʢ৿ాɾງɾྛాɾੁݪɾҏ౻ʣ IUUQTHJUIVCDPNBQQMFQMFHVJEFMJOF