目次
範例一: 問題勾選(多選題)
<div class="QA_BTN_CB">
<ul class="btn_list" data-widthratio="100" data-sp-w="100">
<li><label><input class="radio-input" name="radio_3" type="checkbox" value="0" /><span class="input_text">選項一</span></label></li>
<li><label><input class="radio-input" name="radio_3" type="checkbox" value="0" /><span class="input_text">選項二</span></label></li>
<li><label><input class="radio-input" name="radio_3" type="checkbox" value="0" /><span class="input_text">選項三</span></label></li>
</ul>
</div>
請複製以上程式碼,並參考底部的說明,進行區塊的新增和內容的修改
(上方黑色粗體的文字,為可替換的內容)
範例二:單選按鈕
<div class="QA_BTN_CB">
<ul class="btn_list" data-widthratio="100" data-sp-w="100">
<li><label><input class="radio-input" name="radio_3" type="radio" value="0" /><span class="input_text">選項一</span></label></li>
<li><label><input class="radio-input" name="radio_3" type="radio" value="0" /><span class="input_text">選項二</span></label></li>
<li><label><input class="radio-input" name="radio_3" type="radio" value="0" /><span class="input_text">選項三</span></label></li>
</ul>
</div>
請複製以上程式碼,並參考底部的說明,進行區塊的新增和內容的修改
(上方黑色粗體的文字,為可替換的內容)
※若是要將原本的多選內容改為單選的話,請將程式碼中的「type」修改為「radio」,並且讓同一個問題內的讓各個選項的「name」的值(radio_3),都保持在相同的內容,程式才有辦法辨識三個選項會是同一個問題的項目。
(※若在同一篇記事內,有使用不只一組的單選按鈕的話,請將第二組開始的name值,修改為其他名稱,例如radio_4)
範例三: 按鈕開合→點擊展開解答
我是解答,請將要填入的文字放於此我是解答,請將要填入的文字放於此我是解答,請將要填入的文字放於此我是解答,請將要填入的文字放於此我是解答,請將要填入的文字放於此我是解答,請將要填入的文字放於此
<div class="toggleZone">
<div class="btnFrame">
<a id="answerBtn_1" class="answerBtn">送出</a>
</div>
<div id="answerZone_1" class="answerZone">
<p>我是解答,請將要填入的文字放於此</p>
</div>
</div>
※若在同一篇記事內,有使用不只一組的按鈕開合的話,請將第二組開始的程式碼,找到上方兩處「黃色背景的數字」依序加1,例如:第一組因為不用修改,所以皆為1(「answerBtn_1」和「answerZone_1」),而第二組開始:「answerBtn_2」和「answerZone_2」、第三組:「answerBtn_3」和「answerZone_3」,依序以此類推。
請複製以上程式碼,並參考頂部和底部的說明,進行區塊的新增和內容的修改
(上方黑色粗體的文字,為可替換的內容;有顏色背景的英文字,則為可替換的變數)
使用方式說明:
「傳統編輯器」和「區塊編輯器」有各自的加入方式,請擇一即可
並且勾選指定的模組,嵌入相對應的輔助程式碼
「區塊編輯器」:
.請於左側的區塊工具欄中,選擇「自訂HTML」, 來新增上方欲使用的範例程式碼
「傳統編輯器」:
.請選擇「編輯HTML程式碼」, 來新增上方欲使用的範例程式碼
.接著,請在編輯畫面的右側下方的TAG模組中(如下圖),找到「問答按鈕組合(單選多選)|核取方塊|按鈕開合」,並勾選它,才會將輔助上述功能的程式碼完全嵌入。
以上即可完成相關設定。若有遇到問題,請洽Kuroha。