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
160
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
95
ビルトインモジュールの使い方 / how-to-use-builtin-module
mkasumi
0
180
a-blog cms 2020年版 公式テーマの紹介
mkasumi
0
140
デザインを考える習慣づくり
mkasumi
1
920
マークアップの最適解を見つけ出す方法 in Frontrend Vol.9
mkasumi
10
9.8k
Other Decks in Programming
See All in Programming
GitHub CopilotでTypeScriptの コード生成するワザップ
starfish719
26
6k
ゼロからの、レトロゲームエンジンの作り方
tokujiros
3
1.1k
各クラウドサービスにおける.NETの対応と見解
ymd65536
0
250
ErdMap: Thinking about a map for Rails applications
makicamel
1
680
Alba: Why, How and What's So Interesting
okuramasafumi
0
210
Оптимизируем производительность блока Казначейство
lamodatech
0
960
chibiccをCILに移植した結果 (NGK2025S版)
kekyo
PRO
0
140
Внедряем бюджетирование, или Как сделать хорошо?
lamodatech
0
950
良いユニットテストを書こう
mototakatsu
11
3.6k
Fixstars高速化コンテスト2024準優勝解法
eijirou
0
190
Flatt Security XSS Challenge 解答・解説
flatt_security
0
740
AHC041解説
terryu16
0
410
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Optimizing for Happiness
mojombo
376
70k
Measuring & Analyzing Core Web Vitals
bluesmoon
5
210
Build your cross-platform service in a week with App Engine
jlugia
229
18k
The Pragmatic Product Professional
lauravandoore
32
6.4k
RailsConf 2023
tenderlove
29
970
What's in a price? How to price your products and services
michaelherold
244
12k
A designer walks into a library…
pauljervisheath
205
24k
Fashionably flexible responsive web design (full day workshop)
malarkey
406
66k
4 Signs Your Business is Dying
shpigford
182
22k
Building Better People: How to give real-time feedback that sticks.
wjessup
366
19k
Designing for humans not robots
tammielis
250
25k
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}/" 年⽉⽇の書き⽅ 記述式:変数で⽇時指定する
ありがとうございました! 引き続きご質問があればフォーラムまたは マイページのサポート依頼からお待ちしています!