Get src of img, or iframe with php or javascript? WordPress
- SOLVED
Hello there!
I'm trying to figure out a way of properly getting the src of an image,and an iframe. I basically have it so users submit iframe/ img content through a custom field. The problem is for what I'm trying to accomplish, I only need the src of an image, or iframe. I've been able to accomplish almost exactly what I want with JQuery, but the problem is that the page loads pretty slow and the iframe will show and then disappear.
[[LINK href="http://jsfiddle.net/f8zghnh5/3/"]]Here's my attempt with jquery.[[/LINK]] This worked, but if you hit run you'll see what I mean about the iframe disappearing. This also cause the page to load slower.
[[LINK href="http://pastebin.com/qbSRY5YF"]]Here's some PHP I tired for getting the src of an iframe.[[/LINK]] It didn't bring anything up on the screen.
Is it possible to grab the src of iframes and images without page loading problems?
Thank you very much for your help!
Answers (2)
Dbranes answers:
You can try the following:
<?php
//-----------------
// Input:
//-----------------
$input = '
<a href="" class ="link">Hello</a>
<iframe class="cust-embed"width="560" height="315" src="//www.youtube.com/embed/_dGc1lWadaQ" frameborder="0" allowfullscreen></iframe>
<iframe class="cust-embed"width="560" height="315" src="https://www.youtube.com/watch?v=6JQm5aSjX6g" frameborder="0" allowfullscreen></iframe>
<img class="front" src="http://example.com/cars.jpg"/>
<h1>Hello Agian</h1>
<img width="100" height="50" src="ships.jpg"/>
<br/>
';
//-------------------------
// Display all iframe src:
//-------------------------
$sources = get_iframe_src( $input );
foreach( (array) $sources as $source ) {
echo $source . PHP_EOL;
}
//-------------------------
// Display all image src:
//-------------------------
$sources = get_img_src( $input );
foreach( (array) $sources as $source ) {
echo $source . PHP_EOL;
}
//-------------------------
// Helper functions:
//-------------------------
/**
* Grab all iframe src from a string
*/
function get_iframe_src( $input ) {
preg_match_all("/<iframe[^>]*src=[\"|']([^'\"]+)[\"|'][^>]*>/i", $input, $output );
$return = array();
if( isset( $output[1][0] ) ) {
$return = $output[1];
}
return $return;
}
/**
* Grab all img src from a string
*/
function get_img_src( $input ) {
preg_match_all("/<img[^>]*src=[\"|']([^'\"]+)[\"|'][^>]*>/i", $input, $output );
$return = array();
if( isset( $output[1][0] ) ) {
$return = $output[1];
}
return $return;
}
Live Example:
[[LINK href="https://eval.in/208574"]]https://eval.in/208574[[/LINK]]
Chris comments:
Thanks Dbranes,
//Grabs user submitted iframe custom field in template
function custom_submit_iframe(){
echo get_post_meta( get_the_ID(), 'Video_Embed_Code', true );
}
// What I put in my templates loop
<?php
$input = custom_submit_iframe();
$sources = get_iframe_src( $input );
foreach( (array) $sources as $source ) {
echo $source . PHP_EOL;
}?>
I put the rest in my function.php. It works when I use <strong>$input = "<iframe> dummy content</iframe>";</strong>, but it doesn't seem to work when I replace the value with the custom field, or the function that echos the custom field. It doesn't get the src and the <iframe> still shows up in the browser.
Thanks for your wonderful help so far
Dbranes comments:
Hi Corbin,
You must use <em>return</em> and not <em>echo</em> in your <em>custom_submit_iframe()</em> function.
Use instead:
function custom_submit_iframe(){
return get_post_meta( get_the_ID(), 'Video_Embed_Code', true );
}
Chris comments:
Thank you so much Dbranes! You've never failed to impress!
Romel Apuya answers:
http://jsfiddle.net/z7q8cnc0/
Chris comments:
Hey Romel, That was just an old jsfiddle that I created before.