Skip to content

Instantly share code, notes, and snippets.

@w-jerome
Last active September 11, 2020 09:03
Show Gist options
  • Save w-jerome/7f41adc7ff85318e10feb8c60eea5927 to your computer and use it in GitHub Desktop.
Save w-jerome/7f41adc7ff85318e10feb8c60eea5927 to your computer and use it in GitHub Desktop.
PHP - Get placeholder for Lazyload
<?php
/**
* Image placeholder
*
* @param integer $width Placeholder width.
* @param integer $height Placeholder height.
* @param string $color Placeholder color.
* @return string Data ULR
*/
function get_placeholder(int $width = 0, int $height = 0, string $color = 'transparent') {
$color = rawurlencode((string) $color);
return 'data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22' . $width . 'px%22 height=%22' . $height . 'px%22 viewBox=%220 0 ' . $width . ' ' . $height . '%22%3E%3Crect x=%220%22 y=%220%22 width=%22' . $width . '%22 height=%22' . $height . '%22 fill=%22' . $color . '%22%3E%3C/rect%3E%3C/svg%3E';
}
?>
<img src="<?php echo get_placeholder(2210, 3315, '#ff0000'); ?>" data-src="https://picjumbo.com/wp-content/uploads/cute-dog-reading-book-2210x3315.jpg" class="js-lazyload">
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment