【JIN】Rinker使用時に上部に余白が出来てしまう (Gutenberg)

余白について

Rinkerはとても便利なアフィリプラグインだが、GutenbergでJINのテーマを利用している場合、上部に多めの余白が出来てしまう。今回はこの余白を無くすようにCSSに追加する。

原因

これはJINが綺麗なレイアウトになるようにpaddingを調節しているからなのだが、GutenbergでRinkerを使用している場合、Rinker要素の上に<p>で以下のクラスが挿入される。

<p class="wp-block-rinkerg-gutenberg-rinker gutenberg-yyi-rinkernone"></p>

この要素はRinkerの作り上自動挿入されるが、JINは<p>要素すべてに「padding-bottom:2rem」を追加するように作られているため、Rinkerの前には自動的に広めの余白となってしまう。

挿入場所

コードはCSSのため、例の如く「style.css」の中だ。以下の追加方法がある。

• テーマエディター>Style.css
• カスタマイズ>追加CSS

コード

JINの<p>のCSSを無効にすると、色々レイアウトが崩れてしまうため、今回はRinkerのみにJINのpadding-bottomを無効にする。コピペ可能。

/* rinker調節 */
.wp-block-rinkerg-gutenberg-rinker{
	padding:0px !important
}