a-blog cms の便利な動的フォームを使いこなそう / a-blog cms dynamic form

フォーム全体に共通の部分をテンプレートに書いてしまっておけば、あとの項目の追加や編集をクライアント様にお任せできる動的フォームはとても便利な機能です。

Transcript

1. ศརͳಈతϑΥʔϜΛ࢖͍͜ͳͦ͏ ࢖͍ճͤΔςϯϓϨʔτͰ؆୯ʹϑΥʔϜ࡞੒ 2021.11.09 zoom up mintcode ּ୩ѥوࢠ
2. ࠓ೔ϏοΫϦͨ͜͠ͱͳͲ • site2020 ςʔϚͰΠϯετʔϧ͢Ε͹ɺςʔϚɺίϯϑΟάͱ΋ʹಈతϑΥʔϜ͕طʹ࢖͑ΔΑ͏ʹͳͬͯ ͍ͯɺಈతϑΥʔϜͷઃఆ΍ςϯϓϨʔτͷॻ͖ํͷࢀߟʹͳΔɻ
 https://demo.a-blogcms.jp/recruit/entry-13.html • ࢲ͸΄Μͱͷॳ৺ऀͷͱ͖ʹʮಈతϑΥʔϜʯ͸໊લ͕೉ͦ͠͏͙ͩ͢͠ʹ͸࢖Θͳͦ͏ͱࢥͬͯܟԕͨ͠ ··ɺ࠷ۙ·Ͱ࢖ͬͨ͜ͱ͕ͳ͔ͬͨɻ • ಉ͘͡site2020ςʔϚʹ͍ͭͯ΋ɺ΄Μͱͷॳ৺ऀͷͱ͖ʹʮػೳશ෦੝Γͩͱ೉ͦ͠͏ʯͱࢥͬͯܟԕ͠ ͨ··ɺ΄ͱΜͲ࢖ͬͨ͜ͱ͕ͳ͔ͬͨɻ • ʮಈతϑΥʔϜ a-blog cmsʯͰݕࡧ͢ΔͱdeveloperͷυΩϡϝϯτ͕Ҿ͔͔ͬΓɺͦ͜ʹ͸Ұ͔ΒΧελ ϚΠζ͢Δํ๏͕ॻ͍ͯ͋ͬͨɻʢͰ͖Ε͹site2020ͷ֘౰෦෼ʹ͍ͭͯͷݴٴ͕ͦ͜ʹ͋ͬͯ΄͍͠ʣ • Ԭా͞ΜͷϒϩάΤϯτϦʔ΋Ҿ͔͔ͬͬͯͦΕ͸͍ͨ΁Μࢀߟʹͳͬͨɻ
