diff --git a/projects-portfolio.php b/projects-portfolio.php index df71359..3277b6e 100644 --- a/projects-portfolio.php +++ b/projects-portfolio.php @@ -350,46 +350,64 @@ function projects_portfolio_social_sharing_buttons( $project_id ) { $html = '
'; + $svg_icon = function( string $name, string $path ) use ( &$html ) { + // Render each social icon as an with an inline SVG data URI. + // Using instead of inline ensures browser CSS sizing and + // avoids any namespace/parser quirks with inline SVG in mixed content. + $svg = '' . $path . ''; + $data_uri = 'data:image/svg+xml;utf8,' . rawurlencode( $svg ); + $html .= '' . esc_attr( $name ) . ''; +}; + // Facebook. $html .= ''; - $html .= ''; + $svg_icon( 'Facebook', '' ); $html .= ''; // X (Twitter). $html .= ''; - $html .= ''; + $svg_icon( 'X', '' ); $html .= ''; // LinkedIn. $html .= ''; - $html .= ''; + $svg_icon( 'LinkedIn', '' ); $html .= ''; // Reddit. $html .= ''; - $html .= ''; + $svg_icon( 'Reddit', '' ); $html .= ''; // WhatsApp. $html .= ''; - $html .= ''; + $svg_icon( 'WhatsApp', '' ); $html .= ''; // Pinterest. $html .= ''; - $html .= ''; + $svg_icon( 'Pinterest', '' ); $html .= ''; // Email. $html .= ''; - $html .= ''; + $svg_icon( 'Email', '' ); $html .= ''; $html .= '
'; - // wp_kses_post() strips by default (the 'post' context doesn't allow it). - // Extend the allowed list to keep SVG markup intact so the icons render. + // wp_kses_post() strips tags by default (the 'post' context doesn't + // allow them), and would also strip data: URIs we use as a fallback. + // Extend the allowed list to keep both forms intact so the icons render. $allowed = wp_kses_allowed_html( 'post' ); + $allowed['img'] = array( + 'src' => true, + 'alt' => true, + 'width' => true, + 'height' => true, + 'style' => true, + 'aria-hidden' => true, + ); $allowed['svg'] = array( 'xmlns' => true, 'class' => true,