WordPress.org

1. jamida
   Member
   Posted 2 years ago #

   I'm trying to use an HTML MAP tag within wordpress and it's not working. Specifically I'm trying to mouse over some areas of an image that I'm posting and have extra text popup when the mouse in in the right position.

   The same tag and code is working locally on my PC, but not when I upload it to my site. The image is there and the map coords are visible when I hit view-source, but I'm not seeing the mouse over behavior.

   There's one oddity that seems to be automatically generated by wordpress that may account for the broken behavior... between the closing /> for the image and the opening <MAP for the map... wordpress is inserting a
   tag and nothing I can do to edit the file appears to get rid of it.

   I'm looking for any solution to this problem. Note, FWIW, I've even tried a completely different solution, but as it's so different I figure I'll save that for a separate post.

   Thanks

2. Daynah
   Member
   Posted 2 years ago #

   Hi Jamida,

   I'm not sure if this is the best way of fixing it, but you may need to edit the kses.php file and add

   'map' => array( 'name' => array());

   to the file. I wrote a short blog post about something similar here:
   Editing kses.php

3. jamida
   Member
   Posted 2 years ago #

   Thanks phpprincess, but I don't think that's it as the code is showing up when I hit view source, it's just not working right. Here's a sample:

   <img class="aligncenter size-full wp-image-312" src="http://newswithnumbers.com/wordpress/wp-content/uploads/2009/07/HealthCareQuality.gif" USEMAP="#HealthCareQuality" width="800" height="600" />
   <MAP NAME="HealthCareQuality">
   <AREA SHAPE='rect' COORDS='113,91,121,99' TITLE='Japan HDI: 8, Infant Mort 3, Life Expect 82.3'>
   <AREA SHAPE='rect' COORDS='92,107,100,115' TITLE='Iceland HDI: 1, Infant Mort 2, Life Expect 81.5'>
   </MAP>

   I'm in preview mode, btw in case this makes a diff. I get this up there by first inserting the image in the normal way. Then I edit the HTML to add the "usemap" attribute to the IMG tag and then add the rest of the <MAP> stuff.

   So... it's not like wordpress is blocking the tags, but instead is somehow just making it not work.

4. iridiax
   Member
   Posted 2 years ago #

   I'm in preview mode, btw in case this makes a diff.

   Do you mean the visual editor? You can't use the visual editor to enter code, and you should never switch back and forth between the visual and html editors while editing a post.

5. jamida
   Member
   Posted 2 years ago #

   No, I do not mean the visual editor... I mean that I have not published this post and am viewing the page by clicking the "preview" button. The "view source" snippet I posted above was grabbed that way. (But I was unaware of any problems in switching back and forth between the 2 modes. So I'll keep that in mind.)

   I am reading more into the kses.php suggestion earlier. It looks like the default <img> tag does not allow for a "usemap" attribute. So I added it. However that's no help. I may need to add an <area> tag and a <map> tag to that file to get the full functionality I'm looking for.

   I'm surprised to find that when I add that HTML code, I put the new stuff in CAPS. Here's the kicker... SOME of the stuff wordpress converted to lowercase, others it left as caps. Perhaps a sign of what the kses.php file is processing/mangling?

6. iridiax
   Member
   Posted 2 years ago #

   Ideas:

   Try using the XHTML (what WordPress uses) version of the map code (lowercase, all tags closed).

   Also try putting your map code all on one line so that WordPress isn't trying to add paragraphs or line breaks to it.

   Deselect "WordPress should correct invalidly nested XHTML automatically" in Dashboard -> Settings -> Writing.

7. jamida
   Member
   Posted 2 years ago #

   I think the problem may be related to the fact that these images, despite my best efforts otherwise, are being re-sized by the system. I've started a new question-thread on this issue.

   thanks all!

Topic Closed

This topic has been closed to new replies.