Merge pull request #1734 from INN/1727-add-thumbnail-size-logic-to-se…

…ries-posts-widget

Swapped out series post widget image location for image size + alignment options

changelog.md

@@ -24,6 +24,7 @@ though this project doesn't succeed in adhering to [Semantic Versioning](https:/
 - Fixes an issue where the widget title wasn't displaying in the Largo Image Widget, due to trying to use the `$title` variable which was removed when we stopped using `extract` in [pull request #1565](https://github.com/INN/largo/pull/1565/). [Pull request #]() for [issue #1717](https://github.com/INN/largo/issues/1717).
 - Added support for `wp_body_open` hook below opening body tag. [Pull request #1735](https://github.com/INN/largo/pull/1735) for [issue #1698](https://github.com/INN/largo/issues/1698).
 - Added `font-display: block` to `fontello` font family. [Pull request #1742](https://github.com/INN/largo/pull/1742) for [issue #1686](https://github.com/INN/largo/issues/1686).
+- Replaced image settings in the Largo Series Posts widget to mirror the image settings in the Largo Recent Posts widget. [Pull request #1734](https://github.com/INN/largo/pull/1734) for [issue #1727](https://github.com/INN/largo/issues/1727).
 
 ## [Largo 0.6.3](https://github.com/INN/largo/compare/v0.6.2...v0.6.3)
 

inc/widgets/largo-series-posts.php

@@ -28,6 +28,7 @@ function widget( $args, $instance ) {
 		$instance['title_link'] = get_term_link( (int) $instance['series'], 'series' );
 		$term = get_term( $instance['series'], 'series' );
 		$title = apply_filters( 'widget_title', $term->name, $instance, $this->id_base );
+		$thumb = isset( $instance['thumbnail_display'] ) ? $instance['thumbnail_display'] : 'small';
 
 		echo $args['before_widget'];
 
@@ -38,7 +39,7 @@ function widget( $args, $instance ) {
 
 		$context = array(
 			'instance' => $instance,
-			'thumb' => 'medium',
+			'thumb' => $thumb,
 			'excerpt' => 'custom_excerpt'
 		);
 		largo_render_template('partials/widget', 'content', $context);
@@ -77,7 +78,8 @@ function update( $new_instance, $old_instance ) {
 		$instance['num'] = (int)$new_instance['num'];
 		$instance['series'] = sanitize_key( $new_instance['series'] );
 		$instance['show_byline'] = (int) $new_instance['show_byline'];
-		$instance['thumbnail_location'] = sanitize_key( $new_instance['thumbnail_location'] );
+		$instance['thumbnail_display'] = sanitize_key( $new_instance['thumbnail_display'] );
+		$instance['image_align'] = sanitize_key( $new_instance['image_align'] );
 		return $instance;
 	}
 
@@ -88,7 +90,8 @@ function form( $instance ) {
 		$instance = wp_parse_args( (array) $instance, array(
 			'num' => 4,
 			'heading' => 'Explore:',
-			'thumbnail_location' => 'before',
+			'thumbnail_display' => 'small',
+			'image_align' => 'left',
 			'show_byline' => 0,
 			'series' => 'null')
 		);
@@ -119,17 +122,25 @@ function form( $instance ) {
 		</p>
 
 		<p><input id="<?php echo $this->get_field_id('show_byline'); ?>" name="<?php echo $this->get_field_name('show_byline'); ?>" type="checkbox" value="1" <?php checked( $instance['show_byline'], 1);?> />
-			<label for="<?php echo $this->get_field_id('show_byline'); ?>"><?php _e( 'Show date on first post', 'largo' ); ?></label>
+			<label for="<?php echo $this->get_field_id('show_byline'); ?>"><?php _e( 'Show byline on first post?', 'largo' ); ?></label>
 		</p>
 
 		<p>
-			<label for="<?php echo $this->get_field_id('thumbnail_location'); ?>"><?php _e('Thumbnail position on first post', 'largo'); ?>:</label>
-			<select name="<?php echo $this->get_field_name('thumbnail_location'); ?>" id="<?php echo $this->get_field_id('thumbnail_location'); ?>">
-			<?php
-			$choices = array( 'before' => __( 'Before Headline', 'largo' ), 'after' => __( 'After Headline', 'largo' ) );
-			foreach( $choices as $i => $display ) {
-				echo '<option value="', $i, '"', selected($instance['thumbnail_location'], $i, false), '>', $display, '</option>';
-			} ?>
+			<label for="<?php echo $this->get_field_id( 'thumbnail_display' ); ?>"><?php _e( 'Thumbnail Image', 'largo' ); ?></label>
+			<select id="<?php echo $this->get_field_id( 'thumbnail_display' ); ?>" name="<?php echo $this->get_field_name( 'thumbnail_display' ); ?>" class="widefat" style="width:90%;">
+				<option <?php selected( $instance['thumbnail_display'], 'small'); ?> value="small"><?php _e( 'Small (60x60)', 'largo' ); ?></option>
+				<option <?php selected( $instance['thumbnail_display'], 'medium'); ?> value="medium"><?php _e( 'Medium (140x140)', 'largo' ); ?></option>
+				<option <?php selected( $instance['thumbnail_display'], 'large'); ?> value="large"><?php _e( 'Large (Full width of the widget)', 'largo' ); ?></option>
+				<option <?php selected( $instance['thumbnail_display'], 'none'); ?> value="none"><?php _e( 'None', 'largo' ); ?></option>
+			</select>
+		</p>
+
+		<!-- Image alignment -->
+		<p>
+			<label for="<?php echo $this->get_field_id( 'image_align' ); ?>"><?php _e( 'Image Alignment', 'largo' ); ?></label>
+			<select id="<?php echo $this->get_field_id( 'image_align' ); ?>" name="<?php echo $this->get_field_name( 'image_align' ); ?>" class="widefat" style="width:90%;">
+				<option <?php selected( $instance['image_align'], 'left'); ?> value="left"><?php _e( 'Left align', 'largo' ); ?></option>
+				<option <?php selected( $instance['image_align'], 'right'); ?> value="right"><?php _e( 'Right align', 'largo' ); ?></option>
 			</select>
 		</p>
 

less/inc/widgets/largo-series-posts.less

@@ -15,9 +15,6 @@
     margin-left: 0;
     list-style: none;
   }
-  img {
-    max-width: 100px;
-  }
   i {
     display: block;
     float: left;