chekle

select{
  font-size:22px;
  font-size: 2.2rem;
  font-size: clamp(1.8rem, 6vw, 2.2rem);
  padding:5px 15px;
  display: block;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48IS0tISBGb250IEF3ZXNvbWUgUHJvIDYuNC4wIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlIChDb21tZXJjaWFsIExpY2Vuc2UpIENvcHlyaWdodCAyMDIzIEZvbnRpY29ucywgSW5jLiAtLT48cGF0aCBkPSJNMjM5IDQwMWM5LjQgOS40IDI0LjYgOS40IDMzLjkgMEw0NjUgMjA5YzkuNC05LjQgOS40LTI0LjYgMC0zMy45cy0yNC42LTkuNC0zMy45IDBsLTE3NSAxNzVMODEgMTc1Yy05LjQtOS40LTI0LjYtOS40LTMzLjkgMHMtOS40IDI0LjYgMCAzMy45TDIzOSA0MDF6IiBmaWxsPSIjZmZmZmZmIi8+PC9zdmc+');

chekle

<?php $args = array(
    'post_type' => 'post',
    'orderby' => 'menu_order',
    'order' => 'ASC',
    'posts_per_page' => 3,
);
$query = new WP_Query( $args ); ?>

<?php if ( $query->have_posts() ) { ?>

chekle

style="background-image:url('<?php $image = get_sub_field('image'); $size = 'full'; if( $image ) { echo wp_get_attachment_image_url( $image, $size ); } ?>');"

style="background-image: linear-gradient(269.77deg, rgba(0, 0, 0, 0.2) 2.1%, rgba(0, 0, 0, 0.6) 100%), url(<?php $image = get_sub_field('background_image'); $size = 'full'; if( $image ) { echo wp_get_attachment_image_url( $image, $size ); } ?>);"



/* Background Images CSS */
background-image:url(images/image.jpg);
background-repeat: no-repeat;
background-size:cover;

chekle

aspect-ratio: 16 / 9;

.image{
  aspect-ratio: 16 / 11;
  background-repeat: no-repeat;
  background-size:contain;
  background-position:center;
}

This essentially makes a background image work proportionally across responsive/different screen sizes without having to set the height at each different breakpoint.

chekle

<?php $link = get_sub_field('link'); if( $link ): $link_url = $link['url']; $link_title = $link['title']; $link_target = $link['target'] ? $link['target'] : '_self'; ?>
  <a class="button" href="<?php echo esc_url( $link_url ); ?>" target="<?php echo esc_attr( $link_target ); ?>"><?php echo esc_html( $link_title ); ?></a>
<?php endif; ?>

chekle

URL
<?php $image = get_sub_field('image'); $size = 'medium'; if( $image ) { echo wp_get_attachment_image_url( $image, $size ); } ?>

IMG
<?php $image = get_sub_field('image'); $size = 'full'; if( $image ) { echo wp_get_attachment_image( $image, $size ); } ?>

IMG w Class
<?php $image = get_sub_field('image'); $size = 'full'; if( $image ) { echo wp_get_attachment_image( $image, $size, "", array ('class' => 'rounded-4 mb-4' ) ); } ?>

FIGURE / IMG

chekle

font-size: 48px;
font-size: 4.8rem;
font-size: clamp(3.8rem, 6vw, 4.8rem);

chekle

/* ================== Custom colors swatches ======================== */
function my_mce4_options($init) {

  $custom_colours = '
      "496125", "Pounamu Green",
      "F4EDD4", "Whenua",
      "01AEF0", "Purū-pōuri",
      "305C7D", "Kōwhai",
      "EECE63", "Kōwhai 50%",
      "ADC6ED", "Ōrangitea",

chekle

// Enable featured images for blog posts

add_theme_support( 'post-thumbnails' );

// Enable for specific CPT or Events Calendar

add_theme_support( 'post-thumbnails', [ 
  'post', 
  'page',
  'tribe_events',

chekle

WORDPRESS DO SHORTCODE
<?php echo do_shortcode("[shortcode]"); ?>

SHORTCODE FROM ACF FIELD
<?php echo do_shortcode(get_field('social_stream_shortcode')); ?>

GFORMS
<?php echo do_shortcode("[gravityform id='1' title='false' description='false' ajax='true']"); ?>

[gravityform id="1" title="false" description="false" ajax="true"]