WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Autofocus theme: Alt tags coming up blank (8 posts)

  1. GATEKeeper
    Member
    Posted 5 years ago #

    I just started using the fantastic Autofocus theme from allancole.com, and I'm having one issue. Alt tags for photos are coming in blank, despite having all the info filled in when I upload.

    Any way I can fix this? Does some code just need to go in the functions file?

    Would appreciate any help. Thanks!

  2. esmi
    Forum Moderator
    Posted 5 years ago #

    You can't upload data for the alt attribute (text alternative) of images. You have to add it by hand. Within WP, the alt text/tag normally defaults to the name or title of the image.

  3. GATEKeeper
    Member
    Posted 5 years ago #

    Well, Autofocus inserts the images for you. You just upload it and don't need to insert code into the post (if you do insert the image too, the photo appears twice).

    So, to add in the alt text I'm going to need to change the code in the theme itself which currently does not put anything in the alt tag.

    To reiterate, all the image details are filled in, and yet the theme shows: alt="".

  4. esmi
    Forum Moderator
    Posted 5 years ago #

    I wouldn't have thought that a theme could insert alt text automatically. How would it know what text to use? Image analysis is incredibly complex and, so far, doesn't even come close to what a real human being can do. I don't know the Autofocus theme but are you sure that you're not missing an extra step where you can add the alt text?

    How does it insert the image? With standard markup? Using a shortcode? Or something entirely different?

  5. GATEKeeper
    Member
    Posted 5 years ago #

    The theme just inserts the first image attached to the post. I was hoping it was just a matter of adding an extra line of code somewhere to insert the title of the image in the ALT tag.

    I saw elsewhere that usually it's as simple as adding:

    alt="<?php the_title() ?>"

    But where would I put that in the code below?

    Here's the theme code from the functions.php file:

    // Post Attachment image function. Image URL for CSS Background.
    function the_post_image_url($size=large) {
    
    	global $post;
    	$linkedimgurl = get_post_meta ($post->ID, 'image_url', true);
    
    	if ( $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    	{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    
    			echo ''.$attachmenturl.'';
    		}
    
    	} elseif ( $linkedimgurl ) {
    
    		echo $linkedimgurl;
    
    	} elseif ( $linkedimgurl &amp;&amp; $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    	{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    
    			echo ''.$attachmenturl.'';
    		}
    
    	} else {
    		echo '' . get_bloginfo ( 'stylesheet_directory' );
    		echo '/img/no-attachment.gif';
    	}
    }
    
    // Post Attachment image function. Direct link to file.
    function the_post_image($size=thumbnail) {
    
    	global $post;
    	$linkedimgtag = get_post_meta ($post->ID, 'image_tag', true);
    
    	if ( $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    		{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    
    			echo ''.$attachmentimage.'';
    		}
    
    	} elseif ( $linkedimgtag ) {
    
    		echo $linkedimgtag;
    
    	} elseif ( $linkedimgtag &amp;&amp; $images = get_children(array(
    		'post_parent' => get_the_ID(),
    		'post_type' => 'attachment',
    		'numberposts' => 1,
    		'post_mime_type' => 'image',)))
    		{
    		foreach( $images as $image ) {
    			$attachmenturl=wp_get_attachment_url($image->ID);
    			$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    
    			echo ''.$attachmentimage.'';
    		}
    
    	} else {
    		echo '<img src="' . get_bloginfo ( 'stylesheet_directory' ) . '/img/no-attachment-large.gif" />';
    	}
    }
    
    //Setup Images for Attachment functions
    function image_setup($postid) {
    	global $post;
    	$post = get_post($postid);
    
    	// get url
    	if ( !preg_match('/<img ([^>]*)src=(\"|\')(.+?)(\2)([^>\/]*)\/*>/', $post->post_content, $matches) ) {
    		return false;
    	}
    
    	// url setup
    	$post->image_url = $matches[3];
    	if ( !$post->image_url = preg_replace('/\?w\=[0-9]+/','', $post->image_url) )
    		return false;
    
    	$post->image_url = clean_url( $post->image_url, 'raw' );
    
    	delete_post_meta($post->ID, 'image_url');
    	delete_post_meta($post->ID, 'image_tag');
    
    	add_post_meta($post->ID, 'image_url', $post->image_url);
    	add_post_meta($post->ID, 'image_tag', '<img src="'.$post->image_url.'" />');
    
    }
    
    add_action('publish_post', image_setup);
    add_action('publish_page', image_setup);
    
    // Post Attachment image function for Attachment Pages.
    function the_attachment_image($size=large) {
    	$attachmenturl=wp_get_attachment_url($image->ID);
    	$attachmentimage=wp_get_attachment_image( $image->ID, $size );
    
    	echo ''.$attachmentimage.'';
    }
  6. allancole
    Member
    Posted 5 years ago #

    Hi gate keeper,
    At the moment wp_get_attachment_image doesn’t support any attributes or arguments. So there isn’t an easy way to add alt tags to uploaded images.

    However, linked (From URL) images can have the alt tag added by replacing this line in functions.php:

    add_post_meta($post->ID, 'image_tag', '<img src="'.$post->image_url.'" />');

    with this line:

    add_post_meta($post->ID, 'image_tag', '<img alt="'.the_title().'" src="'.$post->image_url.'" />');

    I did find these two posts in the forum that seems to have a potential fix for the uploaded images but I have not tested the solutions in AutoFocus. Hope that helps. As soon as some wp_get_attachment_image attributes are added to the WP core, I will make updates to AutoFocus.

    1) http://wordpress.org/support/topic/225677
    2) http://wordpress.org/support/topic/166896

  7. GATEKeeper
    Member
    Posted 5 years ago #

    Thanks for the info - I really appreciate!

    And again, love the theme!

  8. tjkoontz21
    Member
    Posted 5 years ago #

    Just a terrific theme. I'd like for the large white post date to disappear. I've been able to alter the code to get only a small gray box with the date at the top of the photographs. Can you give me a hand?

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags