おちゃのこ通信 Vol.189 - デザイン道場 - おちゃのこネットメールマガジン

このコーナーでは、テンプレートのカスタマイズについて、実際のサンプルページを元に紹介していきます。

皆さん、こんにちは。おちゃのこネットの刑部です。
今回のデザイン道場は、引き続きスライドショーの細かいカスタマイズをご紹介します。
特に1枚でご利用時にお問い合わせいたたくことが多いのですが、写真まわりの余白と枠線を削除する方法をご紹介します。
▼スライドショーを作成する
http://www.ocnk.net/ocnk_ma/ocnkmagazine_asm183.html#de
▼スライドショーを作成する2
http://www.ocnk.net/ocnk_ma/ocnkmagazine_asm184.html#de

	http://cafe0808.ocnk.net/

スタイルシートを編集する

管理画面→デザイン管理→スタイルシートの編集をクリックして下さい。

スタイルシートの編集画面に下記の指定をコピーして貼り付けて下さい。
※貼り付け位置は、最下部にお願い致します。

#container .swipe_list .list_item_photo,
#container .swipe_list .item_data {
padding: 0px;
border: 0px;
}

padding:
border:

paddingが、余白となります。
borderが、枠線となります。
それぞれ、0pxに設定します。

ただし、この状態で左右の矢印を表示する場合、矢印の位置が少しずれます。
その場合は、スライド用のhtmlの下記divタグ内にdasta-padding="0"を追加してください。

また、左右矢印を削除することも可能です。
スライド用htmlタグの下記の2行を削除してください。

なお、お問い合わせは下記ページからお願い致します。

https://www.ocnk.net/contact/index.php