WordPress

ブログ風カードの作り方・横並び

更新日:




カードの作り方

1 記事IDを記入してそのIDを選択する。(IDの数字をマウスで指定する)
2 「ブログカード風」ボタンを押下
[st-card id=xxxx]こんな感じに変更される。
3 (2)でできた文字を選択しカードスタイルを適応。
(「スタイル」>「レイアウト」>「カードスタイル」を選択)

<div class="st-cardstyle">[st-card id=XXX]</div>  (カードスタイル)
<div class="st-cardstyleb">[st-card id=XXX]</div>  (カードスタイルB)

メモ

カードスタイルB
・PC表示は変わらず、モバイル表示の時に表示が変わるがテキストがかぶさりイマイチ。

メモ

ショートコードは両端に”[”と”]”で囲むと無効になり、表示できる。

 

横並び

1 (ビジュアルモード)「タグ」>「レイアウト」>「PCとTab左右50%」選択
2 (テキストモード)に変更、以下の(ここを変更)の箇所に”カードの作り方”で作成したコードを入れ替えると完成
<div class="clearfix responbox50">
<div class="lbox">

左側のコンテンツ50% <-(ここを変更)

</div>
<div class="rbox">

右側のコンテンツ50% <-(ここを変更)

</div>
</div>



-WordPress
-

Copyright© 一情多楽 , 2024 All Rights Reserved.