Layers_Content_Widget

The Layers Layers Content Widget class.

Defined (1)

The class is defined in the following location(s).

/core/widgets/modules/content.php  
  1. class Layers_Content_Widget extends Layers_Widget { 
  2.  
  3. /** 
  4. * Widget construction 
  5. */ 
  6. function __construct() { 
  7.  
  8. /** 
  9. * Widget variables 
  10. * @param string $widget_title Widget title 
  11. * @param string $widget_id Widget slug for use as an ID/classname 
  12. * @param string $post_type (optional) Post type for use in widget options 
  13. * @param string $taxonomy (optional) Taxonomy slug for use as an ID/classname 
  14. * @param array $checkboxes (optional) Array of checkbox names to be saved in this widget. Don't forget these please! 
  15. */ 
  16. $this->widget_title = __( 'Content' , 'layerswp' ); 
  17. $this->widget_id = 'column'; 
  18. $this->post_type = ''; 
  19. $this->taxonomy = ''; 
  20. $this->checkboxes = array(); 
  21.  
  22. /** Widget settings. */ 
  23. $widget_ops = array( 
  24. 'classname' => 'obox-layers-' . $this->widget_id .'-widget',  
  25. 'description' => __( 'This widget is used to display text and images in a flexible grid.', 'layerswp' ),  
  26. 'customize_selective_refresh' => TRUE,  
  27. ); 
  28.  
  29. /** Widget control settings. */ 
  30. $control_ops = array( 
  31. 'width' => LAYERS_WIDGET_WIDTH_LARGE,  
  32. 'height' => NULL,  
  33. 'id_base' => LAYERS_THEME_SLUG . '-widget-' . $this->widget_id,  
  34. ); 
  35.  
  36. /** Create the widget. */ 
  37. parent::__construct( 
  38. LAYERS_THEME_SLUG . '-widget-' . $this->widget_id ,  
  39. $this->widget_title,  
  40. $widget_ops,  
  41. $control_ops 
  42. ); 
  43.  
  44. /** Setup Widget Defaults */ 
  45. $this->defaults = array ( 
  46. 'title' => __( 'Our Services', 'layerswp' ),  
  47. 'excerpt' => __( 'Our services run deep and are backed by over ten years of experience.', 'layerswp' ),  
  48. 'design' => array( 
  49. 'layout' => 'layout-boxed',  
  50. 'liststyle' => 'list-grid',  
  51. 'gutter' => 'on',  
  52. 'background' => array( 
  53. 'position' => 'center',  
  54. 'repeat' => 'no-repeat' 
  55. ),  
  56. 'fonts' => array( 
  57. 'align' => 'text-left',  
  58. 'size' => 'medium',  
  59. 'color' => NULL,  
  60. 'shadow' => NULL,  
  61. 'heading-type' => 'h3',  
  62. ),  
  63. ); 
  64.  
  65. /** Setup Widget Repeater Defaults */ 
  66. $this->register_repeater_defaults( 'column', 3, array( 
  67. 'title' => __( 'Your service title', 'layerswp' ),  
  68. 'excerpt' => __( 'Give us a brief description of the service that you are promoting. Try keep it short so that it is easy for people to scan your page.', 'layerswp' ),  
  69. 'width' => '4',  
  70. 'design' => array( 
  71. 'featuredimage-size' => '',  
  72. 'imagealign' => 'image-top',  
  73. 'background' => NULL,  
  74. 'fonts' => array( 
  75. 'align' => 'text-left',  
  76. 'size' => 'medium',  
  77. 'color' => NULL,  
  78. 'shadow' => NULL,  
  79. 'heading-type' => 'h5',  
  80. ),  
  81. ),  
  82. ) ); 
  83.  
  84. /** 
  85. * Widget front end display 
  86. */ 
  87. function widget( $args, $instance ) { 
  88. global $wp_customize; 
  89.  
  90. $this->backup_inline_css(); 
  91.  
  92. // Turn $args array into variables. 
  93. extract( $args ); 
  94.  
  95. // Use defaults if $instance is empty. 
  96. if( empty( $instance ) && ! empty( $this->defaults ) ) { 
  97. $instance = wp_parse_args( $instance, $this->defaults ); 
  98.  
  99. // Mix in new/unset defaults on every instance load (NEW) 
  100. $instance = $this->apply_defaults( $instance ); 
  101.  
  102. // Enqueue Masonry if need be 
  103. if( 'list-masonry' == $this->check_and_return( $instance , 'design', 'liststyle' ) ) { 
  104. wp_enqueue_script( LAYERS_THEME_SLUG . '-layers-masonry-js' ); 
  105.  
  106. // Set the background styling 
  107. if( !empty( $instance['design'][ 'background' ] ) ) $this->inline_css .= layers_inline_styles( '#' . $widget_id, 'background', array( 'background' => $instance['design'][ 'background' ] ) ); 
  108. if( !empty( $instance['design']['fonts'][ 'color' ] ) ) $this->inline_css .= layers_inline_styles( '#' . $widget_id, 'color', array( 'selectors' => array( '.section-title .heading' , '.section-title div.excerpt' ) , 'color' => $instance['design']['fonts'][ 'color' ] ) ); 
  109.  
  110. // Apply the advanced widget styling 
  111. $this->apply_widget_advanced_styling( $widget_id, $instance ); 
  112.  
  113. /** 
  114. * Generate the widget container class 
  115. */ 
  116. $widget_container_class = array(); 
  117. $widget_container_class[] = 'widget'; 
  118. $widget_container_class[] = 'layers-content-widget'; 
  119. $widget_container_class[] = 'content-vertical-massive'; 
  120. $widget_container_class[] = ( 'on' == $this->check_and_return( $instance , 'design', 'background', 'darken' ) ? 'darken' : '' ); 
  121. $widget_container_class[] = $this->check_and_return( $instance , 'design', 'advanced', 'customclass' ); // Apply custom class from design-bar's advanced control. 
  122. $widget_container_class[] = $this->get_widget_spacing_class( $instance ); 
  123.  
  124. $widget_container_class = apply_filters( 'layers_content_widget_container_class' , $widget_container_class, $this, $instance ); 
  125. $widget_container_class = implode( ' ', $widget_container_class ); 
  126.  
  127. // Custom Anchor 
  128. echo $this->custom_anchor( $instance ); ?> 
  129.  
  130. <div id="<?php echo esc_attr( $widget_id ); ?>" class="<?php echo esc_attr( $widget_container_class ); ?>" <?php $this->selective_refresh_atts( $args ); ?>> 
  131.  
  132. <?php do_action( 'layers_before_content_widget_inner', $this, $instance ); ?> 
  133.  
  134. <?php if ( NULL !== $this->check_and_return( $instance , 'title' ) || NULL !== $this->check_and_return( $instance , 'excerpt' ) ) { ?> 
  135.  
  136. <div class="container clearfix"> 
  137. <?php 
  138. /** 
  139. * Generate the Section Title Classes 
  140. */ 
  141. $section_title_class = array(); 
  142. $section_title_class[] = 'section-title clearfix'; 
  143. $section_title_class[] = $this->check_and_return( $instance , 'design', 'fonts', 'size' ); 
  144. $section_title_class[] = $this->check_and_return( $instance , 'design', 'fonts', 'align' ); 
  145. $section_title_class[] = ( $this->check_and_return( $instance, 'design', 'background' , 'color' ) && 'dark' == layers_is_light_or_dark( $this->check_and_return( $instance, 'design', 'background' , 'color' ) ) ? 'invert' : '' ); 
  146. $section_title_class = implode( ' ', $section_title_class ); 
  147. ?> 
  148. <div class="<?php echo $section_title_class; ?>"> 
  149. <?php if( '' != $this->check_and_return( $instance, 'title' ) ) { ?> 
  150. <<?php echo $this->check_and_return( $instance, 'design', 'fonts', 'heading-type' ); ?> class="heading"> 
  151. <?php echo $instance['title'] ?> 
  152. </<?php echo $this->check_and_return( $instance, 'design', 'fonts', 'heading-type' ); ?>> 
  153. <?php } ?> 
  154. <?php if( '' != $this->check_and_return( $instance, 'excerpt' ) ) { ?> 
  155. <div class="excerpt"><?php echo layers_the_content( $instance['excerpt'] ); ?></div> 
  156. <?php } ?> 
  157. </div> 
  158. </div> 
  159. <?php } ?> 
  160. <?php if ( ! empty( $instance[ 'columns' ] ) ) { 
  161.  
  162. $column_ids = explode( ', ', $instance[ 'column_ids' ] ); 
  163.  
  164. // Set total width 
  165. $col_no = 0; 
  166. $first_last_class = ''; 
  167. $row_width = 0; ?> 
  168. <div class="<?php echo $this->get_widget_layout_class( $instance ); ?> <?php echo $this->check_and_return( $instance , 'design', 'liststyle' ); ?>"> 
  169. <div class="grid"> 
  170. <?php foreach ( $column_ids as $column_key ) { 
  171.  
  172. // Make sure we've got a column going on here 
  173. if( !isset( $instance[ 'columns' ][ $column_key ] ) ) continue; 
  174.  
  175. // Setup Internal Vars. 
  176. $item_instance = $instance[ 'columns' ][ $column_key ]; 
  177. $item_id_attr = "{$widget_id}-tabs-{$column_key}"; 
  178.  
  179. // Mix in new/unset defaults on every instance load (NEW) 
  180. $item_instance = $this->apply_defaults( $item_instance, 'column' ); 
  181.  
  182. // Get the Next Column for use later. 
  183. if( isset( $column_ids[ ($col_no+1) ] ) && isset( $instance[ 'columns' ][ $column_ids[ ($col_no+1) ] ] ) ) { 
  184. $next_item = $instance[ 'columns' ][ $column_ids[ ($col_no+1) ] ]; 
  185.  
  186. // Set the background styling 
  187. if( !empty( $item_instance['design'][ 'background' ] ) ) $this->inline_css .= layers_inline_styles( '#' . $widget_id . '-' . $column_key , 'background', array( 'background' => $item_instance['design'][ 'background' ] ) ); 
  188. if( !empty( $item_instance['design']['fonts'][ 'color' ] ) ) $this->inline_css .= layers_inline_styles( '#' . $widget_id . '-' . $column_key , 'color', array( 'selectors' => array( '.heading a', '.heading' , 'div.excerpt' , 'div.excerpt p' ) , 'color' => $item_instance['design']['fonts'][ 'color' ] ) ); 
  189. if( !empty( $item_instance['design']['fonts'][ 'shadow' ] ) ) $this->inline_css .= layers_inline_styles( '#' . $widget_id . '-' . $column_key , 'text-shadow', array( 'selectors' => array( '.heading a', '.heading' , 'div.excerpt' , 'div.excerpt p' ) , 'text-shadow' => $item_instance['design']['fonts'][ 'shadow' ] ) ); 
  190.  
  191. // Set column margin & padding 
  192. if ( !empty( $item_instance['design']['advanced']['margin'] ) ) $this->inline_css .= layers_inline_styles( "#{$widget_id}-{$column_key}", 'margin', array( 'margin' => $item_instance['design']['advanced']['margin'] ) ); 
  193. if ( !empty( $item_instance['design']['advanced']['padding'] ) ) $this->inline_css .= layers_inline_styles( "#{$widget_id}-{$column_key}", 'padding', array( 'padding' => $item_instance['design']['advanced']['padding'] ) ); 
  194.  
  195. if( !isset( $item_instance[ 'width' ] ) ) $item_instance[ 'width' ] = $this->column_defaults[ 'width' ]; 
  196.  
  197. // Set the button styling 
  198. $button_size = ''; 
  199. if ( function_exists( 'layers_pro_apply_widget_button_styling' ) ) { 
  200. $this->inline_css .= layers_pro_apply_widget_button_styling( $this, $item_instance, array( "#{$widget_id}-{$column_key} .button" ) ); 
  201. $button_size = $this->check_and_return( $item_instance , 'design' , 'buttons-size' ) ? 'btn-' . $this->check_and_return( $item_instance , 'design' , 'buttons-size' ) : '' ; 
  202.  
  203. // Add the correct span class 
  204. $span_class = 'span-' . $item_instance[ 'width' ]; 
  205.  
  206. $col_no++; 
  207. $max = 12; 
  208. $initial_width = $row_width; 
  209. $item_width = $item_instance[ 'width' ]; 
  210. $next_item_width = ( isset( $next_item[ 'width' ] ) ? $next_item[ 'width' ] : 0 ); 
  211. $row_width += $item_width; 
  212.  
  213. if( $max == $row_width ) { 
  214. $first_last_class = 'last'; 
  215. $row_width = 0; 
  216. } elseif( $max < $next_item_width + $row_width ) { 
  217. $first_last_class = 'last'; 
  218. $row_width = 0; 
  219. } elseif( 0 == $initial_width ) { 
  220. $first_last_class = 'first'; 
  221. } else { 
  222. $first_last_class = ''; 
  223.  
  224. // Set Featured Media 
  225. $featureimage = $this->check_and_return( $item_instance , 'design' , 'featuredimage' ); 
  226. $featurevideo = $this->check_and_return( $item_instance , 'design' , 'featuredvideo' ); 
  227.  
  228. // Calculate which cut based on ratio. 
  229. if( isset( $item_instance['design'][ 'imageratios' ] ) ) { 
  230.  
  231. // Translate Image Ratio into something usable 
  232. $image_ratio = layers_translate_image_ratios( $item_instance['design'][ 'imageratios' ] ); 
  233.  
  234. if( !isset( $item_instance[ 'width' ] ) ) $item_instance[ 'width' ] = 6; 
  235.  
  236. if( 4 >= $item_instance['width'] && 'layout-fullwidth' != $this->check_and_return( $instance, 'design', 'layout' ) ) $use_image_ratio = $image_ratio . '-medium'; 
  237.  
  238. else $use_image_ratio = $image_ratio . '-large'; 
  239.  
  240. } else { 
  241. if( 4 > $item_instance['width'] ) $use_image_ratio = 'medium'; 
  242. else $use_image_ratio = 'full'; 
  243.  
  244. $media = layers_get_feature_media( 
  245. $featureimage ,  
  246. $use_image_ratio ,  
  247. $featurevideo 
  248. ); 
  249.  
  250. // Set Image Size 
  251. if( isset( $item_instance['design']['featuredimage-size'] ) && 0 != $item_instance['design']['featuredimage-size'] && '' != $item_instance['design']['featuredimage-size'] ) { 
  252. $image_width = $item_instance['design'][ 'featuredimage-size' ].'px'; 
  253. $this->inline_css .= layers_inline_styles( "#{$widget_id}-{$column_key} .media-image img { max-width : {$image_width}; }"); 
  254.  
  255. // Get the link array. 
  256. $link_array = $this->check_and_return_link( $item_instance, 'button' ); 
  257. $link_href_attr = ( $link_array['link'] ) ? 'href="' . esc_url( $link_array['link'] ) . '"' : ''; 
  258. $link_target_attr = ( '_blank' == $link_array['target'] ) ? 'target="_blank"' : ''; 
  259.  
  260. /** 
  261. * Set Individual Column CSS 
  262. */ 
  263. $classes = array(); 
  264. $classes[] = 'layers-masonry-column'; 
  265. $classes[] = $this->id_base . '-' . $column_key; 
  266. $classes[] = $span_class; 
  267. $classes[] = ( 'on' == $this->check_and_return( $item_instance , 'design', 'background', 'darken' ) ? 'darken' : '' ); 
  268. $classes[] = ( '' != $first_last_class ? $first_last_class : '' ); 
  269. $classes[] = ( 'list-masonry' == $this->check_and_return( $instance, 'design', 'liststyle' ) ? '' : '' ); 
  270. $classes[] = 'column' . ( 'on' != $this->check_and_return( $instance, 'design', 'gutter' ) ? '-flush' : '' ); 
  271. $classes[] = $this->check_and_return( $item_instance, 'design', 'advanced', 'customclass' ); // Apply custom class from design-bar's advanced control. 
  272. if( $this->check_and_return( $item_instance, 'design' , 'background', 'image' ) || '' != $this->check_and_return( $item_instance, 'design' , 'background', 'color' ) ) 
  273. $classes[] = 'content'; 
  274. if( false != $media ) 
  275. $classes[] = 'has-image'; 
  276.  
  277. $classes = apply_filters( 'layers_content_widget_item_class', $classes, $this, $item_instance ); 
  278. $classes = implode( ' ', $classes ); ?> 
  279.  
  280. <div id="<?php echo $widget_id; ?>-<?php echo $column_key; ?>" class="<?php echo esc_attr( $classes ); ?>"> 
  281. <?php 
  282. /** 
  283. * Set Overlay CSS Classes 
  284. */ 
  285. $column_inner_classes = array(); 
  286. $column_inner_classes[] = 'media'; 
  287. if( !$this->check_and_return( $instance, 'design', 'gutter' ) ) { 
  288. $column_inner_classes[] = 'no-push-bottom'; 
  289. if( $this->check_and_return( $item_instance, 'design', 'background' , 'color' ) ) { 
  290. if( 'dark' == layers_is_light_or_dark( $this->check_and_return( $item_instance, 'design', 'background' , 'color' ) ) ) { 
  291. $column_inner_classes[] = 'invert'; 
  292. } else { 
  293. if( $this->check_and_return( $instance, 'design', 'background' , 'color' ) && 'dark' == layers_is_light_or_dark( $this->check_and_return( $instance, 'design', 'background' , 'color' ) ) ) { 
  294. $column_inner_classes[] = 'invert'; 
  295.  
  296. $column_inner_classes[] = $this->check_and_return( $item_instance, 'design', 'imagealign' ); 
  297. $column_inner_classes[] = $this->check_and_return( $item_instance, 'design', 'fonts' , 'size' ); 
  298. $column_inner_classes = implode( ' ', $column_inner_classes ); 
  299. ?> 
  300.  
  301. <div class="<?php echo $column_inner_classes; ?>"> 
  302. <?php if( NULL != $media ) { ?> 
  303. <div class="media-image <?php echo ( ( isset( $item_instance['design'][ 'imageratios' ] ) && 'image-round' == $item_instance['design'][ 'imageratios' ] ) ? 'image-rounded' : '' ); ?>"> 
  304. <?php if ( $link_array['link'] ) { ?> 
  305. <a <?php echo $link_href_attr; ?> <?php echo $link_target_attr; ?>> 
  306. <?php } ?> 
  307. <?php echo $media; ?> 
  308. <?php if ( $link_array['link'] ) { ?> 
  309. </a> 
  310. <?php } ?> 
  311. </div> 
  312. <?php } ?> 
  313.  
  314. <?php if( $this->check_and_return( $item_instance, 'title' ) || $this->check_and_return( $item_instance, 'excerpt' ) || ( $link_array['link'] && $link_array['text'] ) ) { ?> 
  315. <div class="media-body <?php echo ( isset( $item_instance['design']['fonts'][ 'align' ] ) ) ? $item_instance['design']['fonts'][ 'align' ] : ''; ?>"> 
  316. <?php if( $this->check_and_return( $item_instance, 'title') ) { ?> 
  317. <<?php echo $this->check_and_return( $item_instance, 'design', 'fonts', 'heading-type' ) ?> class="heading"> 
  318. <?php if ( $link_array['link'] ) { ?> 
  319. <a <?php echo $link_href_attr; ?> <?php echo $link_target_attr; ?>> 
  320. <?php } ?> 
  321. <?php echo $item_instance['title']; ?> 
  322. <?php if ( $link_array['link'] ) { ?> 
  323. </a> 
  324. <?php } ?> 
  325. </<?php echo $this->check_and_return( $item_instance, 'design', 'fonts', 'heading-type' ) ?>> 
  326. <?php } ?> 
  327. <?php if( $this->check_and_return( $item_instance, 'excerpt' ) ) { ?> 
  328. <div class="excerpt"><?php layers_the_content( $item_instance['excerpt'] ); ?></div> 
  329. <?php } ?> 
  330. <?php if ( $link_array['link'] && $link_array['text'] ) { ?> 
  331. <a <?php echo $link_href_attr; ?> class="button <?php echo $button_size; ?>" <?php echo $link_target_attr; ?>> 
  332. <?php echo $link_array['text']; ?> 
  333. </a> 
  334. <?php } ?> 
  335. </div> 
  336. <?php } ?> 
  337. </div> 
  338. </div> 
  339. <?php } ?> 
  340. </div><!-- /row --> 
  341. </div> 
  342. <?php } 
  343.  
  344. do_action( 'layers_after_content_widget_inner', $this, $instance ); 
  345.  
  346. // Print the Inline Styles for this Widget 
  347. $this->print_inline_css(); 
  348.  
  349. if( 'list-masonry' == $this->check_and_return( $instance , 'design', 'liststyle' ) ) { ?> 
  350.  
  351. <script type='text/javascript'> 
  352. jQuery(function($) { 
  353. $('#<?php echo $widget_id; ?>').find('.list-masonry .grid').layers_masonry({ 
  354. itemSelector: '.layers-masonry-column',  
  355. layoutMode: 'masonry',  
  356. gutter: <?php echo ( isset( $instance['design'][ 'gutter' ] ) ? 20 : 0 ); ?>,  
  357. }); 
  358. }); 
  359. </script> 
  360.  
  361. <?php } // masonry trigger ?> 
  362. </div> 
  363. <?php } 
  364.  
  365. /** 
  366. * Widget update 
  367. */ 
  368.  
  369. function update($new_instance, $old_instance) { 
  370. if ( isset( $this->checkboxes ) ) { 
  371. foreach( $this->checkboxes as $cb ) { 
  372. if( isset( $old_instance[ $cb ] ) ) { 
  373. $old_instance[ $cb ] = strip_tags( $new_instance[ $cb ] ); 
  374. } // foreach checkboxes 
  375. } // if checkboxes 
  376. return $new_instance; 
  377.  
  378. /** 
  379. * Widget form 
  380. * We use regular HTML here, it makes reading the widget much easier than if we used just php to echo all the HTML out. 
  381. */ 
  382. function form( $instance ) { 
  383.  
  384. // Use defaults if $instance is empty. 
  385. if( empty( $instance ) && ! empty( $this->defaults ) ) { 
  386. $instance = wp_parse_args( $instance, $this->defaults ); 
  387.  
  388. // Mix in new/unset defaults on every instance load (NEW) 
  389. $instance = $this->apply_defaults( $instance ); 
  390.  
  391. $this->design_bar( 
  392. 'side', // CSS Class Name 
  393. array( // Widget Object 
  394. 'name' => $this->get_layers_field_name( 'design' ),  
  395. 'id' => $this->get_layers_field_id( 'design' ),  
  396. 'widget_id' => $this->widget_id,  
  397. ),  
  398. $instance, // Widget Values 
  399. apply_filters( 'layers_column_widget_design_bar_components', array( // Components 
  400. 'layout',  
  401. 'liststyle' => array( 
  402. 'icon-css' => 'icon-list-masonry',  
  403. 'label' => __( 'List Style', 'layerswp' ),  
  404. 'wrapper-class' => 'layers-small to layers-pop-menu-wrapper layers-animate',  
  405. 'elements' => array( 
  406. 'liststyle' => array( 
  407. 'type' => 'select-icons',  
  408. 'name' => $this->get_layers_field_name( 'design', 'liststyle' ) ,  
  409. 'id' => $this->get_layers_field_id( 'design', 'liststyle' ) ,  
  410. 'value' => ( isset( $instance['design'][ 'liststyle' ] ) ) ? $instance['design'][ 'liststyle' ] : NULL,  
  411. 'options' => array( 
  412. 'list-grid' => __( 'Grid' , 'layerswp' ),  
  413. 'list-masonry' => __( 'Masonry' , 'layerswp' ) 
  414. ),  
  415. 'gutter' => array( 
  416. 'type' => 'checkbox',  
  417. 'label' => __( 'Gutter' , 'layerswp' ),  
  418. 'name' => $this->get_layers_field_name( 'design', 'gutter' ) ,  
  419. 'id' => $this->get_layers_field_id( 'design', 'gutter' ) ,  
  420. 'value' => ( isset( $instance['design']['gutter'] ) ) ? $instance['design']['gutter'] : NULL 
  421. ),  
  422. 'background',  
  423. 'advanced',  
  424. ), $this, $instance ) 
  425. ); ?> 
  426. <div class="layers-container-large" id="layers-column-widget-<?php echo $this->number; ?>"> 
  427.  
  428. <?php $this->form_elements()->header( array( 
  429. 'title' =>'Content',  
  430. 'icon_class' =>'text' 
  431. ) ); ?> 
  432.  
  433. <section class="layers-accordion-section layers-content"> 
  434. <div class="layers-form-item"> 
  435.  
  436. <?php echo $this->form_elements()->input( 
  437. array( 
  438. 'type' => 'text',  
  439. 'name' => $this->get_layers_field_name( 'title' ) ,  
  440. 'id' => $this->get_layers_field_id( 'title' ) ,  
  441. 'placeholder' => __( 'Enter title here' , 'layerswp' ),  
  442. 'value' => ( isset( $instance['title'] ) ) ? $instance['title'] : NULL ,  
  443. 'class' => 'layers-text layers-large layers-input-has-controls',  
  444. ); ?> 
  445.  
  446. <?php $this->design_bar( 
  447. 'top', // CSS Class Name 
  448. array( // Widget Object 
  449. 'name' => $this->get_layers_field_name( 'design' ),  
  450. 'id' => $this->get_layers_field_id( 'design' ),  
  451. 'widget_id' => $this->widget_id,  
  452. 'show_trash' => FALSE,  
  453. 'inline' => TRUE,  
  454. 'align' => 'right',  
  455. ),  
  456. $instance, // Widget Values 
  457. apply_filters( 'layers_column_widget_inline_design_bar_components', array( // Components 
  458. 'fonts',  
  459. ), $this, $instance ) 
  460. ); ?> 
  461.  
  462. </div> 
  463. <div class="layers-form-item"> 
  464.  
  465. <?php echo $this->form_elements()->input( 
  466. array( 
  467. 'type' => 'rte',  
  468. 'name' => $this->get_layers_field_name( 'excerpt' ) ,  
  469. 'id' => $this->get_layers_field_id( 'excerpt' ) ,  
  470. 'placeholder' => __( 'Short Excerpt' , 'layerswp' ),  
  471. 'value' => ( isset( $instance['excerpt'] ) ) ? $instance['excerpt'] : NULL ,  
  472. 'class' => 'layers-textarea layers-large' 
  473. ); ?> 
  474.  
  475. </div> 
  476. </section> 
  477. <section class="layers-accordion-section layers-content"> 
  478. <div class="layers-form-item"> 
  479.  
  480. <?php $this->repeater( 'column', $instance ); ?> 
  481.  
  482. </div> 
  483. </section> 
  484.  
  485. </div> 
  486.  
  487. <?php } 
  488.  
  489. function column_item( $item_guid, $item_instance ) { 
  490.  
  491. // Required - Get the name of this type. 
  492. $type = str_replace( '_item', '', __FUNCTION__ ); 
  493.  
  494. // Mix in new/unset defaults on every instance load (NEW) 
  495. $item_instance = $this->apply_defaults( $item_instance, 'column' ); 
  496. ?> 
  497. <li class="layers-accordion-item" data-guid="<?php echo esc_attr( $item_guid ); ?>"> 
  498.  
  499. <a class="layers-accordion-title"> 
  500. <span> 
  501. <?php echo ucfirst( $type ); ?><span class="layers-detail"><?php if ( isset( $item_instance['title'] ) ) echo $this->format_repeater_title( $item_instance['title'] ); ?></span> 
  502. </span> 
  503. </a> 
  504.  
  505. <section class="layers-accordion-section layers-content"> 
  506. <?php $this->design_bar( 
  507. 'top', // CSS Class Name 
  508. array( // Widget Object 
  509. 'name' => $this->get_layers_field_name( 'design' ),  
  510. 'id' => $this->get_layers_field_id( 'design' ),  
  511. 'widget_id' => $this->widget_id . '_item',  
  512. 'number' => $this->number,  
  513. 'show_trash' => TRUE,  
  514. ),  
  515. $item_instance, // Widget Values 
  516. apply_filters( 'layers_column_widget_column_design_bar_components', array( // Components 
  517. 'background',  
  518. 'featuredimage',  
  519. 'imagealign',  
  520. 'fonts',  
  521. 'buttons' => array( 
  522. 'icon-css' => 'icon-call-to-action',  
  523. 'label' => __( 'Buttons', 'layerswp' ),  
  524. 'elements' => array( 
  525. 'layers-pro-upsell' =>array( 
  526. 'type' => 'html',  
  527. 'html' => '<div class="layers-upsell-tag"> 
  528. <span class="layers-upsell-title">Upgrade to Layers Pro</span> 
  529. <div class="description customize-control-description"> 
  530. Want more control over your button styling and sizes? 
  531. <a target="_blank" href="https://www.layerswp.com/layers-pro/?ref=obox&utm_source=layers%20theme&utm_medium=link&utm_campaign=Layers%20Pro%20Upsell&utm_content=Widget%20Button%20Control">Purchase Layers Pro</a> 
  532. and gain more control over your button styling! 
  533. </div> 
  534. </div>' 
  535. ),  
  536. 'elements_combine' => 'replace',  
  537. ),  
  538. 'width' => array( 
  539. 'icon-css' => 'icon-columns',  
  540. 'label' => 'Column Width',  
  541. 'elements' => array( 
  542. 'layout' => array( 
  543. 'type' => 'select',  
  544. 'label' => __( '' , 'layerswp' ),  
  545. 'name' => $this->get_layers_field_name( 'width' ),  
  546. 'id' => $this->get_layers_field_id( 'width' ),  
  547. 'value' => ( isset( $item_instance['width'] ) ) ? $item_instance['width'] : NULL,  
  548. 'options' => array( 
  549. '1' => __( '1 of 12 columns' , 'layerswp' ),  
  550. '2' => __( '2 of 12 columns' , 'layerswp' ),  
  551. '3' => __( '3 of 12 columns' , 'layerswp' ),  
  552. '4' => __( '4 of 12 columns' , 'layerswp' ),  
  553. '5' => __( '5 of 12 columns' , 'layerswp' ),  
  554. '6' => __( '6 of 12 columns' , 'layerswp' ),  
  555. '7' => __( '7 of 12 columns' , 'layerswp' ),  
  556. '8' => __( '8 of 12 columns' , 'layerswp' ),  
  557. '9' => __( '9 of 12 columns' , 'layerswp' ),  
  558. '10' => __( '10 of 12 columns' , 'layerswp' ),  
  559. '11' => __( '11 of 12 columns' , 'layerswp' ),  
  560. '12' => __( '12 of 12 columns' , 'layerswp' ) 
  561. ),  
  562. 'advanced' => array( 
  563. 'elements' => array( 
  564. 'padding' => array( 
  565. 'type' => 'trbl-fields',  
  566. 'label' => __( 'Padding (px)', 'layerswp' ),  
  567. 'name' => $this->get_layers_field_name( 'design', 'advanced', 'padding' ),  
  568. 'id' => $this->get_layers_field_id( 'design', 'advanced', 'padding' ),  
  569. 'value' => ( isset( $item_instance['design']['advanced']['padding'] ) ) ? $item_instance['design']['advanced']['padding'] : NULL,  
  570. 'fields' => array( 
  571. 'top',  
  572. 'right',  
  573. 'bottom',  
  574. 'left',  
  575. ),  
  576. ),  
  577. 'margin' => array( 
  578. 'type' => 'trbl-fields',  
  579. 'label' => __( 'Margin (px)', 'layerswp' ),  
  580. 'name' => $this->get_layers_field_name( 'design', 'advanced', 'margin' ),  
  581. 'id' => $this->get_layers_field_id( 'design', 'advanced', 'margin' ),  
  582. 'value' => ( isset( $item_instance['design']['advanced']['margin'] ) ) ? $item_instance['design']['advanced']['margin'] : NULL,  
  583. 'fields' => array( 
  584. 'top',  
  585. 'bottom',  
  586. ),  
  587. ),  
  588. 'customclass',  
  589. ),  
  590. 'elements_combine' => 'replace',  
  591. ),  
  592. ), $this, $item_instance ) 
  593. ); ?> 
  594. <div class="layers-row"> 
  595. <p class="layers-form-item"> 
  596. <label for="<?php echo $this->get_layers_field_id( 'title' ); ?>"><?php _e( 'Title' , 'layerswp' ); ?></label> 
  597. <?php echo $this->form_elements()->input( 
  598. array( 
  599. 'type' => 'text',  
  600. 'name' => $this->get_layers_field_name( 'title' ),  
  601. 'id' => $this->get_layers_field_id( 'title' ),  
  602. 'placeholder' => __( 'Enter title here' , 'layerswp' ),  
  603. 'value' => ( isset( $item_instance['title'] ) ) ? $item_instance['title'] : NULL ,  
  604. 'class' => 'layers-text' 
  605. ); ?> 
  606. </p> 
  607. <p class="layers-form-item"> 
  608. <label for="<?php echo $this->get_layers_field_id( 'excerpt' ); ?>"><?php _e( 'Excerpt' , 'layerswp' ); ?></label> 
  609. <?php echo $this->form_elements()->input( 
  610. array( 
  611. 'type' => 'rte',  
  612. 'name' => $this->get_layers_field_name( 'excerpt' ),  
  613. 'id' => $this->get_layers_field_id( 'excerpt' ),  
  614. 'placeholder' => __( 'Short Excerpt' , 'layerswp' ),  
  615. 'value' => ( isset( $item_instance['excerpt'] ) ) ? $item_instance['excerpt'] : NULL ,  
  616. 'class' => 'layers-form-item layers-textarea',  
  617. 'rows' => 6 
  618. ); ?> 
  619. </p> 
  620.  
  621. <?php 
  622. // Fix widget's that were created before dynamic linking structure. 
  623. $item_instance = $this->convert_legacy_widget_links( $item_instance, 'button' ); 
  624. ?> 
  625.  
  626. <div class="layers-form-item"> 
  627. <label> 
  628. <?php _e( 'Insert Link' , 'layerswp' ); ?> 
  629. </label> 
  630. <?php echo $this->form_elements()->input( 
  631. array( 
  632. 'type' => 'link-group',  
  633. 'name' => $this->get_layers_field_name( 'button' ),  
  634. 'id' => $this->get_layers_field_id( 'button' ),  
  635. 'value' => ( isset( $item_instance['button'] ) ) ? $item_instance['button'] : NULL,  
  636. ); ?> 
  637. </div> 
  638.  
  639. </div> 
  640. </section> 
  641. </li> 
  642. <?php 
  643.  
  644. } // Class