JINカスタマイズまとめ

このサイトは、WordPressで、JINというテーマを利用しています。
このサイトにしているJINのカスタマイズは以下の通りです。
CSSに関しては、すべて「追加CSS」に書き込んでいます。

覚え書きとして残していますが、自分があちこち探しまくった経緯があるので、同じように困っていたり、求めている人の、参考になれば幸いです。

目次

/* 目次のタイトルを小さくする */
.rtoc-mokuji-content #rtoc-mokuji-title {
    letter-spacing: 0;
    font-size: 1.2em;
    line-height: 1.2em;
}

フッター

/* フッター上の背景色を指定 */
#breadcrumb:after, #page-top a {
    background-color: #dac7c6;
}
/* フッター上の背景の透明をとる */
#breadcrumb:after {
    opacity: 1.0;
}

吹き出しの色変更

/*吹き出し「red」色変更-背景*/
.balloon-left.balloon-bg-red .balloon-content, .balloon-left.has-ffebeb-bgballon .balloon-content {
    background: #fff8f5;
}
.balloon-right.balloon-bg-red .balloon-content, .balloon-right.has-ffebeb-bgballon .balloon-content {
    background: #fff8f5;
}
.balloon-left.balloon-bg-red .balloon-serif:before, .balloon-left.has-ffebeb-bgballon .balloon-serif:before {
    border-color: transparent #fff8f5 transparent transparent;	/* 左三角背景 */
}
.balloon-right.balloon-bg-red .balloon-serif:before, .balloon-right.has-ffebeb-bgballon .balloon-serif:before {
    border-color: transparent transparent transparent #fff8f5;	/* 右三角背景 */
}

/*吹き出し「red」色変更-線*/
.balloon-left.balloon-red .balloon-content, .balloon-left.has-f-48789-ballon .balloon-content {
    border-color: #dac7c6;
}
.balloon-right.balloon-red .balloon-content, .balloon-right.has-f-48789-ballon .balloon-content {
    border-color: ##dac7c6;
}
.balloon-left.balloon-red .balloon-serif:after, .balloon-left.has-f-48789-ballon .balloon-serif:after {
    border-color: transparent #dac7c6 transparent transparent;	/* 左三角線 */
}
.balloon-right.balloon-red .balloon-serif:after, .balloon-right.has-f-48789-ballon .balloon-serif:after {
    border-color: transparent transparent transparent #dac7c6;	/* 右三角線 */
}

/*吹き出し「yellow」色変更-背景*/
.balloon-left.balloon-bg-yellow .balloon-content, .balloon-left.has-fff-8-d-1-bgballon .balloon-content {
    background: #fffceb;
}
.balloon-right.balloon-bg-yellow .balloon-content, .balloon-right.has-fff-8-d-1-bgballon .balloon-content {
    background: #fffceb;
}
.balloon-left.balloon-bg-yellow .balloon-serif:before, .balloon-left.has-fff-8-d-1-bgballon .balloon-serif:before {
    border-color: transparent #fffceb transparent transparent;	/* 左三角背景 */
}
.balloon-right.balloon-bg-yellow .balloon-serif:before, .balloon-right.has-fff-8-d-1-bgballon .balloon-serif:before {
    border-color: transparent transparent transparent #fffceb;	/* 右三角背景 */
}


/*吹き出し「yellow」色変更-線*/
.balloon-left.balloon-yellow .balloon-content, .balloon-left.has-ffd-75-e-ballon .balloon-content {
    border-color: #ffea76;
}
.balloon-right.balloon-yellow .balloon-content, .balloon-right.has-ffd-75-e-ballon .balloon-content {
    border-color: #ffea76;
}
.balloon-left.balloon-yellow .balloon-serif:after, .balloon-left.has-ffd-75-e-ballon .balloon-serif:after { 
   border-color: transparent #ffea76 transparent transparent;	/* 左三角線 */
}
.balloon-right.balloon-yellow .balloon-serif:after, .balloon-right.has-ffd-75-e-ballon .balloon-serif:after {
    border-color: transparent transparent transparent #ffea76;	/* 右三角線 */
}

