Merge pull request #20644 from woocommerce/update/dynamic-placeholders
Make placeholders resize based on aspect ratio settings
This commit is contained in:
commit
920eb551a6
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -229,6 +229,10 @@ ul.products {
|
|||
margin-bottom: .75em;
|
||||
}
|
||||
|
||||
.woocommerce-placeholder {
|
||||
border: 1px solid #F2F2F2;
|
||||
}
|
||||
|
||||
.button {
|
||||
@include link();
|
||||
|
||||
|
@ -405,6 +409,10 @@ table.variations {
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
.woocommerce-product-gallery__image--placeholder {
|
||||
border: 1px solid #F2F2F2;
|
||||
}
|
||||
|
||||
.woocommerce-product-gallery__image:nth-child(n+2) {
|
||||
width: 25%;
|
||||
display: inline-block;
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -189,6 +189,10 @@ p.demo_store,
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
.woocommerce-product-gallery__image--placeholder {
|
||||
border: 1px solid #F2F2F2;
|
||||
}
|
||||
|
||||
.woocommerce-product-gallery__image:nth-child(n+2) {
|
||||
width: 25%;
|
||||
display: inline-block;
|
||||
|
@ -571,6 +575,10 @@ p.demo_store,
|
|||
display: block;
|
||||
}
|
||||
|
||||
.woocommerce-placeholder {
|
||||
border: 1px solid #F2F2F2;
|
||||
}
|
||||
|
||||
.star-rating {
|
||||
font-size: 0.857em;
|
||||
}
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 23 KiB |
|
@ -2,8 +2,6 @@
|
|||
/**
|
||||
* WooCommerce Product Settings
|
||||
*
|
||||
* @author WooThemes
|
||||
* @category Admin
|
||||
* @package WooCommerce/Admin
|
||||
* @version 2.4.0
|
||||
*/
|
||||
|
@ -75,9 +73,9 @@ class WC_Settings_Products extends WC_Settings_Page {
|
|||
|
||||
<p>
|
||||
<?php
|
||||
/* translators: %s: URL to customizer. */
|
||||
echo wp_kses(
|
||||
sprintf(
|
||||
/* translators: %s: URL to customizer. */
|
||||
__( 'Looking for the product display options? They can now be found in the Customizer. <a href="%s">Go see them in action here.</a>', 'woocommerce' ), esc_url(
|
||||
add_query_arg(
|
||||
array(
|
||||
|
@ -325,6 +323,7 @@ class WC_Settings_Products extends WC_Settings_Page {
|
|||
),
|
||||
array(
|
||||
'title' => __( 'Shop page', 'woocommerce' ),
|
||||
/* translators: %s: URL to settings. */
|
||||
'desc' => '<br/>' . sprintf( __( 'The base page can also be used in your <a href="%s">product permalinks</a>.', 'woocommerce' ), admin_url( 'options-permalink.php' ) ),
|
||||
'id' => 'woocommerce_shop_page_id',
|
||||
'type' => 'single_select_page',
|
||||
|
@ -348,6 +347,16 @@ class WC_Settings_Products extends WC_Settings_Page {
|
|||
'type' => 'checkbox',
|
||||
'checkboxgroup' => 'end',
|
||||
),
|
||||
array(
|
||||
'title' => __( 'Placeholder image', 'woocommerce' ),
|
||||
'id' => 'woocommerce_placeholder_image',
|
||||
'type' => 'text',
|
||||
'default' => '',
|
||||
'class' => '',
|
||||
'css' => '',
|
||||
'placeholder' => __( 'Enter attachment ID or URL to an image', 'woocommerce' ),
|
||||
'desc_tip' => __( 'This is the attachment ID, or image URL, used for placeholder images in the product catalog. Products with no image will use this.', 'woocommerce' ),
|
||||
),
|
||||
array(
|
||||
'type' => 'sectionend',
|
||||
'id' => 'catalog_options',
|
||||
|
|
|
@ -1087,6 +1087,58 @@ CREATE TABLE {$wpdb->prefix}woocommerce_termmeta (
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Create attachment for placeholders.
|
||||
self::create_placeholder_image();
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a placeholder image in the media library.
|
||||
*
|
||||
* @since 3.5.0
|
||||
*/
|
||||
private static function create_placeholder_image() {
|
||||
$placeholder_image = get_option( 'woocommerce_placeholder_image', 0 );
|
||||
|
||||
if ( ! is_numeric( $placeholder_image ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( ! empty( $placeholder_image ) && is_numeric( $placeholder_image ) && wp_attachment_is_image( $placeholder_image ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$upload_dir = wp_upload_dir();
|
||||
$source = WC()->plugin_path() . '/assets/images/placeholder.png';
|
||||
$filename = $upload_dir['basedir'] . '/woocommerce-placeholder.png';
|
||||
|
||||
if ( ! file_exists( $filename ) ) {
|
||||
copy( $source, $filename ); // @codingStandardsIgnoreLine.
|
||||
}
|
||||
|
||||
if ( ! file_exists( $filename ) ) {
|
||||
update_option( 'woocommerce_placeholder_image', 0 );
|
||||
return;
|
||||
}
|
||||
|
||||
$filetype = wp_check_filetype( basename( $filename ), null );
|
||||
$attachment = array(
|
||||
'guid' => $upload_dir['url'] . '/' . basename( $filename ),
|
||||
'post_mime_type' => $filetype['type'],
|
||||
'post_title' => preg_replace( '/\.[^.]+$/', '', basename( $filename ) ),
|
||||
'post_content' => '',
|
||||
'post_status' => 'inherit',
|
||||
);
|
||||
$attach_id = wp_insert_attachment( $attachment, $filename );
|
||||
|
||||
update_option( 'woocommerce_placeholder_image', $attach_id );
|
||||
|
||||
// Make sure that this file is included, as wp_generate_attachment_metadata() depends on it.
|
||||
require_once ABSPATH . 'wp-admin/includes/image.php';
|
||||
|
||||
// Generate the metadata for the attachment, and update the database record.
|
||||
$attach_data = wp_generate_attachment_metadata( $attach_id, $filename );
|
||||
wp_update_attachment_metadata( $attach_id, $attach_data );
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -275,26 +275,39 @@ add_filter( 'post_type_link', 'wc_product_post_type_link', 10, 2 );
|
|||
/**
|
||||
* Get the placeholder image URL for products etc.
|
||||
*
|
||||
* @access public
|
||||
* @param string $size Image size.
|
||||
* @return string
|
||||
*/
|
||||
function wc_placeholder_img_src() {
|
||||
return apply_filters( 'woocommerce_placeholder_img_src', WC()->plugin_url() . '/assets/images/placeholder.png' );
|
||||
function wc_placeholder_img_src( $size = 'woocommerce_thumbnail' ) {
|
||||
$src = WC()->plugin_url() . '/assets/images/placeholder.png';
|
||||
$placeholder_image = get_option( 'woocommerce_placeholder_image', 0 );
|
||||
|
||||
if ( ! empty( $placeholder_image ) ) {
|
||||
if ( is_numeric( $placeholder_image ) ) {
|
||||
$dimensions = wc_get_image_size( $size );
|
||||
$image = wp_get_attachment_image_src( $placeholder_image, array( $dimensions['width'], $dimensions['height'] ) );
|
||||
|
||||
if ( ! empty( $image[0] ) ) {
|
||||
$src = $image[0];
|
||||
}
|
||||
} else {
|
||||
$src = $placeholder_image;
|
||||
}
|
||||
}
|
||||
|
||||
return apply_filters( 'woocommerce_placeholder_img_src', $src );
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the placeholder image.
|
||||
*
|
||||
* @access public
|
||||
*
|
||||
* @param string $size Image size.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
function wc_placeholder_img( $size = 'woocommerce_thumbnail' ) {
|
||||
$dimensions = wc_get_image_size( $size );
|
||||
|
||||
return apply_filters( 'woocommerce_placeholder_img', '<img src="' . wc_placeholder_img_src() . '" alt="' . esc_attr__( 'Placeholder', 'woocommerce' ) . '" width="' . esc_attr( $dimensions['width'] ) . '" class="woocommerce-placeholder wp-post-image" height="' . esc_attr( $dimensions['height'] ) . '" />', $size, $dimensions );
|
||||
return apply_filters( 'woocommerce_placeholder_img', '<img src="' . wc_placeholder_img_src( $size ) . '" alt="' . esc_attr__( 'Placeholder', 'woocommerce' ) . '" width="' . esc_attr( $dimensions['width'] ) . '" class="woocommerce-placeholder wp-post-image" height="' . esc_attr( $dimensions['height'] ) . '" />', $size, $dimensions );
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue