Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)
-   -   Add Alt text to Header Image (http://forum.bytesforall.com/showthread.php?t=20837)

IndieJack Aug 28, 2013 10:31 AM

Add Alt text to Header Image
 
How do I add an "Alt" tag to the Header Logo? By making the image clickable the "Title" tag is added but I can't find where to add the "Alt" tag.

juggledad Aug 28, 2013 10:51 AM

The alt tag is automatically set to the 'Site Title' (dashboard->settings->general->site title)

If you want it something else, you will have to edit the theme code in bfa-header-config.php in the 'logo' section.

IndieJack Aug 28, 2013 11:05 AM

Thanks, Juggledad, According to the code I'm seeing there is no "Alt" tag on my logo image. If I make the image Clickable a "Title" tag is added (as the Page Name) which is fine but I want to add an "Alt" tag, too. What directory is the file you mentioned located?

juggledad Aug 28, 2013 11:37 AM

What is the URL?

Are you sure you mean the logo and not the header image?

IndieJack Aug 28, 2013 02:53 PM

Sorry, I mean the Header Image. www.indiejack.com I want an "Alt" tag on my header image. Does it matter if the Header Image is "Clickable?"

I found this is, under Header Image, in the file you referenced earlier:

Quote:

if ( $bfa_ata['header_image_clickable'] == "Yes" ) {
echo '<div class="clickable"><a class="divclick" title="';
bloginfo('name'); echo '" href ="' . $homeURL . '/">&nbsp;</a></div>';
}

juggledad Aug 28, 2013 04:11 PM

Yup, that is the code you will have to change

But why do you need it? It will only show if there is no image. And yes the image will have to be clickable otherwise it is the background for the div.

IndieJack Aug 28, 2013 04:24 PM

Where do I place the Alt code?

Quote:

Does this work:
...href ="' . $homeURL . '/" alt="Alt Text">
I want the Alt tag because that is the value a screen reader (for visually impaired users) speaks when passing over or touching (in the case of VoiceOver on an iOS devise.) It's to help users navigate the site.

Are there any other ways to accomplish the Alt tag for the Header Image?

juggledad Aug 28, 2013 04:32 PM

Quote:

I want the Alt tag because that is the value a screen reader (for visually impaired users) speaks when passing over or touching (in the case of VoiceOver on an iOS devise.) It's to help users navigate the site.
Now that's a great reason.if you can wait a few days, I may try to write a patch to allow you to add the alt tag in the theme options, ie a check box and spot to enter the alt tag.

I don't have access to my test environment at the moment. I'm actually 'enjoying' a brief stay in the hospital with diverticulitis and hope to be home by Friday. (Can you tell i'm bored?)

juggledad Aug 28, 2013 04:36 PM

Actually check out this thread for an easy way to do it. http://forum.bytesforall.com/showthread.php?t=14758

IndieJack Aug 28, 2013 04:51 PM

Tremendous! Yes, I'll wait. That would be wonderful. A win for Accessibility! Thanks, Juggledad! Good luck on the hospital stay.

I guess this means I need to add the patch to keep my header image and favicon in tact, too. Right? I read about that in another post.

IndieJack Aug 28, 2013 04:57 PM

hmm... I'm not sure where that code goes.

juggledad Aug 28, 2013 05:18 PM

No, you can substitute an <img......> in place if the %image try this - make sure to set the widget and height correctly.so substitute this
HTML Code:

<div id="imagecontainer" class="header-image-container"><img src="http://yourdomain.com/wp-content/themes/atahualpa/images/header/your image.png" alt="Your alt text here" width="918" height="90" /></div>
For the %image

IndieJack Aug 28, 2013 05:33 PM

Are you talking about making the substitution in the Theme Options or in the .php include page itself?

juggledad Aug 28, 2013 05:39 PM

In the theme 'Configure Header Area' option

IndieJack Aug 28, 2013 07:29 PM

Okay. I'll give it a shot. Thanks!

IndieJack Aug 29, 2013 08:15 AM

Thanks Juggledad, that worked! The header image's Alt tag is now announced. After making the change, the "Clickable" function has gone away. How do I get that back?

juggledad Aug 29, 2013 08:23 AM

You would have to add that HTML in also. The way to see what you need is remove what you just put in (put it in a text file to save) and put the %image back in. Go visit the page and use the browsers view source option to see the generated HTML.

Now browse thru and locate the header code and see what was generated for the clickable. Next add that into the code you now have and test it out.


All times are GMT -6. The time now is 07:59 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.