Add Snippet To Project
Do you find inline styles in your WordPress gallery shortcode disruptive or redundant? With inline styles, you may find your website bogged down or inconsistent in aesthetics. But worry not. There’s a way to eliminate these sneaky lines of code from your gallery shortcode. In this article, we’ll guide you on how to systematically remove the inline style from the gallery shortcode, improving your WordPress site’s performance and aesthetic uniformity.
function wpturbo_remove_gallery_style($css) {
return preg_replace("#<style type='text/css'>(.*?)</style>#s", '', $css);
}
add_filter('gallery_style', 'wpturbo_remove_gallery_style');
Our snippet starts with the definition of a new function called wpturbo_remove_gallery_style(), which accepts a parameter labeled $css. This parameter represents the original CSS style that is applied to a WordPress gallery. Inside the function, we want to strip away the inline style that gets passed to it.
function wpturbo_remove_gallery_style($css) {
return preg_replace("#<style type='text/css'>(.*?)</style>#s", '', $css);
}To accomplish this, we use PHP's in-built preg_replace() function. This function searches for a specific pattern in a given string and replaces it with a specified replacement string. In our case, the pattern we are looking for is "<style type='text/css'>(.*?)</style>". This pattern will match any text that is enclosed within "<style type='text/css'>" and " </style>" tags.
The (.*?) section in the pattern is the key part which matches any text (signified by .), any number of times (signified by *?). We put it between parenthesis because we want this section to be grouped so that the preg_replace() function knows exactly what to replace from the matched string.
The '#' characters are delimiters, which specify the start and the end of the pattern.
The 's' after the final '#' is a pattern modifier that tells the function to also consider newline characters, meaning that the pattern search will continue across line breaks in the code.
The replacement string is '', which is an empty string. So the function is essentially removing the matched text from the CSS string.
Next, we have an add_filter() function. This function is a built-in WordPress function that adds custom functionality to specific points in the runtime. The add_filter() function allows us to change data during the execution of WordPress.
Here, 'gallery_style' is the filter hook, a point in the code where WordPress will allow your custom code to interrupt the default behavior and manipulate data.
The second parameter wpturbo_remove_gallery_style is our custom function that we wish to bind to the 'gallery_style' filter hook. This tells WordPress to use our custom function to modify the gallery's CSS styles.
add_filter('gallery_style', 'wpturbo_remove_gallery_style');As a result of this code snippet, the inline CSS styles of a gallery will be removed.