備忘録 WordPress テーマ Lightning VK_PR ボーダーとマージン 修正

plugin 内 vk-all-in-one-expansion-unit/plugin/other_widge/widget-pr-blocks.php
190行目付近

// image display
} else if ( ! empty( $instance[ 'media_image_'.$i ] ) ) {
echo '<div class="prBlock_image">'.PHP_EOL;
echo '<img src="'.esc_url( $instance[ 'media_image_'.$i ] ).'" alt="'.esc_attr( $instance[ 'media_alt_'.$i ] ).'" />'.PHP_EOL.'</div><!--//.prBlock_image -->'.PHP_EOL;
}

ここを変更、
内部にdivを設置して、imgのクラスに

echo '<img src="'.esc_url( $instance[ 'media_image_'.$i ] ).'" alt="'.esc_attr( $instance[ 'media_alt_'.$i ] ).'" class=\"img-responsive\" />'.PHP_EOL.'</div><!--//.prBlock_image -->'.PHP_EOL;

class=\”img-responsive\” 追加

続けてボックスの高さをそろえる。

$instance = self::default_options($instance);
echo $args['before_widget'];
echo PHP_EOL.'<article class="veu_prBlocks prBlocks row row-eq-height">'.PHP_EOL;

CSSも追加

.row-eq-height {
    display: flex;
    flex-wrap: wrap;
}

@See http://qiita.com/chii/items/8e2d0d04d02f3fecebce

投稿者 kato

これはテスト画像ですよ。テストです。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA