固定ページでのスタッフブロックについて

このトピックには1件の返信、2人の参加者があり、最後にDRILL LANCERにより4年、 7ヶ月前に更新されました。

2件の投稿を表示中 - 1 - 2件目 (全2件中)

投稿者

投稿

2020年4月14日 8:01 PM #36199

traveller

参加者

スタッフブロックを使用したいのですが、スマホで見ると、PCと同じレイアウトでかなり見にくいです。
スマホでは2カラムではなく、1カラム（スタッフ画像上／説明文下）などで表示されるような設定は出来ないでしょうか。

よろしくお願いいたします。

2020年4月15日 2:29 AM #36206

DRILL LANCER

モデレーター

急場しのぎ用の CSS の例としては下記が挙げられます。

/* VK Blocks のスタッフブロックのモバイル時の表示 */
.wp-block-vk-blocks-staff.vk_staff {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: flex-start;
}

.wp-block-vk-blocks-staff .vk_staff_text {
	float:none;
	order: 1;
	width: 100%
}

.wp-block-vk-blocks-staff .vk_staff_photo {
    float: none;
    order: 0;
    width: 50%;
}

@media (min-width: 576px) {
	.wp-block-vk-blocks-staff.vk_staff {
	    justify-content: space-between;
	}
	.wp-block-vk-blocks-staff .vk_staff_text {
		order: 0;
		width: 61.6%
	}

	.wp-block-vk-blocks-staff .vk_staff_photo {
	    order: 1;
	    width: 32%;
	    height: auto;
	}
	
}

上記をベースに色々調整してみてください。