<?php global $post, $post_count; $classes = array('masonry-element'); $classes[] = 'masonry-element-' . ($post_count + 1); if (is_front_page()) { $classes[] = 'home-project'; } $is_work_page = is_post_type_archive(project_cpt_name()); $classes[] = $is_work_page ? 'work-project' : ''; $has_thumb = false; if (has_post_thumbnail()) { $has_thumb = true; $thumb_id = get_post_thumbnail_id($post->ID); $thumb_data = wp_get_attachment_metadata($thumb_id); $w = $thumb_data['width']; $h = $thumb_data['height']; } ?> <div <?php post_class($classes); ?> style="<?php echo 'background-color:' . get_field('bg_color') . ';'; //echo "width:${w}px;height:${h}px;"; ?> " > <?php if ($has_thumb) { lazy_image(wp_get_attachment_url($thumb_id), $w, $h); ?>
function lazy_image($src = 0, $w = 0, $h = 0, $echo = true) { if (!$src || !$w || !$h) { return false; } ob_start(); if (is_post_type_archive(project_cpt_name())) { ?> <img class="work-archive-img" src="<?php echo $src; ?> " width="<?php echo $w; ?> " height="<?php echo $h; ?> "> <?php } else { ?> <img class="lazy" data-original="<?php echo $src; ?> " width="<?php echo $w; ?> " height="<?php echo $h; ?> "> <!-- <img class="lazyxt" data-src="<?php echo $src; ?> " data-effect="fadeIn" width="<?php echo $w; ?> " height="<?php echo $h; ?> "> --> <?php } $img = ob_get_clean(); if ($echo) { echo $img; } return $img; }
<?php _e('You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.', 'roots'); ?> </div> <![endif]--> <header class="" role="banner"> <h1><a href="<?php echo home_url(); ?> "><?php echo get_bloginfo('name'); ?> </a></h1> <nav role="navigation"> <div class="inner"> <?php if (has_nav_menu('primary_navigation')) { wp_nav_menu(array('theme_location' => 'primary_navigation', 'walker' => new Bolt_Nav_Walker(), 'menu_class' => 'nav navbar-nav', 'items_wrap' => '%3$s')); } ?> </div> <?php if (is_post_type_archive(project_cpt_name())) { ?> <a href="#" class="tags-toggle-btn pull-right">Tags</a> <?php } ?> </nav> </header>