Forum Discussion

amandaghui's avatar
amandaghui
Helper
11 years ago

Custom Content not functioning

Hi!

 

I was hoping I can get a little help on a custom component feature that isn't functioning properly. A 400 px by 400 px image is divided into 4 areas to link to other URLs, works when created with dreamweaver, used the same HTML codes in Studio and the links won't work (used in custom content).

 

Here's the code:

 

---------

 

<#assign message_list_title = text.format("custom.Still_Need_Help.title") />

<img src="image.png" width="240" height="240" alt="socialicon" usemap="socialicon">
<map name="socialicon">
   
    <area shape="rect" coords="0,0,120,120" href="link1" alt="Aide">
    
    <area shape="rect" coords="0,0,240,240" href="link2" alt="Facebook">
    
    <area shape="rect" coords="0,120,120,240" href="link3" alt="Compliment">
    
<area shape="rect" coords="120,120,240,240" href="link4" alt="Probleme">
  </map>

 

--------------------

 

I took out the official URL and used generic names.

Please help!

 

Thanks in advance.

4 Replies

Sort By
  • sunny_mody's avatar
    sunny_mody
    Advisor
    11 years ago

    Hi amandaghui,

     

    I tried doing the same and it worked for me.

    I believe your code isn't working because your area co-ordinates for facebook link might be wrong.

     

    Could you please try the code written below :

     

    Show more
    <#assign message_list_title = text.format("custom.Still_Need_Help.title") />

    <img src="image.png" width="240" height="240" alt="socialicon" usemap="socialicon">
    <map name="socialicon">
        <area shape="rect" coords="0,0,120,120" href="link1" alt="Aide">
        <area shape="rect" coords="120,0,240,120" href="link2" alt="Facebook">
        <area shape="rect" coords="0,120,120,240" href="link3" alt="Compliment">
        <area shape="rect" coords="120,120,240,240" href="link4" alt="Probleme">
      </map>

     

     

    Thanks,

    Sunny

  • amandaghui's avatar
    amandaghui
    Helper
    11 years ago

    Hi there!

    Thanks for looking into it for me. I tried the page again and it's running!

     

     

  • amandaghui's avatar
    amandaghui
    Helper
    11 years ago

    Hi again! sunny_mody 

     

    I just realized that the codes work when I am opening the page with Google Chrome but doesn't seem to display with Firefox.

    Would you know how to go about this?

     

    Thanks a million!

    Amanda

  • sunny_mody's avatar
    sunny_mody
    Advisor
    11 years ago

    Hi amandaghui 

     

    I just tried doing the same in firefox and it worked. Below is the piece of code I have used.

     

    <img src="http://dummyimage.com/400x400/cccccc/000000.png&text=0x2B" alt="" usemap="#map1413871782102">
<map id="map1413871782102" name="map1413871782102">
	<area shape="rect" coords="0,0,200,200" title="google" alt="google" href="http://google.com" target="_blank">
	<area shape="rect" coords="200,0,400,200" title="yahoo" alt="yahoo" href="http://yahoo.com" target="_blank">
	<area shape="rect" coords="0,200,200,400" title="fb" alt="fb" href="http://facebook.com" target="_blank">
	<area shape="rect" coords="200,200,400,400" title="twitter" alt="twitter" href="http://twitter.com" target="_blank">
</map>

     

    Please try using this and see if it works for you.

     

    As far as browser compatibility is in concern, these HTML tags are supported by all browsers.

     

    Thanks,

    Sunny