Title: srcset for image header (responsive)
Last modified: August 31, 2016

---

# srcset for image header (responsive)

 *  [richarduk](https://wordpress.org/support/users/richarduk/)
 * (@richarduk)
 * [10 years, 4 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/)
 * Hi, I’m using the media uploader to upload a header image which is output using
   header_image( ) but I’m not getting the various srcset alternatives for responsive
   designs. Is there an obvious reason for this?
 * Thanks!

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [Madhusudan Pokharel](https://wordpress.org/support/users/madhusudan977/)
 * (@madhusudan977)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014850)
 * Hello,
    You will get only one srcset for any image you upload. You have to code
   yourself for the responsive design like:
 * [@media](https://wordpress.org/support/users/media/) only screen and (max-width:
   800px) {
 * #header{
    width: 100%; height: auto; background-size: 100% auto !important; }}
 *  Thread Starter [richarduk](https://wordpress.org/support/users/richarduk/)
 * (@richarduk)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014851)
 * Gotcha, thanks! I’d come to the conclusion that header_image didn’t output srcset
   for some reason. Your solution, however, doesn’t replace a header image with 
   different header images depending on viewport, just resizes the existing header.
 * I know I’m going to have to dig into wp_get_attachment_image_sizes and wp_get_attachment_image_srcset…
 * Oh well …
 * Thanks!
 *  [Madhusudan Pokharel](https://wordpress.org/support/users/madhusudan977/)
 * (@madhusudan977)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014852)
 * Hello,
    I found this article helpful: [ Article ](http://bj2design.com/responsive-images-in-wordpress-4-4/)
 *  Thread Starter [richarduk](https://wordpress.org/support/users/richarduk/)
 * (@richarduk)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014853)
 * Thanks!
 *  [Madhusudan Pokharel](https://wordpress.org/support/users/madhusudan977/)
 * (@madhusudan977)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014854)
 * Hello Richard,
    Were you able to sort it out for header image ?
 *  Thread Starter [richarduk](https://wordpress.org/support/users/richarduk/)
 * (@richarduk)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-7014855)
 * 🙂
    I’ve not looked at it. It’s something I’ll look at one day but in my case
   I’m guessing there’s a very simple workaround of inserting the header image into
   a dummy post, outputting the HTML and then pasting it in to replace the header
   HTML. But if you figure the PHP out paste it here!
 *  [cwiglar](https://wordpress.org/support/users/cwiglar/)
 * (@cwiglar)
 * [9 years, 7 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-8395274)
 * Incase anyone still has this problem, I followed [this article](http://nickohrn.com/2013/09/get-attachment-id-wordpress-header-image/)
   to get the attachment ID then did this:
 *     ```
       function getCurrHeaderSrcSet() {
           $data = get_theme_mod('header_image_data');
           $data = get_object_vars($data);
   
           $attachment_id = is_array($data) && isset($data['attachment_id']) ? $data['attachment_id'] : false;
           $img_srcset = wp_get_attachment_image_srcset( $attachment_id, 'medium' );
   
           return $img_srcset;
       };
       add_filter( 'currHeaderSrcSet', 'getCurrHeaderSrcSet' );
       ```
   
 * Then in the template you can do `srcset="<?php echo apply_filters( 'currHeaderSrcSet','');?
   >"`
    -  This reply was modified 9 years, 7 months ago by [cwiglar](https://wordpress.org/support/users/cwiglar/).

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘srcset for image header (responsive)’ is closed to new replies.

## Tags

 * [srcset](https://wordpress.org/support/topic-tag/srcset/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 7 replies
 * 3 participants
 * Last reply from: [cwiglar](https://wordpress.org/support/users/cwiglar/)
 * Last activity: [9 years, 7 months ago](https://wordpress.org/support/topic/srcset-for-image-header-responsive/#post-8395274)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics