Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm currently creating a custom WordPress theme and using the WordPress Options Framework plugin to make a custom options page for my client. I'm able to easily create an image upload option and can get that uploaded image to show up where I intend it to within my theme's framework. Within my options file (required for the plugin to work), the array I've created for the image upload functionality is the following code:

$options[] = array(
'name' => __('Header Overlay', 'options_framework_theme'),
'desc' => __('This creates a full size uploader that previews the image.', 'options_framework_theme'),
'id' => 'header_overlay',
'type' => 'upload');

Then, within the theme I call that uploaded image with the following code:

<img src="<?php echo of_get_option('header_overlay', 'no entry'); ?>" />

Like I mentioned this all works perfectly. However, what I cannot figure out is how to extract the Alt Text from the image upload dialogue and including it as an echo within the img src tag in the theme. Is there anything I can add within the array above to create something to echo within the theme?

[update]
If I do a search for the text of_get_option throughout the files, I find one file. This is the code:

if ( ! function_exists( 'of_get_option' ) ) : 
    function of_get_option( $name, $default = false ) { 
        $config = get_option( 'optionsframework' ); 
        if ( ! isset( $config['id'] ) ) { 
            return $default; 
        } 
        $options = get_option( $config['id'] ); 
        if ( isset( $options[$name] ) ) { 
            return $options[$name]; 
        } 
        return $default; 
    } 
endif;
share|improve this question
    
I suppose of_get_option only returns a string with the image source. Can't this be set to return the full attachment object? –  brasofilo Dec 6 '12 at 15:23
    
Thanks for your reply. That sounds like a good suggestion. However, I wouldn't even know where to start to make that happen. If I do a search for the text of_get_option throughout the files, I find one file. This is the code: if ( ! function_exists( 'of_get_option' ) ) : function of_get_option( $name, $default = false ) { $config = get_option( 'optionsframework' ); if ( ! isset( $config['id'] ) ) { return $default; } $options = get_option( $config['id'] ); if ( isset( $options[$name] ) ) { return $options[$name]; } return $default; } endif; –  Brandon Dec 7 '12 at 0:02
    
I've included your code in the Question, you can edit and update it whenever needed to include more information. In that function, I'd inspect the variable $options. If you do a print_r or var_dump maybe the site will break. Check this search results for how to debug with FirePHP/FireBug. This option is also good. –  brasofilo Dec 7 '12 at 1:09
    
Thanks again @brasofilo! I'll try FirePHP. –  Brandon Dec 10 '12 at 12:48
    
I was just mentioning this to the plugin author yesterday.... well similar. Personally I'd prefer if the upload saved the attachment ID, then I'd be able to control what size the image is displayed at and you'd be able to access the alt text. Just not sure when I will get to try to create a pull request for him to look at. In theory you can catch this info when the script sends the img src back to the text input, but I'm not sure how you'd do it and still maintain backwards compatibility for all those who are relying on this plugin. –  helgatheviking Jan 18 '13 at 20:17
show 2 more comments

1 Answer

There are 2 potential solutions to this.

Solution 1: Since Options Framework only gives you an uploader, I assume you are entering the alt text manually on the WP admin side. You could create a text option for the alt text so you can enter it from your custom options panel. Then just echo that option where you need it:

$options[] = array(
    'name' => __('Header Overlay Alt Text', 'options_framework_theme'),
    'desc' => __('Alternate text for your header overlay image.', 'options_framework_theme'),
    'id' => 'header_overlay_alt',
    'type' => 'text');

Then in your template:

<img src="<?php echo of_get_option('header_overlay'); ?>" alt="<?php echo of_get_option('header_overlay_alt'); ?>">

OR

Solution 2: (This one more directly answers your question.)
a) Retrieve the attachment ID based on the URL and b) use that ID to retrieve the corresponding alt text. (Credit for part a goes to Philip Newcomer: http://philipnewcomer.net/2012/11/get-the-attachment-id-from-an-image-url-in-wordpress/.)

function pn_get_attachment_id_from_url( $attachment_url = '' ) {

global $wpdb;
$attachment_id = false;

// If there is no url, return.
if ( '' == $attachment_url )
    return;

// Get the upload directory paths
$upload_dir_paths = wp_upload_dir();

// Make sure the upload path base directory exists in the attachment URL, to verify that we're working with a media library image
if ( false !== strpos( $attachment_url, $upload_dir_paths['baseurl'] ) ) {

    // If this is the URL of an auto-generated thumbnail, get the URL of the original image
    $attachment_url = preg_replace( '/-\d+x\d+(?=\.(jpg|jpeg|png|gif)$)/i', '', $attachment_url );

    // Remove the upload path base directory from the attachment URL
    $attachment_url = str_replace( $upload_dir_paths['baseurl'] . '/', '', $attachment_url );

    // Finally, run a custom database query to get the attachment ID from the modified attachment URL
    $attachment_id = $wpdb->get_var( $wpdb->prepare( "SELECT wposts.ID FROM $wpdb->posts wposts, $wpdb->postmeta wpostmeta WHERE wposts.ID = wpostmeta.post_id AND wpostmeta.meta_key = '_wp_attached_file' AND wpostmeta.meta_value = '%s' AND wposts.post_type = 'attachment'", $attachment_url ) );

}

return $attachment_id;
}

$your_id = pn_get_attachment_id_from_url(of_get_option('header_overlay'));
$alt_text = get_post_meta($your_id, '_wp_attachment_image_alt', true);

Then echo it out as needed:

<img src="<?php echo of_get_option('header_overlay'); ?>" alt="<?php echo $alt_text; ?>">

I know this question is 6 months old, but even if the OP has moved on, hopefully this answer will help someone!

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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