[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Twenty Seventeen Theme: Block Patterns
   4   *
   5   * @package WordPress
   6   * @subpackage Twenty_Seventeen
   7   * @since Twenty Seventeen 2.5
   8   */
   9  
  10  /**
  11   * Register Block Pattern Category.
  12   */
  13  if ( function_exists( 'register_block_pattern_category' ) ) {
  14  
  15      register_block_pattern_category(
  16          'twentyseventeen',
  17          array( 'label' => __( 'Twenty Seventeen', 'twentyseventeen' ) )
  18      );
  19  }
  20  
  21  /**
  22   * Register Block Patterns.
  23   */
  24  if ( function_exists( 'register_block_pattern' ) ) {
  25      register_block_pattern(
  26          'twentyseventeen/large-heading-with-button',
  27          array(
  28              'title'      => __( 'Large Heading with Button', 'twentyseventeen' ),
  29              'categories' => array( 'twentyseventeen' ),
  30              'content'    => '<!-- wp:heading {"level":1,"textColor":"black","style":{"typography":{"fontSize":50}}} -->
  31              <h1 class="has-black-color has-text-color" style="font-size:50px">' . __( 'Attract Leads with Marketing Campaigns that Work', 'twentyseventeen' ) . '</h1>
  32              <!-- /wp:heading -->
  33  
  34              <!-- wp:buttons -->
  35              <div class="wp-block-buttons"><!-- wp:button {"borderRadius":0,"className":"is-style-fill"} -->
  36              <div class="wp-block-button is-style-fill"><a class="wp-block-button__link no-border-radius">' . __( 'Our Services', 'twentyseventeen' ) . '</a></div>
  37              <!-- /wp:button --></div>
  38              <!-- /wp:buttons -->',
  39          )
  40      );
  41  
  42      register_block_pattern(
  43          'twentyseventeen/images-with-text-and-link',
  44          array(
  45              'title'      => __( 'Images with Text and Link', 'twentyseventeen' ),
  46              'categories' => array( 'twentyseventeen' ),
  47              'content'    => '<!-- wp:spacer -->
  48              <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
  49              <!-- /wp:spacer -->
  50              <!-- wp:columns -->
  51              <div class="wp-block-columns"><!-- wp:column -->
  52              <div class="wp-block-column">
  53              <!-- wp:image {"className":"size-large"} -->
  54              <figure class="wp-block-image size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/stripes.jpg" alt="' . __( 'Black Stripes', 'twentyseventeen' ) . '"/></figure>
  55              <!-- /wp:image -->
  56              <!-- wp:heading {"textColor":"black","style":{"typography":{"fontSize":45}}} -->
  57              <h2 class="has-black-color has-text-color" style="font-size:45px">' . __( 'Branding', 'twentyseventeen' ) . '</h2>
  58              <!-- /wp:heading -->
  59              <!-- wp:paragraph {"textColor":"black","style":{"typography":{"lineHeight":"1.8"}}} -->
  60              <p class="has-black-color has-text-color" style="line-height:1.8">' . __( 'Communicate your purpose and goals with a beautiful logo that encapsulates your business.', 'twentyseventeen' ) . '</p>
  61              <!-- /wp:paragraph -->
  62              <!-- wp:paragraph {"style":{"typography":{"lineHeight":"3"}}} -->
  63              <p style="line-height:3"><a href="#"><strong>' . __( 'See Case Study', 'twentyseventeen' ) . ' →</strong></a></p>
  64              <!-- /wp:paragraph --></div>
  65              <!-- /wp:column -->
  66              <!-- wp:column -->
  67              <div class="wp-block-column"><!-- wp:spacer {"height":254} -->
  68              <div style="height:254px" aria-hidden="true" class="wp-block-spacer"></div>
  69              <!-- /wp:spacer -->
  70              <!-- wp:image {"className":"size-large"} -->
  71              <figure class="wp-block-image size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/white-border.jpg" alt="' . __( 'White border', 'twentyseventeen' ) . '"/></figure>
  72              <!-- /wp:image -->
  73              <!-- wp:heading {"textColor":"black","style":{"typography":{"fontSize":45}}} -->
  74              <h2 class="has-black-color has-text-color" style="font-size:45px">' . __( 'Web Design', 'twentyseventeen' ) . '</h2>
  75              <!-- /wp:heading -->
  76              <!-- wp:paragraph {"textColor":"black","style":{"typography":{"lineHeight":"1.8"}}} -->
  77              <p class="has-black-color has-text-color" style="line-height:1.8">' . __( 'Need a website? We&#39;ve got you covered. Our design team will create a stunning design to transform your brand.', 'twentyseventeen' ) . '</p>
  78              <!-- /wp:paragraph -->
  79              <!-- wp:paragraph {"style":{"typography":{"lineHeight":"3.0"}}} -->
  80              <p style="line-height:3.0"><a href="#"><strong>' . __( 'See Case Study', 'twentyseventeen' ) . ' →</strong></a></p>
  81              <!-- /wp:paragraph --></div>
  82              <!-- /wp:column --></div>
  83              <!-- /wp:columns -->',
  84          )
  85      );
  86  
  87      register_block_pattern(
  88          'twentyseventeen/images-with-link',
  89          array(
  90              'title'      => __( 'Images with Link', 'twentyseventeen' ),
  91              'categories' => array( 'twentyseventeen' ),
  92              'content'    => '<!-- wp:spacer -->
  93              <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
  94              <!-- /wp:spacer -->
  95              <!-- wp:columns {"verticalAlignment":"top"} -->
  96              <div class="wp-block-columns are-vertically-aligned-top"><!-- wp:column -->
  97              <div class="wp-block-column"><!-- wp:group -->
  98              <div class="wp-block-group"><div class="wp-block-group__inner-container">
  99              <!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
 100              <div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/stripes.jpg" alt="' . __( 'Black Stripes', 'twentyseventeen' ) . '"/></figure></div>
 101              <!-- /wp:image -->
 102              <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
 103              <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Branding', 'twentyseventeen' ) . '</h2>
 104              <!-- /wp:heading -->
 105              <!-- wp:paragraph {"align":"left"} -->
 106              <p class="has-text-align-left"><a href="#">' . __( 'See Case Study', 'twentyseventeen' ) . ' →</a></p>
 107              <!-- /wp:paragraph --></div></div>
 108              <!-- /wp:group --></div>
 109              <!-- /wp:column -->
 110              <!-- wp:column -->
 111              <div class="wp-block-column"><!-- wp:group -->
 112              <div class="wp-block-group"><div class="wp-block-group__inner-container">
 113              <!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
 114              <div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/white-border.jpg" alt="' . __( 'White border', 'twentyseventeen' ) . '"/></figure></div>
 115              <!-- /wp:image -->
 116              <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
 117              <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Design', 'twentyseventeen' ) . '</h2>
 118              <!-- /wp:heading -->
 119              <!-- wp:paragraph {"align":"left"} -->
 120              <p class="has-text-align-left"><a href="#">' . __( 'See Case Study', 'twentyseventeen' ) . ' →</a></p>
 121              <!-- /wp:paragraph --></div></div>
 122              <!-- /wp:group --></div>
 123              <!-- /wp:column -->
 124              <!-- wp:column -->
 125              <div class="wp-block-column"><!-- wp:group -->
 126              <div class="wp-block-group"><div class="wp-block-group__inner-container">
 127              <!-- wp:image {"align":"center","sizeSlug":"large","className":"is-style-default"} -->
 128              <div class="wp-block-image is-style-default"><figure class="aligncenter size-large"><img src="' . esc_url( get_template_directory_uri() ) . '/assets/images/direct-light.jpg" alt="' . __( 'Direct Light', 'twentyseventeen' ) . '"/></figure></div>
 129              <!-- /wp:image -->
 130              <!-- wp:heading {"align":"left","textColor":"black","style":{"typography":{"fontSize":30}}} -->
 131              <h2 class="has-text-align-left has-black-color has-text-color" style="font-size:30px">' . __( 'Strategy', 'twentyseventeen' ) . '</h2>
 132              <!-- /wp:heading -->
 133              <!-- wp:paragraph {"align":"left"} -->
 134              <p class="has-text-align-left"><a href="#">' . __( 'See Case Study', 'twentyseventeen' ) . ' →</a></p>
 135              <!-- /wp:paragraph --></div></div>
 136              <!-- /wp:group --></div>
 137              <!-- /wp:column --></div>
 138              <!-- /wp:columns -->
 139              <!-- wp:spacer -->
 140              <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
 141              <!-- /wp:spacer -->',
 142          )
 143      );
 144  
 145      register_block_pattern(
 146          'twentyseventeen/services',
 147          array(
 148              'title'      => __( 'Services', 'twentyseventeen' ),
 149              'categories' => array( 'twentyseventeen' ),
 150              'content'    => '<!-- wp:spacer -->
 151              <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
 152              <!-- /wp:spacer -->
 153              
 154              <!-- wp:heading {"level":1,"style":{"typography":{"fontSize":50}}} -->
 155              <h1 style="font-size:50px">' . __( 'Our Services', 'twentyseventeen' ) . '</h1>
 156              <!-- /wp:heading -->
 157              
 158              <!-- wp:columns -->
 159              <div class="wp-block-columns"><!-- wp:column -->
 160              <div class="wp-block-column">
 161              <!-- wp:paragraph {"style":{"typography":{"fontSize":21, "lineHeight":"2.5"}}} -->
 162              <p style="font-size:21px"><a href="#">' . __( 'Branding', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Web Design', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Web Development', 'twentyseventeen' ) . ' →</a></p>
 163              <!-- /wp:paragraph -->
 164              </div>
 165              <!-- /wp:column -->
 166              
 167              <!-- wp:column -->
 168              <div class="wp-block-column">
 169              <!-- wp:paragraph {"style":{"typography":{"fontSize":21, "lineHeight":"2.5"}}} -->
 170              <p style="font-size:21px"><a href="#">' . __( 'Content Strategy', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Marketing &amp; SEO', 'twentyseventeen' ) . ' →</a><br><a href="#">' . __( 'Video Production', 'twentyseventeen' ) . ' →</a></p>
 171              <!-- /wp:paragraph --></div>
 172              <!-- /wp:column --></div>
 173              <!-- /wp:columns -->
 174              
 175              <!-- wp:spacer -->
 176              <div style="height:100px" aria-hidden="true" class="wp-block-spacer"></div>
 177              <!-- /wp:spacer -->',
 178          )
 179      );
 180  
 181      register_block_pattern(
 182          'twentyseventeen/contact-us',
 183          array(
 184              'title'      => __( 'Contact Us', 'twentyseventeen' ),
 185              'categories' => array( 'twentyseventeen' ),
 186              'content'    => '<!-- wp:cover {"customOverlayColor":"#93aab8","minHeight":700,"align":"center"} -->
 187              <div class="wp-block-cover aligncenter has-background-dim" style="background-color:#93aab8;min-height:700px"><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"left","textColor":"white","style":{"typography":{"fontSize":50}}} -->
 188              <p class="has-text-align-left has-white-color has-text-color" style="font-size:50px">' . __( 'We are proud to serve outstanding clients.', 'twentyseventeen' ) . '</p>
 189              <!-- /wp:paragraph -->
 190              
 191              <!-- wp:buttons -->
 192              <div class="wp-block-buttons"><!-- wp:button {"borderRadius":0,"backgroundColor":"black","textColor":"white","className":"is-style-fill"} -->
 193              <div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-white-color has-black-background-color has-text-color has-background no-border-radius">' . __( 'Contact us', 'twentyseventeen' ) . '</a></div>
 194              <!-- /wp:button --></div>
 195              <!-- /wp:buttons --></div></div>
 196              <!-- /wp:cover -->',
 197          )
 198      );
 199  }