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
a-blog cms でよくあるサポート小ネタまとめてみた
Search
Kasumi Morita
October 13, 2020
Programming
1
170
a-blog cms でよくあるサポート小ネタまとめてみた
a-blog cms のお問い合わせでよくあるサポート小ネタをまとめてみました。
a-blog cms zoom up 2020/10で発表した内容です。
Kasumi Morita
October 13, 2020
Tweet
Share
More Decks by Kasumi Morita
See All by Kasumi Morita
スムーズに入力するためのForm Design
mkasumi
7
1.1k
UTSUWAテーマVer.2.0の紹介
mkasumi
1
100
ビルトインモジュールの使い方 / how-to-use-builtin-module
mkasumi
0
190
a-blog cms 2020年版 公式テーマの紹介
mkasumi
0
150
デザインを考える習慣づくり
mkasumi
1
930
マークアップの最適解を見つけ出す方法 in Frontrend Vol.9
mkasumi
10
9.9k
Other Decks in Programming
See All in Programming
安全に倒し切るリリースをするために:15年来レガシーシステムのフルリプレイス挑戦記
sakuraikotone
5
2.4k
複雑なフォームと複雑な状態管理にどう向き合うか / #newt_techtalk vol. 15
izumin5210
4
3.3k
Compose Navigation実装の見通しを良くする
hiroaki404
0
180
PHPのガベージコレクションを深掘りしよう
rinchoku
0
250
snacks.nvim内のセットアップ不要なプラグインを紹介 / introduce_snacks_nvim
uhooi
0
350
remix + cloudflare workers (DO) docker上でいい感じに開発する
yoshidatomoaki
0
120
Return of the Full-Stack Developer
simas
PRO
1
320
Coding Experience Cpp vs Csharp - meetup app osaka@9
harukasao
0
120
私の愛したLaravel 〜レールを超えたその先へ〜
kentaroutakeda
12
3.6k
AHC 044 混合整数計画ソルバー解法
kiri8128
0
300
Devin , 正しい付き合い方と使い方 / Living and Working with Devin
yukinagae
2
580
本当だってば!俺もTRICK 2022に入賞してたんだってば!
jinroq
0
260
Featured
See All Featured
Reflections from 52 weeks, 52 projects
jeffersonlam
349
20k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Done Done
chrislema
183
16k
Fireside Chat
paigeccino
37
3.3k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.5k
Adopting Sorbet at Scale
ufuk
75
9.3k
Navigating Team Friction
lara
184
15k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
12k
The Cost Of JavaScript in 2023
addyosmani
48
7.6k
How STYLIGHT went responsive
nonsquared
99
5.4k
Transcript
サポートの⼩ネタ まとめてみた 有限会社アップルップル 森⽥かすみ よくお問い合わせがある! a-blog cms zoom up 2020/10
Q1 IFブロックでELSEも表⽰されてしまっている Q2 lazy-loadで画像をふわっとしたい! Q3 ラジオボタンをクリックした時に 検索結果を反映させたいときは? Q4 モジュールでctxが効かないのですが?
Q5 ctxのstartとendがうまく使えない…! ⽬次
IFブロックでELSEも 表⽰されてしまっている Q1.
<!-- BEGIN_IF [{group_detail}/em] --> <p class="acms-text-danger">֓ཁจ͕ۭͩͬͨͱ͖ʹදࣔ͞Ε·͢ɻ <!-- ELSE --> <p
class="acms-text-success">ELSEͷͱ͖ʹදࣔ͞Ε·͢ɻ <!-- END_IF -->
{group_detail}の中⾝ ߍਖ਼Φϓγϣϯͳ͠ ߍਖ਼ΦϓγϣϯOMCS͋Γ
<!-- BEGIN_IF [{group_detail}[delnl]/em] --> <p class="acms-text-danger">֓ཁจ͕ۭͩͬͨͱ͖ʹදࣔ͞Ε·͢ɻ <!-- ELSE --> <p
class="acms-text-success">ELSEͷͱ͖ʹදࣔ͞Ε·͢ɻ <!-- END_IF -->
lazy-loadで画像を ふわっとさせたい! Q2.
.js-lazy-load { opacity: 0; transition: .5s ease .2s; } .js-lazy-load[data-loaded*="true"]
{ opacity: 1; } 表⽰した瞬間にふわっとすることはCSSで可能です
※回線が遅いとふわっとしないことも…
ラジオボタンをクリックした時 に検索結果を反映したい時は? Q3.
たとえば送信ボタンがない検索画⾯を実装したいときの問題
<script> $(function(){ ACMS.Ready(function() { ACMS.Config.postIncludeMethod = 'swap'; // swap |
replace }); $('.js-post input[type="radio"]').on('change', function () { $('.js-post').submit(); }); }); </script> changeイベントで内容を書き換える 1 2 3
<div> <!-- BEGIN_MODULE Field_Search --> <form action="" method="post" class="js-post js-post_include"
target="#realestateIndex"> …ϥδΦϘλϯলུ… <input type="hidden" name="field[]" value="station"> <input type="hidden" name="bid" value="%{BID}" /> <input type="hidden" name="cid" value="%{CID}" /> <input type="hidden" name="tpl" value="/include/entry/summary-custom.html" /> <input type="hidden" name=“ACMS_POST_2GET”><!— ௨ৗsubmitʹͳͬͯΔ෦ —> </form> <!-- END_MODULE Field_Search --> </div> <!-- ΤϯτϦʔαϚϦʔʢΧελϜϑΟʔϧυը૾දࣔʣ --> <div id="realestateIndex"> @include("/include/entry/summary-custom.html") </div> changeイベントで内容を書き換える 1 2 3 4
モジュールで ctxが効かないのですが? Q4.
https://developer.a-blogcms.jp/blog/news/entry-3305.html モジュールID名に「ctx」が含まれているとctx指定が読み込めなくなる
<!-- BEGIN_MODULE *** id="test_module_ctx" ctx="bid/1/cid/6" --> <!-- END_MODULE *** -->
<!-- BEGIN_MODULE *** id="test_module" ctx="bid/1/cid/6" --> <!-- END_MODULE *** --> NG例 OK例
Q5. ctxのstartとendが うまく使えない…!
<!-- BEGIN_MODULE Entry_List ctx="bid/1/cid/2" --> ...省略 <!-- END_MODULE Entry_List -->
BIDとCIDの値を渡したい場合
startとendの書き⽅??? <!-- BEGIN_MODULE Entry_List ctx="bid/1/cid/2" --> ...省略 <!-- END_MODULE Entry_List
--> <!-- BEGIN_MODULE Entry_List ctx="/start/ʢ։࢝࣌ʣ/end/ʢऴྃ࣌ʣ/" --> ... <!-- END_MODULE Entry_List -->
ctx="/start/ʢ։࢝࣌ʣ/end/ʢऴྃ࣌ʣ/" ctx="/ʢ։࢝࣌ʣ/-/ʢऴྃ࣌ʣ/" 間違い例 正解例
ctx="/2020-06-2310:00:00/-/9999-12-3123:59:59/" ctx="/1000-01-01/-/{date#Y}-{date#m}-{date#d}{date#H}:{date#i}:{date#s}/" 年⽉⽇の書き⽅ 記述式:変数で⽇時指定する
ありがとうございました! 引き続きご質問があればフォーラムまたは マイページのサポート依頼からお待ちしています!