3. • ಈతϑΥʔϜΛ࢖͍͍ͨҊ͕݅bootstrapςʔϚͩͬͨͷͰbootstrapςʔϚʹ߹Θ ͤͯҰ͔ΒΧελϚΠζͨ͠ɻ • ͳͷͰΧελϚΠζʹ͸ΘΓͱ͕͔͔࣌ؒͬͯ͠·͕ͬͨɺҰ౓Ͱ͖ͯ͠·͏ͱ ʮಈతϑΥʔϜʯ͸͘͢͝ศརͰɺҊ݅Λ·͍ͨͰ࢖͍ճͤΔ͠ɺΫϥΠΞϯτ͞ Μʹͱͬͯ͸WordPressͷϓϥάΠϯΛ࢖ͬͨϑΥʔϜΑΓͣͬͱ؆୯ͩͱࢥͬ ͨɻ • ͳͷͰ΋ͬͱػೳͱͯ͠ਪͯ͠΄͍͠ͳͱࢥͬͨɻ • ͨͿΜsite2020ʹ͸ɺ·ͩࢲ͕஌Βͳ͍ػೳͷࢀߟʹͳΔͱ͜Ζ͕ͨ͘͞Μ͋Δͷ ͰɺϦϑΝϨϯεͱͯ͠ͱͯ΋༗༻ͳςʔϚΒ͍͠…ʢͷͰɺ͕࣌ؒ͋Δͱ͖ʹݟ ͯΈΑ͏ʂʣ
4. a-blog cms ͷ௨ৗͷϑΥʔϜ • ςϯϓϨʔτʹHTMLͰॻ͘ͷͰɺCSSɺJavaScriptͱ૊Έ߹ΘͤɺϨΠ Ξ΢τɺσβΠϯɺػೳΛࣗ༝ʹ૊Έ߹ΘͤΔ͜ͱ͕Ͱ͖Δ • ςϯϓϨʔτʹ௚઀ॻ͘ͷͰɺϑΥʔϜͷ࡞੒΍ฤू͸࣮૷ऀͰͳ͍ͱ೉ ͍͠
5. ಈతϑΥʔϜ • ςϯϓϨʔτΛҰ౓༻ҙͯ͠͠·͑͹ͲͷΤϯτϦʔʹͰ΋ϑΥʔϜΛ௥Ճ͢Δ͜ͱ ͕Ͱ͖Δ • ϑΥʔϜͷ௥Ճɺ߲໨ͷฤू͸؅ཧը໘͔Β௚ײతʹͰ͖ΔͷͰΫϥΠΞϯτ͞Μʹ ͓೚ͤ͢Δ͜ͱ͕Ͱ͖Δ • ϓϥάΠϯΛ࢖ͬͯγϣʔτίʔυΛίϐϖ͢ΔWordPressͷϑΥʔϜΑΓΫϥΠΞϯ τ͞Μʹͱͬͯ͸؆୯ • ςΩετʗςΩετΤϦΞʗϥδΦʗηϨΫτʗνΣοΫϘοΫεΛ࢖༻Ͱ͖ɺόϦ σʔλ΍ίϯόʔλ΋ἧ͍ͬͯͯγϯϓϧͳϑΥʔϜͰ͋Ε͹े෼ͳػೳ
6. ಈతϑΥʔϜ͕޲͍͍ͯΔҊ݅ • ϑΥʔϜ͕ෳ਺ඞཁͰɺڞ௨ʢݻ ఆʣ෦෼ͱΤϯτϦʔ͝ͱͷಠࣗ෦ ෼͕͋Δ • ΫϥΠΞϯτ͞Μ͕ࣗ෼ͰϑΥʔϜ Λ࡞੒ɺฤू͍ͨ͠ ΤϯτϦʔλΠτϧ ؅ཧը໘͔Βઃఆͨ͠ ΤϯτϦʔ͝ͱͷಠࣗ෦෼ ςϯϓϨʔτʹهड़ͨ͠ ڞ௨ʢݻఆʣ෦෼ ςϯϓϨʔτʹهड़ͨ͠λΠτϧ
7. ಈతϑΥʔϜΛ࡞Δ 1. ίϯϑΟά > ػೳઃఆ ͰʮಈతϑΥʔϜΛར༻Մೳʹ͢ΔʯʹνΣοΫ 2. ϑΥʔϜIDΛ࡞੒͢Δ 3. /themes/system/include/form Λ࢖͍ͬͯΔςʔϚʹίϐʔͯ͠ςϯϓϨʔτΛΧελϚΠζ͢Δ 4. site2020΍beginner2020Λ࢖͏ͱ͖ʹ͸ /themes/ 5. <!-- BEGIN column:loop --> <!-- END column:loop --> ͕ಈతͳ෦෼Ͱɺڞ௨ʢݻఆʣ෦෼͸ͦͷ্ʹ΋Լʹ΋ॻ͚Δ ಈతϑΥʔϜͷجຊ | ϑΥʔϜ | υΩϡϝϯτ | a-blog cms developer https://developer.a-blogcms.jp/document/form/dynamic_form.html
8. ςϯϓϨʔτΧελϚΠζ 1. ಈతϑΥʔϜͷݟग़͠Λมߋ
 ϑΥʔϜͷݟग़͠ɺͦͷޙͷஈམpͷ಺༰͸Ҋ݅ʹΑͬͯม͍͑ͨ෦෼ͳͷͰ࢖͍ճ͠ͷͨΊͷςϯϓϨʔτͰ͸ͦͷ··ʹ͓͍ͯͯ͠΋ 2. ͲͷΤϯτϦʔ͔Βͷૹ৴͔Λ൑ผ͠΍͘͢͢Δ
 %{ENTRY_TITLE}Λૹ৴ऀ޲͚ɺ؅ཧऀ޲͚ͷϝʔϧͷ໊݅ͱຊจʹೖΕ͓ͯ͘ 3. ϑΥʔϜૹ৴ޙ404ʹͳΒͳ͍Α͏ʹ͢Δ
 ςʔϚϑΥϧμ௚Լʹthanks.htmlΛ४උ͢Δ͔ɺ
 unit.htmlͷ /bid/%{BID}/eid/%{EID}/tpl/thanks.html Λ ?step=result ʹॻ͖׵͑
 ίϯόʔδϣϯ൑ఆʹ͸ΫΤϦม਺ΛؚΊͨURLΛ࢖༻Ͱ͖Δʢzoom up ౰೔ͷίϝϯτΑΓʣ 4. ϑΥʔϜͷೖྗޙɺૹ৴͢Δ౓ʹϖʔδͷઌ಄ʹͳΔͷΛ๷͗ɺϑΥʔϜͷҐஔΛΩʔϓ͢Δ
 5Օॴͷh2ʹ id=“entryform" Λ௥Ճɺ4Օॴͷformͷactionଐੑͷ຤ඌʹ #entryform Λ௥Ճ
 ϑΥʔϜεςοϓ͕ਐΜͩΒIFͰϢχοτ෦෼Λग़͞ͳ͍ͱ͍͏΍Γ͔ͨ΋͋Δʢzoom up ౰೔ͷίϝϯτΑΓʣ ಈతϑΥʔϜΛ࢖͏ͱ͖ʹ΍͓ͬͯ͘ͱ͍͍ΧελϚΠζ #ablogcms | ;Θͬͱϒϩά http://fuwhat.com/blog/entry-551.html
9. ͞ΒʹΧελϚΠζ 1. ެࣜςʔϚͷ௨ৗͷϑΥʔϜʮ͓໰͍߹ΘͤʯͷελΠϧ͕ͦͷ··౰ ͨΔΑ͏ʹදଆͷςϯϓϨʔτ input.html, con fi rm.html, unit.html Λॻ ͖׵͑Δ
 tableͰ͸ͳ͘ulͰग़ྗ͠ɺཁૉͷclass໊Λௐ੔͢Δ 2. આ໌ {caption} ΛදଆͷςϯϓϨʔτ input.html Ͱදࣔ͢Δ
 htmlλάΛ࢖͍͍ͨ৔߹͸{caption}[raw]
10. ಈతϑΥʔϜΛ΋ͬͱੵۃతʹ 
 ࢖͍ͬͯ͜͏ͱࢥ͍·͢ʂ site2020ͷ಺༰ΛͪΌΜͱ 
 ݟͯΈΑ͏ͱࢥ͍·͢ʂ ֶͼ