2017/01/31

WordPress|ギャラリーのCSSをカスタマイズ

tags : / / /

まず、元からある、ギャラリー用CSSを使わない設定をします。

 

function.php

//本体ギャラリーCSS停止
add_filter( 'use_default_gallery_style', '__return_false' );

 

CSS

/*-----------------------------
ギャラリー
------------------------------*/
.gallery {
}
.gallery-item {
 float: left;
 margin-top: 0;
 margin-bottom: 20px;
 margin-left: 0;
}
.gallery-icon {
 text-align: center;
}
.gallery-caption {
 color: #21759B;
 font-size: 90%;
 margin: 0;
 text-align: center;
}
.gallery-item img{
 width: 100%;
 padding: 0%;
 margin: 0%;
 float: left;
 height: auto;
}
.gallery-columns-1 .gallery-item {
 width: 100%;
 margin: 0%;
 box-sizing: border-box;
 float: left;
 height: auto;
}
.gallery-columns-2 .gallery-item {
 width: 48%;
 margin: 1%;
 float: left;
 height: auto;
}
.gallery-columns-3 .gallery-item {
 width: 32%;
 margin-left: 1%;
 float: left;
 height: auto;
}
.gallery-columns-4 .gallery-item {
 width: 23%;
 margin: 1%;
 float: left;
 height: auto;
}

 

  • このエントリーをはてなブックマークに追加

Profoile

coralqualia
HaraYohei http://coralqualia.com/

当サイトの運営者。 ビジネスを成功へ導くため、「思いをカタチに変える」お手伝いをします。 印刷物、WEBサイトの制作はもちろん、その他なんでもご相談ください。 少しでもお客様のお役に立てればと思っております。 【Service】 ロゴ/販促ツール制作/パッケージ/誌面/各種広告制作/看板サイン/各種印刷 WEBサイト企画立案/Webデザイン/Webサイト制作/CMS(WordPress)構築/ECサイト構築/サーバー運用管理/サイト運営サポート イラスト/キャラクターデザイン Wechatを活用したサービスの提供 /中国でのWEBサイト構築・運営・販促活動