Reply To: Append Inline SVG to Menu item

• liqid

• September 28, 2021 at 12:47 pm

I think I misunderstood what you were asking before, hope this is what your looking for.

ACF output:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><path style="fill:#fff" d="M3.305 49.574v79.388h143.916V49.708L75.382 80.745 3.305 49.574z"></path><path style="fill:#fff" d="M3.305 21.777v13.846l72.077 31.172 71.839-31.068v-13.95H3.305z"></path></svg>

Hardcoded output:
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><path style="fill:#fff" d="M3.305 49.574v79.388h143.916V49.708L75.382 80.745 3.305 49.574z"></path><path style="fill:#fff" d="M3.305 21.777v13.846l72.077 31.172 71.839-31.068v-13.95H3.305z"></path></svg>

Look identical to me.

Below is a screenshot of the actual output. The top <svg> tag is the acf field and the bottom is the hardcode between the <a> tag. Disregard the <img> tag as I’m using the SVG plugin till this is resolved.

Here’s the code:

        $social_icon_static = get_field('social_icon_static', $item);
        //$social_icon_hover = get_field('social_icon_hover', $item);

      if ( $depth == 0 ) {

          $item_output .= '</span><div class="uk-inline-clip uk-transition-toggle uk-animation-toggle social-icon-container" tabindex="0">

            <img class="uk-animation-slide-top uk-animation-reverse social-top" width="16px" height="16px" src="">
            '. get_template_part( 'assets/images/svg/inline', $social_icon_static) .'
            <img class="uk-transition-slide-bottom social-bottom" width="16px" height="16px" src="">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 150"><path style="fill:#fff" d="M3.305 49.574v79.388h143.916V49.708L75.382 80.745 3.305 49.574z"/><path style="fill:#fff" d="M3.305 21.777v13.846l72.077 31.172 71.839-31.068v-13.95H3.305z"/></svg>
  
          </div>';
      }