content-front-page.php 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <?php
  2. /**
  3. * Displays content for front page
  4. *
  5. * @package WordPress
  6. * @subpackage Twenty_Seventeen
  7. * @since 1.0
  8. * @version 1.0
  9. */
  10. ?>
  11. <article id="post-<?php the_ID(); ?>" <?php post_class( 'twentyseventeen-panel ' ); ?> >
  12. <?php
  13. if ( has_post_thumbnail() ) :
  14. $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'twentyseventeen-featured-image' );
  15. // Calculate aspect ratio: h / w * 100%.
  16. $ratio = $thumbnail[2] / $thumbnail[1] * 100;
  17. ?>
  18. <div class="panel-image" style="background-image: url(<?php echo esc_url( $thumbnail[0] ); ?>);">
  19. <div class="panel-image-prop" style="padding-top: <?php echo esc_attr( $ratio ); ?>%"></div>
  20. </div><!-- .panel-image -->
  21. <?php endif; ?>
  22. <div class="panel-content">
  23. <div class="wrap">
  24. <header class="entry-header">
  25. <?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
  26. <?php twentyseventeen_edit_link( get_the_ID() ); ?>
  27. </header><!-- .entry-header -->
  28. <div class="entry-content">
  29. <?php
  30. the_content(
  31. sprintf(
  32. /* translators: %s: Post title. */
  33. __( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentyseventeen' ),
  34. get_the_title()
  35. )
  36. );
  37. ?>
  38. </div><!-- .entry-content -->
  39. </div><!-- .wrap -->
  40. </div><!-- .panel-content -->
  41. </article><!-- #post-<?php the_ID(); ?> -->