/*吹き出し「green」色変更-背景*/
.balloon-left.balloon-bg-green .balloon-content, .balloon-left.has-d-1-f-8-c-2-bgballon .balloon-content {
    background: #f5fced;
}
.balloon-right.balloon-bg-green .balloon-content, .balloon-right.has-d-1-f-8-c-2-bgballon .balloon-content {
    background: #f5fced;
}
.balloon-left.balloon-bg-green .balloon-serif:before, .balloon-left.has-d-1-f-8-c-2-bgballon .balloon-serif:before {
    border-color: transparent #f5fced transparent transparent ;	/* 左三角背景 */
}
.balloon-right.balloon-bg-green .balloon-serif:before, .balloon-right.has-d-1-f-8-c-2-bgballon .balloon-serif:before {
    border-color: transparent transparent transparent #f5fced;	/* 右三角背景 */
}


/*吹き出し「green」色変更-線*/
.balloon-left.balloon-green .balloon-content, .balloon-left.has-9-ddd-93-ballon .balloon-content {
 border-color: #cadf9d;
 }
.balloon-right.balloon-green .balloon-content, .balloon-right.has-9-ddd-93-ballon .balloon-content {
    border-color: #cadf9d;
}
.balloon-left.balloon-green .balloon-serif:after, .balloon-left.has-9-ddd-93-ballon .balloon-serif:after {
    border-color: transparent #cadf9d transparent transparent;	/* 左三角線 */
}
.balloon-right.balloon-green .balloon-serif:after, .balloon-right.has-9-ddd-93-ballon .balloon-serif:after {
}    border-color: transparent #cadf9d transparent transparent;	/* 左三角線 */
}
.balloon-right.balloon-green .balloon-serif:after, .balloon-right.has-9-ddd-93-ballon .balloon-serif:after {
    border-color: transparent transparent transparent #cadf9d;	/* 右三角線 */
}

/*吹き出し「blue」色変更-背景*/
.balloon-left.balloon-bg-blue .balloon-content, .balloon-left.has-e-2-f-6-ff-bgballon .balloon-content {
    background: #f9f8ff;	/* 左背景 */
}
.balloon-right.balloon-bg-blue .balloon-content, .balloon-right.has-e-2-f-6-ff-bgballon .balloon-content {
    background: #f9f8ff;	/* 右背景 */
}
.balloon-left.balloon-bg-blue .balloon-serif:before, .balloon-left.has-e-2-f-6-ff-bgballon .balloon-serif:before {
    border-color: transparent #f9f8ff transparent transparent;	/* 左三角背景 */
}
.balloon-right.balloon-bg-blue .balloon-serif:before, .balloon-right.has-e-2-f-6-ff-bgballon .balloon-serif:before {
    border-color: transparent transparent transparent #f9f8ff;	/* 右三角背景 */
}

/*吹き出し「blue」色変更-線*/
.balloon-left.balloon-blue .balloon-content, .balloon-left.has-93-d-2-f-0-ballon .balloon-content {
    border-color: #c3c5e3;   /* 左線 */
}
.balloon-right.balloon-blue .balloon-content, .balloon-right.has-93-d-2-f-0-ballon .balloon-content {
    border-color: #c3c5e3;   /* 右線 */
}
.balloon-left.balloon-blue .balloon-serif:after, .balloon-left.has-93-d-2-f-0-ballon .balloon-serif:after {
    border-color: transparent #c3c5e3 transparent transparent;   /* 左三角線 */
}
.balloon-right.balloon-blue .balloon-serif:after, .balloon-right.has-93-d-2-f-0-ballon .balloon-serif:after {
    border-color: transparent transparent transparent #c3c5e3;   /* 右三角線 */
550600

redはこの色

550600

yellowはこの色

550600

greenはこの色

550600

blueはこの色

以上です。