Automattic\WooCommerce\Blocks\BlockTypes

ProductGalleryLargeImageNextPrevious::get_inside_button()protectedWC 1.0

Returns an HTML button element with an SVG icon for the previous or next button when the buttons are inside the image.

Method of the class: ProductGalleryLargeImageNextPrevious{}

No Hooks.

Return

String. The HTML for the button element.

Usage

// protected - for code of main (parent) or child class
$result = $this->get_inside_button( $button_type, $context );
$button_type(string) (required)
The type of button to return. Either "previous" or "next".
$context(string) (required)
The context in which the button is being used.

ProductGalleryLargeImageNextPrevious::get_inside_button() code WC 9.7.1

protected function get_inside_button( $button_type, $context ) {
	$previous_button_icon_path = 'M28.1 12L30.5 14L21.3 24L30.5 34L28.1 36L17.3 24L28.1 12Z';
	$next_button_icon_path     = 'M21.7001 12L19.3 14L28.5 24L19.3 34L21.7001 36L32.5 24L21.7001 12Z';
	$icon_path                 = $previous_button_icon_path;
	$button_side_class         = 'left';

	if ( 'next' === $button_type ) {
		$icon_path         = $next_button_icon_path;
		$button_side_class = 'right';
	}

	return sprintf(
		'<button
			data-wc-bind--disabled="state.disable%1$s"
			class="wc-block-product-gallery-large-image-next-previous--button wc-block-product-gallery-large-image-next-previous-%2$s--%3$s"
		>
			<svg xmlns="http://www.w3.org/2000/svg" width="49" height="48" viewBox="0 0 49 48" fill="none">
				<g filter="url(#filter0_b_397_11354)">
					<rect x="0.5" width="48" height="48" rx="5" fill="black" fill-opacity="0.5"/>
					<path d="%4$s" fill="white"/>
				</g>
				<defs>
					<filter id="filter0_b_397_11354" x="-9.5" y="-10" width="68" height="68" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
						<feFlood flood-opacity="0" result="BackgroundImageFix"/>
						<feGaussianBlur in="BackgroundImageFix" stdDeviation="5"/>
						<feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_397_11354"/>
						<feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_397_11354" result="shape"/>
					</filter>
				</defs>
			</svg>
		</button>',
		ucfirst( $button_side_class ),
		$button_side_class,
		$this->get_class_suffix( $context ),
		$icon_path
	);
}