Summary: I have a graphic map on the top of my Categories to show the relative location of some reefs. I am trying to allow the user to select a reef (product) by clicking on the red X on the map. I wrote some test code for two spots, placed it in a Block and referenced and enabled the block in one of the Categories (Manatee). When I save and open my website, it displays the map OK but the mouse selection and callouts do not work. Presently coded at https://reefsnwrecks.com/manatee.html

I have created the HTML code as follows: (Location of .png file shown is for stand alone testing. See Block for actual location) I used https://www.image-map.net/ to create code for image.

Code: enter image description here

When I insert the code into a Block it changes the order of some of the code. Not sure if the reorder is causing problem but I cannot stop Magento from reordering: enter image description here

The mouse flyover callouts seem to work while in the Block page. (See yellow highlighting)

enter image description here

I then simply select that block in the Catagory and Save: enter image description here

When I go to the website it properly displays the map and products but the flyover callouts and href links do not work.

enter image description here

What I have tried:

  1. I am using revision 2.3.4
  2. I have cleared the cache.
  3. I have tried the code by itself and it works fine.
  4. I have tried accessing the website using multiple web browsers, Edge, IE and Chrome.
  5. I have tried with and without built in Category image and description.
  6. I have tried another .png map file and it displays in site so I do not think the old .png is cached.

Any suggestions?

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.