ACF-Snippet installs statistics

Snippets for Visual Studio Code : Advanced Custom Fields

Same setup as smilledge/acf-sublime-snippets but for VSC.

Snippets

All tab triggers follow the following naming convention; field:{field type}:{type/option}. All fields also have appropriate tabstops setup, however the first will always be the field name.

Basic Fields

field / field:header / field:text / field:link / field:option (HTML/PHP)

Get a field by name. (Header / text / link fields will be wrapped in <h*> / <p> / <a> tags)

<?php if ( get_field('field_name') ) : ?>
  <?php echo get_field('field_name'); ?>
<?php endif; ?>

field:date (HTML/PHP)

Get and format a date field

<?php if ( get_field('field_name') ) : $date = DateTime::createFromFormat('Ymd', get_field('field_name')); ?>
  <?php echo $date->format('d-m-Y'); ?>
<?php endif; ?>

field:if / field:ifelse (HTML/PHP)

Field conditional. Also used for true/false fields.

<?php if ( get_field('field_name') ) : ?>
<?php endif; ?>

field:sub (HTML/PHP)

Get a field by name, within repeater/flexible.

<?php if ( get_sub_field('field_name') ) : ?>
  <?php echo get_sub_field('field_name'); ?>
<?php endif; ?>

Image Field

field:image (HTML/PHP)

Image field with a return value of "Image URL"

<?php if ( get_field('field_name') ) : ?>
    <img src="<?php the_field('field_name'); ?>" alt="<?php the_field(''); ?>">
<?php endif; ?>

field:image:id (HTML/PHP)

Image field with a return value of "Image ID"

<?php
if ( get_field('field_name') ) {
  $attachment_id = get_field('field_name');
  $size = "full"; // (thumbnail, medium, large, full or custom size)
  wp_get_attachment_image( $attachment_id, $size );
}
?>

field:image:object (HTML/PHP)

Image field with a return value of "Image Object"

<?php if ( get_field('field_name') ) : $image = get_field('field_name'); ?>

  <!-- Full size image -->
  <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>"/>

  <!-- Thumbnail image -->
  <img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>"/>

<?php endif; ?>

File Field

field:file (HTML/PHP)

File field with a return value of "File URL"

<?php if ( get_field('field_name') ) : ?>
  <a href="<?php the_field('field_name'); ?>" >Download File</a>
<?php endif; ?>

field:file:id (HTML/PHP)

File field with a return value of "File ID"

<?php
  if ( get_field('field_name') ) :
    $attachment_id = get_field('field_name');
    $url = wp_get_attachment_url( $attachment_id );
    $title = get_the_title( $attachment_id );
?>
  <a href="<?php echo $url; ?>" ><?php echo $title; ?></a>
<?php endif; ?>

field:file:object (HTML/PHP)

File field with a return value of "File Object"

<?php if ( get_field('field_name') ) : $file = get_field('field_name'); ?>
  <a href="<?php echo $file['url']; ?>"><?php echo $file['title']; ?></a>
<?php endif; ?>

Flexible Content Field

field:flex (HTML/PHP)

Flexible Content basic field returns 1 row deep:

<?php if ( have_rows( 'field_name' ) ) : ?>
    <?php while ( have_rows('field_name' ) ) : the_row();
        if ( get_row_layout() == 'layout_field' ) : ?>
            <div class="class">
                <?php the_sub_field( 'field_name' ); ?>
            </div>
        <?php endif; ?>
    <?php endwhile; ?>
<?php endif; ?>

field:flex:nested (HTML/PHP)

Flexible Content nested field returns the below:

<?php if( have_rows('field_name') ): ?>
    <?php while ( have_rows('field_name') ) : the_row(); ?>
        <?php if( get_row_layout() == 'layout_field' ): ?>
            <?php if( have_rows('layout_rows') ): ?>
                <ul>
                    <?php while ( have_rows('layout_rows') ) : the_row(); $image = get_sub_field('sub_field'); ?>
                        <li><img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" /></li>
                    <?php endwhile; ?>
                </ul>
            <?php endif; ?>
        <?php endif; ?>
    <?php endwhile; ?>
<?php endif; ?>

Relationship Field

field:relationship (HTML/PHP)

Get a relationship field and loop over all returned posts.

<?php $posts = get_field('field_name'); ?>
<?php if ( $posts ): ?>
  <ul>
    <?php foreach ( $posts as $post ) : setup_postdata( $post ); ?>
      <li>
        <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
      </li>
    <?php endforeach; wp_reset_postdata(); ?>
  </ul>
<?php endif; ?>

Location Field

field:location (HTML/PHP)

Get the street address from a location field

<?php if ( get_field('field_name') ) :
  $location = get_field('field_name'); ?>
  <?php echo $location['address']; ?>
<?php endif; ?>

field:location:staticmap (HTML/PHP)

Get a location field and convert it to a static Google Map…