WordPress.org

1. benlovejoy
   Member
   Posted 10 months ago #
   

   This is a bizarre one!

   On this page:
   http://wp.beautifullytold.com/?page_id=168
   I have a photo with an image-map defining two areas (one for each photo-frame). The wedding one works, the portrait one doesn't (the pointer doesn't change when you mouse-over it, and nothing happens when you click on it).

   The HTML is as follows (ignore the destinations of the links, they will be changed):

   <img src="http://wp.beautifullytold.com/wp-content/uploads/london-wedding-photographer.jpg" alt="" width="900" height="503" usemap="#Map" border="0" />
   
   <map name="Map"> <area shape="rect" coords="267,114,452,279" href="wedding/index.html" alt="Wedding photographer London" /></map>
   
   <map name="Map"> <area shape="rect" coords="532,114,717,279" href="portrait/index.html" alt="Portrait photographer London" /></map>

   The HTML is pasted in directly from my existing non-Wordpress site (just the image URL updated) where both links work perfectly. Can anyone shed any light?

2. alchymyth
   The Sweeper & Moderator
   Posted 10 months ago #
   

   seems to work this way:

   <map name="Map">
   <area shape="rect" coords="267,114,452,279" href="wedding/index.html" alt="Wedding photographer London">
   <area shape="rect" coords="532,114,717,279" href="portrait/index.html" alt="Portrait photographer London">
   </map>

   http://www.w3schools.com/tags/tag_map.asp

3. benlovejoy
   Member
   Posted 10 months ago #
   

   Just changed it to that, and same result - wedding works, portrait doesn't.

   I'm very bemused!

4. alchymyth
   The Sweeper & Moderator
   Posted 10 months ago #
   

   right now, there is no change in the code visible in your site;
   have you change it back?

   have you cleared any existing browser or other caches after your changes?

5. benlovejoy
   Member
   Posted 10 months ago #
   

   That's interesting - I didn't change it back, but it has indeed been changed back. I just changed it again, and when you press the Update page button it changes the syntax to the original, so I think WordPress is correcting the syntax.

   I don't think the syntax is the issue in any case as the original code works on my existing site: http://www.beautifullytold.com

6. alchymyth
   The Sweeper & Moderator
   Posted 10 months ago #
   

   in your original site, you have the syntax as in accordance with the html link I posted:

   from the browser html of the last link:
   

   <map name="Map">
       <area shape="rect" coords="267,114,452,279" href="wedding/index.html" alt="Wedding photographer London">
       <area shape="rect" coords="532,112,717,280" href="portrait/index.html" alt="Portrait photographer London">
     </map>

   I just changed it again, and when you press the Update page button it changes the syntax to the original, so I think WordPress is correcting the syntax.

   unlikely - what method are you using to edit the template (template-page-no-title.php ?) ?

   edit:
   just realized that you are using that in a psge's content;
   are you using the html setting of the editor?

7. benlovejoy
   Member
   Posted 10 months ago #
   

   I'm editing the page directly, and yes, using the HTML setting.

   Ok, the mystery deepens. I just double-checked the original site and the syntax I'm pasting in is the same as the syntax you posted. But when I save the page and update it, WordPress is inserting spurious

   </map> <map name="Map">

   tags in between the two area shape tags! There must be a setting somewhere that allows WordPress to 'correct' HTML syntax ... off to do some googling.

8. benlovejoy
   Member
   Posted 10 months ago #
   

   Hmm, in Settings - Writing there is a checkbox:

   WordPress should correct invalidly nested XHTML automatically

   However, unchecking this hasn't changed the behaviour.

9. benlovejoy
   Member
   Posted 10 months ago #
   

   Ok, that was it :-)

   After unchecking that, I cleared the cache again, restarted the browser and now it's leaving the code alone and both links work.

   Thanks for your help.

Reply

You must log in to post.