Home › Forums › Feature Requests › File field type: Option to return SVG as code
Currently the File Type can return as a File Array, File URL, or File ID. What would really be great would be returning SVG as the actual code (putting SVG into templates as code make them styleable with CSS).
I think returning code would only make sense for SVG.
Ha! After a bit more research I see that I can use PHP to get the SVG contents after all,
<?php $logo = get_field(‘header_logo’, ‘option’); ?>
<?php echo file_get_contents( $logo ); ?>
Problem solved! I hope this is helpful for someone else.
I was looking for this exact answer! Thanks! However, I need to output the svg for each term in a taxonomy loop. When it comes to that, ACF requires the term variable to be passed on as a second parameter in get_field()
.
So I tried this:
<?php $svgImg = get_field('my_custom_field', $term, 'option'); ?>
<?php echo file_get_contents( $svgImg ); ?>
But I get this php error:
“Warning: “file_get_contents() expects parameter 1 to be a valid path”
Seems like it´s not an issue related to the order of the parameters as when I swap $term
and option
, it makes WP blind to what term I´m referring to:
“Warning: file_get_contents(): Filename cannot be empty”
$term
has been properly defined as I have tested it with:
<?php $svgImg = get_field('my_custom_field', $term); ?>
<img src="<?php echo $svgImg['url']? />">
This last piece of code works. But the previous doesn´t.
Can somebody help?
God! It´s a bit embarrassing when you get the answer seconds after posting the question. But instead of removing it, I´ll just leave it here as it might help someone else, just like arleym´s post helped me.
Arleym was using a file field. I am using an image field. And I need it to be like that for reasons that go beyond this topic. (obs: wordpress does not support svg in the media library natively).
Having said that, it wasn´t working because my image field was set to return the object array while it MUST be set to return the URL, instead.
So the intial code on my previous comment was correct and after changing the value returned by the image field it now works!
<?php $svgImg = get_field('my_custom_field', $term, 'option'); ?>
<?php echo file_get_contents( $svgImg ); ?>
Hope this may help somebody else.
I just want to say thank you to both @diogo_wagner and @arleym. This is exactly what I needed.
Three years later and this post is still a lifesaver. Thanks for figuring this out guys!
Hi, if I wanted to integrate your code with the groups code? How can I do that?
<?php $annata2 = get_field('anno_2'); if( $annata2 ): ?> <?php echo $annata2['testo_icona_1_anno_2']; ?> <?php endif; ?>
Thanks
Hello,
We encountered some issues with the file_get_contents() function in our local env.
The solution we found is the following:
<?php include get_attached_file(get_field('image_field')['id'] ); ?>
It will include the svg’s code.
Hello,
thanks for your snippets, but none of your solutions work for me.
<?php $test = get_field('logo', 'option'); ?>
<a href="<?php the_field('link'); ?>" target="_blank">
<?php echo file_get_contents( $test ); ?>
</a>
I’ve tested image field with object array or URL but nothing appears in my a link-tag.
The fields are correct, because everything works fine for a (simple) display of img logos (example below).
<?php $test = get_field('logo'); ?>
<a href="<?php the_field('link'); ?>" target="_blank">
<img src="<?php echo $test['url']; ?>" alt="<?php echo $test['alt']; ?>" />
</a>
But I want to use inline SVGs to animate the hovers in css.
Would someone be able to help me please?
I have been looking for solutions for several days.
Thank you.
I’ve found an(other) solution with Curl.
<?php $test = get_field('logo'); ?>
<a href="<?php the_field('link'); ?>" target="_blank">
<?php $handle = curl_init();
curl_setopt($handle, CURLOPT_URL, $test);
curl_setopt($handle, CURLOPT_USERAGENT, 'Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:13.0) Gecko/20100101 Firefox/13.0.1');
curl_exec($handle);
curl_close($handle); ?>
</a>
My SVG files are loads inline now.
Hope this solution could helps someone.
The topic ‘File field type: Option to return SVG as code’ is closed to new replies.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Privacy Policy. If you continue to use this site, you consent to our use of cookies.