スマホ・タブレットとパソコンのテーブルを条件分岐で表示

<?php if ( wp_is_mobile() ) : ?>
  // ここにスマホ・タブレットで表示させたい内容
<?php else: ?>
  // ここにPC（モバイル端末以外）で表示させたい内容
<?php endif; ?>

この中に必要なテーブルを分けて書きます。

今回の場合はテーブルの中の画像サイズも分けたいです。

カスタムフィールドテンプレートで[ranking_gazo-1]の入力欄を作っておきます。

[ranking_gazo-1]
type = file
mediaButton = true
mediaLibrary = true
output = true
label =ランキング１位キャプチャー画像

それぞれのテーブルの表示させたい<td></td>に置いてやります。

スマホ・タブレットで表示させたい内容

<td <?php
//altとtitleを変更する
$args = array(
    'alt' => wp_kses($post->post_title, array()),
    'title' => false,
);
//サイズの定義
$size = array(500, 500);
//画像をHTMLで取得する
$postImg = wp_get_attachment_image(post_custom('ranking_gazo-1'), $size, false, $args);

if($postImg) { ?>
<figure class="postImg"><?php echo $postImg; ?></figure>
<p><?php echo $postImgSrc[0]; ?></p>
<?php } ?>
</td>

PCで表示させたい内容

<td <?php
//altとtitleを変更する
$args = array(
    'alt' => wp_kses($post->post_title, array()),
    'title' => false,
);
//サイズの定義
$size = array(200, 200);
//画像をHTMLで取得する
$postImg = wp_get_attachment_image(post_custom('ranking_gazo-1'), $size, false, $args);

if($postImg) { ?>
<figure class="postImg"><?php echo $postImg; ?></figure>
<p><?php echo $postImgSrc[0]; ?></p>
<?php } ?>
</td>

これで表示が分かれました。