『Advanced Custom Fields』各フィールドの出力用テンプレートサンプル

『Advanced Custom Fields』各フィールドの出力用テンプレートサンプル

<?php
/*
Template Name: カスタムフィールド出力用
*/
?>
<?php get_header(); ?>


    <style>
        .mb50{
            margin-bottom:50px;
        }
        .mb50 h2{
            margin-top:50px;
        }
        .mb50 h3{
            margin-top:50px;
            margin-bottom:25px;
        }
    </style>




    <div class="mb50">
    <h1>フィールドタイプ：基本</h1>
    <h3>/*テキスト-----------*/</h3>
    <?php if( get_field('text') ): ?>
        <?php the_field('text'); ?>
    <?php endif; ?>


    <h3>/*テキストエリア-----------*/</h3>
    <?php if( get_field('textarea') ): ?>
        <?php the_field('textarea'); ?>
    <?php endif; ?>

    <h3>/*数値-----------*/</h3>
    <?php if( get_field('number') ): ?>
        <?php the_field('number'); ?>
    <?php endif; ?>

    <h3>/*メール-----------*/</h3>
    <?php if( get_field('mail') ): ?>
        <?php the_field('mail'); ?>
    <?php endif; ?>

    <h3>/*パスワード-----------*/</h3>
    <?php if( get_field('password') ): ?>
        <?php the_field('password'); ?>
    <?php endif; ?>
    </div>







    <hr>





    <div class="mb50">
    <h1>フィールドタイプ：content</h1>

    <h3>/*Wysiwyg エディタ-----------*/</h3>
    <?php if( get_field('wysiwyg') ): ?>
        <?php the_field('wysiwyg'); ?>
    <?php endif; ?>

    <h3>/*画像（返り値が「画像ID」の場合）-----------*/</h3>
    <?php if( get_field('image_id') ): ?>
    <?php $thumb = wp_get_attachment_image_src( get_field('image_id') , 'full' ); //thumbnail, medium, large, full ?>
        <img src="<?php echo $thumb[0]; ?>" width="<?php echo $thumb[1]; ?>" height="<?php echo $thumb[2]; ?>" alt="">
    <?php endif; ?>

    <h3>/*画像（返り値が「画像URL」の場合）-----------*/</h3>
    <?php if( get_field('image_url') ): ?>
        <img src="<?php the_field('image_url'); ?>" alt="">
    <?php endif; ?>

    <h3>/*ファイル（返り値が「ファイルURL」の場合）-----------*/</h3>
    <?php if( get_field('file_url') ): ?>
        <a href="<?php the_field('file_url'); ?>" target="_blank">ファイル</a>
    <?php endif; ?>
    </div>





    <hr>





    <div class="mb50">
    <h1>フィールドタイプ：選択肢</h1>

    <h3>/*セレクトボックス-----------*/</h3>
    <?php if( get_field('selectbox') ): ?>
        セレクトボックス：<?php the_field('slectbox'); ?>
    <?php endif; ?>

    <h3>/*チェックボックス-----------*/</h3>
    <?php if( get_field('checkbox') ): ?>
        <ul>
        <?php $check = get_field('checkbox');
            foreach ( (array)$check as $value ): ?>
            <li>チェックボックス：<?php echo $value; ?></li>
        <?php endforeach; ?>
        </ul>
    <?php endif; ?>

    <h3>/*ラジオボタン-----------*/</h3>
    <?php if( get_field('radio') ): ?>
        ラジオボタン：<?php the_field('radio'); ?>
    <?php endif; ?>

    <h3>/*真/偽-----------*/</h3>
    <?php if( get_field('true_false') ): ?>
      true
    <?php else: ?>
        false
    <?php endif; ?>

    </div>





    <hr>





    <div class="mb50">
    <h1>フィールドタイプ：Relational</h1>

    <h3>/*ページリンク-----------*/</h3>
    <?php if( get_field('page_link') ): ?>
        <ul>
        <?php $relational = get_field('page_link');
            foreach ( (array)$relational as $value ): ?>
            <li>ページリンク：<a href="<?php echo $value; ?>"><?php echo $value; ?></a></li>
        <?php endforeach; ?>
        </ul>
    <?php endif; ?>

    <h3>/*投稿オブジェクト（複数の値を選択できるようにした場合）-----------*/</h3>
    <?php $post_objects = get_field('post_obj');?>
    <?php if( $post_objects ): ?>
        <?php foreach( $post_objects as $post): ?>
        <?php setup_postdata( $post );  ?>
        <div>
            <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
            <p><?php the_content(); ?></p>
        </div>
        <?php endforeach; ?>
        <?php wp_reset_postdata(); ?>
    <?php endif; ?>

    <h3>/*タクソノミー（返り値が「Term Object」の場合）-----------*/</h3>
    <?php if( get_field('taxonomy') ): ?>
      <?php $term = get_field('taxonomy'); ?>
        <p>タクソノミー：
        <?php   foreach ( (array)$term as $value ): ?>
            <a href="<?php echo get_bloginfo('url') . '/archives/category/' . $value->slug; ?>"><?php echo $value->name; ?></a>
            <?php if(next($term)!==FALSE){ echo ", ";} ?>
        <?php endforeach; ?>
        </p>
    <?php endif; ?>

    <h3>/*ユーザー（返り値が「セレクトボックス」の場合）-----------*/</h3>
    <?php if( get_field('user_selectbox') ): ?>
      <?php $user = get_field('user_selectbox'); ?>
        ユーザー：<?php echo $user['user_nicename']; ?>／ <?php echo $user['nickname']; ?>
    <?php endif; ?>

    <h3>/*ユーザー（返り値が「Multi Select」の場合）-----------*/</h3>
    <?php if( get_field('user_multi') ): ?>
      <?php $user = get_field('user_multi'); ?>
      <?php foreach ( (array)$user as $value ): ?>
            ユーザー：<?php echo $value['user_nicename']; ?>／ <?php echo $value['nickname']; ?>
            <?php if(next($user)!==FALSE){ echo ", ";} ?>
        <?php endforeach; ?>
    <?php endif; ?>

    </div>





    <hr>








    <div class="mb50">
    <h1>フィールドタイプ：jQuery</h1>

    <h3>/*Google Map(例：仙台駅　lat：38.260115　ing：140.882309)-----------*/</h3>
    <?php $location = get_field('google_map'); ?>
    <?php if( !empty($location) ): ?>
    <?php echo $location['address'].'<br>lat:'.$location['lat'].'<br>lng:'.$location['lng']."<br><br>"; ?>
    <iframe src="http://maps.google.co.jp/maps?q=<?php echo $location['address']; ?>&output=embed" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
    <?php endif; ?>

    <h3>/*デイトピッカー-----------*/</h3>
    <?php if( get_field('datepicker') ): ?>
        <?php the_field('datepicker'); ?>
    <?php endif; ?>

    <h3>/*カラーピッカー-----------*/</h3>
    <?php if( get_field('colorpicker') ): ?>
        <p style="background-color:<?php the_field('colorpicker'); ?>">カラーピッカー：<?php the_field('colorpicker'); ?></p>
    <?php endif; ?>

    </div>






    <hr>






    <div class="mb50">
    <h1>フィールドラベルを表示する方法 get_field_object()</h1>

    <?php if( get_field('colorpicker') ):
        $fielddata = get_field_object('colorpicker');
        echo esc_html($fielddata['label']);
    endif; ?>
    </div>






<?php get_footer(); ?>