WebのMemo|WordPress・Meta Box・HTML/CSS・Javascript・JQueryの制作Tips集「Meta Box」 出力コードまとめ

date posted:2025-8-15 / last up date:2026-6-9 wordpress Meta Box
Meta out

基本構文(投稿のカスタムフィールド)

<?php echo rwmb_meta( 'フィールドID' ); ?>

テキスト系(安全な出力の基本)

<?php
// テキスト
$title_sub = rwmb_get_value('title_sub');
if ( ! empty($title_sub) ) {
    echo '<p class="title-sub">' . esc_html($title_sub) . '</p>';
}

// URL
$link_url = rwmb_get_value('link_url');
if ( ! empty($link_url) ) {
    echo '<a class="btn" href="' . esc_url($link_url) . '">詳しく見る</a>';
}

// WYSIWYG(HTML許可)
$desc = rwmb_get_value('desc');
if ( ! empty($desc) ) {
    echo '<div class="desc">' . wp_kses_post($desc) . '</div>';
}

Group(クローン可)を素直に回す

空欄無し前提

<?php
$rows = rwmb_get_value( 'faq_group' ); // group: question, answer
if ( $rows ) : ?>
  <dl class="faq">
    <?php foreach ( $rows as $row ) : ?>
      <div class="faq__item">
        <dt class="faq__q"><?php echo esc_html( $row['question'] ); ?></dt>
        <dd class="faq__a"><?php echo wp_kses_post( $row['answer'] ); ?></dd>
      </div>
    <?php endforeach; ?>
  </dl>
<?php endif; ?>

空欄あり対応版

<?php
$rows = rwmb_get_value('faq_group'); // group: question, answer
if ( ! empty($rows) && is_array($rows) ) : ?>
  <dl class="faq">
    <?php foreach ( $rows as $row ) : ?>
      <?php
      $q = '';
      $a = '';
      if ( isset($row['question']) ) {
          $q = $row['question'];
      }
      if ( isset($row['answer']) ) {
          $a = $row['answer'];
      }
      if ( ! empty($q) || ! empty($a) ) : ?>
        <div class="faq__item">
          <?php if ( ! empty($q) ) : ?>
            <dt class="faq__q"><?php echo esc_html($q); ?></dt>
          <?php endif; ?>
          <?php if ( ! empty($a) ) : ?>
            <dd class="faq__a"><?php echo wp_kses_post($a); ?></dd>
          <?php endif; ?>
        </div>
      <?php endif; ?>
    <?php endforeach; ?>
  </dl>
<?php endif; ?>

クローン要素を逆順に表示する

<?php
$groups = rwmb_meta( 'your_group_id' );
if ( ! empty( $groups ) && is_array( $groups ) ) :
    foreach ( array_reverse( $groups ) as $group ) :
?>
    <div class="item">
        <h4><?php echo esc_html( $group['title'] ?? '' ); ?></h4>
        <p><?php echo nl2br( esc_html( $group['desc'] ?? '' ) ); ?></p>
    </div>
<?php
    endforeach;
endif;
?>

関連投稿(relationship)を取得してループ

<?php
$post_ids = rwmb_meta( 'relationPost' );

if ( ! empty( $post_ids ) ) :
?>
	<ul class="related-posts">
	<?php foreach ( $post_ids as $post_id ) : ?>
			<li>
				<a href="<?php echo esc_url( get_permalink( $post_id ) ); ?>">
					<div class="imgBox">
						<div class="img">
							<?php if ( has_post_thumbnail( $post_id ) ) : ?>
								<?php echo get_the_post_thumbnail( $post_id ); ?>
							<?php else : ?>
								<img src="<?php echo esc_url( get_template_directory_uri() . '/common/images/noimage.png' ); ?>" width="1000" height="650" alt="" />
							<?php endif; ?>
						</div>
					</div>

					<div class="txtBox">
						<div class="sub">
							<span class="date"><?php echo esc_html( get_the_date( 'Y.n.j', $post_id ) ); ?></span>

							<?php
							$cats = get_the_category( $post_id );
							if ( ! empty( $cats ) ) :
								foreach ( $cats as $cat ) :
							?>
									<span class="cat"><?php echo esc_html( $cat->name ); ?></span>
							<?php
								endforeach;
							endif;
							?>
						</div>

						<p><?php echo esc_html( get_the_title( $post_id ) ); ?></p>
					</div>
				</a>
			</li>
	<?php endforeach; ?>
	</ul>
<?php endif; ?>

タームメタ(Term Meta Box)の読み取り

<?php
// タームページ内でタームIDを取得して読む例
$term = get_queried_object();
if ( isset($term->term_id) ) {
    $term_id = (int) $term->term_id;
    $note = rwmb_get_term_meta($term_id, 'term_note', ['object_type' => 'term']);

    if ( ! empty($note) ) {
        echo '<div class="term-note">' . wp_kses_post($note) . '</div>';
    }
}

ショートコードを出力したい場合

<?php echo do_shortcode( rwmb_meta( 'フィールドID' ) ); ?>

値が存在する時だけ表示させたい場合

<?php
  $value = rwmb_meta( 'value' );
  if ( ! empty( $value ) ) :
?>
  <?php echo $value; ?>
<?php endif; ?>

掲載しているコードや設定例は動作を保証するものではありません。
利用は自己責任で行い、必ずテスト環境での確認を行ってください。