Override close image icon with custom image

I wanted to override the event close-button icon with a custom image that would match the design of our website. With the help of this tutorial I succeeded overriding the function and specific filter (on line 279 of plugins/my-calendar/my-calendar-output.php). So in functions.php I have this code block:

  function custom_close_image_overridden( $custom_close_image ) {
    $custom_close_image = &quot;<img src=\&quot;data:image/svg xml;utf8,<svg xmlns='https://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'><path d='M0 0h18v18h-18zm0 0h18v18h-18z' fill='none'/><path d='M14.53 4.53l-1.06-1.06-4.47 4.47-4.47-4.47-1.06 1.06 4.47 4.47-4.47 4.47 1.06 1.06 4.47-4.47 4.47 4.47 1.06-1.06-4.47-4.47z' fill='rgb(193,68,103)'/></svg>\&quot;\&quot; alt='&quot; . __( 'Close', 'my-calendar' ) . &quot;' />&quot;;
    return $custom_close_image;
    }

    add_filter( 'mc_close_button','custom_close_image_overridden',99); 

Note this is an embedded SVG data-url, so no extra http-request which is also good for performance.

• This topic was modified 8 years, 4 months ago by bramdehaan.
• This topic was modified 8 years, 4 months ago by bramdehaan.
• This topic was modified 8 years, 4 months ago by bramdehaan.