Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

Add Alt text to Header Image


  #1  
Old Aug 28, 2013, 11:31 AM
IndieJack
 
12 posts · Aug 2013
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.
  #2  
Old Aug 28, 2013, 11:51 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
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.
  #3  
Old Aug 28, 2013, 12:05 PM
IndieJack
 
12 posts · Aug 2013
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?
  #4  
Old Aug 28, 2013, 12:37 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
What is the URL?

Are you sure you mean the logo and not the header image?
  #5  
Old Aug 28, 2013, 03:53 PM
IndieJack
 
12 posts · Aug 2013
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>';
}

Last edited by IndieJack; Aug 28, 2013 at 05:02 PM. Reason: Updatge
  #6  
Old Aug 28, 2013, 05:11 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
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.
  #7  
Old Aug 28, 2013, 05:24 PM
IndieJack
 
12 posts · Aug 2013
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?
  #8  
Old Aug 28, 2013, 05:32 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
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?)
  #9  
Old Aug 28, 2013, 05:36 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Actually check out this thread for an easy way to do it. http://forum.bytesforall.com/showthread.php?t=14758
  #10  
Old Aug 28, 2013, 05:51 PM
IndieJack
 
12 posts · Aug 2013
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.
  #11  
Old Aug 28, 2013, 05:57 PM
IndieJack
 
12 posts · Aug 2013
hmm... I'm not sure where that code goes.
  #12  
Old Aug 28, 2013, 06:18 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
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
  #13  
Old Aug 28, 2013, 06:33 PM
IndieJack
 
12 posts · Aug 2013
Are you talking about making the substitution in the Theme Options or in the .php include page itself?
  #14  
Old Aug 28, 2013, 06:39 PM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
In the theme 'Configure Header Area' option
  #15  
Old Aug 28, 2013, 08:29 PM
IndieJack
 
12 posts · Aug 2013
Okay. I'll give it a shot. Thanks!
  #16  
Old Aug 29, 2013, 09:15 AM
IndieJack
 
12 posts · Aug 2013
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?
  #17  
Old Aug 29, 2013, 09:23 AM
juggledad's Avatar
juggledad
 
23,682 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
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.

Bookmarks

Tags
alt, header, logo, tag

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Overlay text on Header Image Marvin Brown Header configuration & styling 4 Mar 26, 2012 09:48 AM
Add a text under the header image bg74blogger Header configuration & styling 4 Apr 3, 2011 09:22 PM
[SOLVED] How To Add Text Under Header Image robobobo Header configuration & styling 17 Mar 28, 2011 04:22 PM
Text Widget/Box over the Header Image akinfo Header configuration & styling 3 Nov 21, 2010 04:35 PM
[help]A text box above header image RSY Header configuration & styling 1 Jul 7, 2010 10:32 AM


All times are GMT -6. The time now is 04:07 AM.


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