[Resolved] Add inline SVG to Copyright section of footer

Home Forums Support Add inline SVG to Copyright section of footer

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1210438
    feisar

    I’m trying to add an inline SVG image as a href link (so it can be styled via CSS) to the Copyright section of my sites footer.

    However, the SVG code is stripped out or, if entered as a data URI, displayed raw on the page.

    Is there a recommended (and safe) way to do this?

    (Using a link to an external SVG displays ok, but then can’t be styled via CSS).

    Thanks for any tips.

    GP v2.42
    GPP v1.9.1

    #1210975
    Leo
    Staff
    Customer Support

    Hi there,

    Any chance you can link us to the site in question?

    You can edit the original topic and use the private URL field.

    Let me know 🙂

    #1210985
    feisar

    Thanks, I’ve added the link to the private URL field.

    It’s the “Site by” logo at the very bottom right of the page.

    I was hoping to use the fill: currentColor; CSS as mentioned here, to allow the logo to adopt the color of the surrounding text, and then use CSS to change the fill colour on hover.

    GP v2.42
    GPP v1.9.1

    #1211346
    Leo
    Staff
    Customer Support

    Not sure if fully understand.

    Does that method work in regular page content?

    The copyright box should take HTML just like the regular page content.

    #1211562
    feisar

    Here’s a reduced case example. If you add the following code into the regular page content, the SVG displays and inherits the colour of the parent, including hover colour changes.

    <a href="#"><svg viewBox="0 0 23 23" height="20" width="20" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><circle cx="11.25" cy="11.25" r="11.25" fill="currentColor"/></svg> Inherits link color with hover</a>

    If you enter exactly the same code into Customiser > Layout > Footer > Copyright the SVG doesn’t display in the preview and the SVG code is stripped out when saving.

    I’ve tried with the Safe SVG and SVG Support plugins but they make no difference.

    EDIT: If I generate the copyright section using the ‘generate_copyright‘ function rather than the customiser, it works.

    GP v2.42
    GPP v1.9.1

    #1212123
    Leo
    Staff
    Customer Support

    Must be something going on in the copyright field.

    In this case generate_copyright would be the solution.

    Glad you were able to find an alternative solution!

    #1212128
    feisar

    Thanks. It would be useful/easier if I could just use the Copyright field of the Customizer.

    Do you think this is a bug, and if so, is it within GeneratePress (and potentially could be fixed) or within core WordPress functionality?

    GP v2.42
    GPP v1.9.1

    #1212135
    Leo
    Staff
    Customer Support

    I believe that would be a WordPress functionality issue but we will definitely take a closer look.

    Thanks 🙂

    #1212175
    feisar

    Thank you.

    GP v2.42
    GPP v1.9.1

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