I have an issue here and i hope you guys help me because i'm getting crazy. Anyway, as you know wordpress output the attached images in tag. I need them as background-image css. Here's my code;

            $content = get_the_content();
            $feat_image_url = wp_get_attachment_url(  $post->ID, '' )[0];
            $content = preg_replace("/<img[^>]+\>/i", "<div class='single-
            parallax-image' style='background-image:url(".$feat_image_url.")'></div>", $content);          
            $content = apply_filters('the_content', $content);
            $content = str_replace(']]>', ']]>', $content);
            echo $content; 

As you can see i need to preg_replace img tag with

<div class='single-parallax-image' style='background-image:url(".$feat_image_url.")'></div>



I would look for an simpler implementation like maybe using a shortcode. If you like the simplicity of adding an image through the add media interface you could hack the gallery shortcode of wordpress(if you do not plan to use it elsewhere).


using this code

<?php if (has_post_thumbnail( $post->ID ) ): ?>
      <?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
    <div class='single-parallax-image' style='background-image:url("<?=$image[0]; ?>")'><?=get_the_content()?></div>

    <?php endif; ?>
  • Never use <?= shorthand tags as they are more than likely disabled on the hosting. Also, it is contrary to WordPress Coding Standards. – Max Yudin Jan 16 '18 at 12:55
  • if you php version long to php5.6 you can using shorthand codes – Toir427 Jan 16 '18 at 13:44
  • and/or equal php5.6 version – Toir427 Jan 16 '18 at 13:52
  • thanks for answer but i dont want to get the post thumbnail. See, that's the problem. i want to get attached images in the post as background-image css not in <img /> tag – Oyun Drop Jan 17 '18 at 9:01


$content = get_the_content();
$replacement = '</br></br>$3</br></br>';
$pattern = '/(img|src)(\"|\'|\=\"|\=\')(.*)/i';
$content = preg_replace( $pattern, $replacement, $content );
echo $content;

So guys i tried something like this. And i got the link like this.

linkoftheimage.jpg" alt="" width="1024" height="576" /> 

i dont know how to remove the

" alt="" width="1024" height="576" /> 

part from the output. if you guys can tell me that i would be happy. Thanks to everyone.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.