[Resolved] SVG icon before site-title

Home Forums Support [Resolved] SVG icon before site-title

Home Forums Support SVG icon before site-title

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1623757
    Baz

    Hi, just wondering if it’s possible to have a SVG icon display before the site-title (no logo used)?

    I know we can use the ‘:before’ selector for other elements but what CSS for adding a SVG icon (HTML or local file).

    Thank you.

    #1623869
    David
    Staff
    Customer Support

    Hi there,

    you would need to use this PHP Snippet:

    add_filter( 'generate_site_title_output', function( $output ) {
        $titleHTML = '<svg>Your SVG ICON</svg>The Site title';
        return sprintf(
            '<%1$s class="main-title" itemprop="headline">
    	<a href="%2$s">%3$s</a>
    	</%1$s>',
    	( is_front_page() && is_home() ) ? 'h1' : 'p',
    	esc_url( apply_filters( 'generate_site_title_href', home_url( '/' ) ) ),
    	$titleHTML
        );
    });

    Simply edit the $titleHTML = '<svg>Your SVG ICON</svg>The Site title'; to include your inline SVG followed by the Title Text.

    #1623876
    Baz

    Thank you for the super quick response David.

    #1623915
    David
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.