image mapping code

  • Author
  • #1578746


    i have just produced a image map of the different continents of the world on and was given a code how do i add it to the image (if that’s what i need to do) i want a the map on the home page with links to the different pages.

    The blog I need help with is



    the code was if you need it for anything
    <map id=”imgmap2013122917347″ name=”imgmap2013122917347″><area shape=”poly” alt=”europe” title=”” coords=”674,70,674,116,657,138,657,150,637,138,622,131,606,151,595,169,568,138,523,174,515,150,513,102,561,29″ href=”” target=”” /><area shape=”poly” alt=”north america” title=”” coords=”500,41,479,65,436,86,426,96,417,82,398,142,358,143,329,163,304,190,304,207,316,229,334,235,282,248,275,260,230,228,213,195,196,156,216,126,211,101,180,89,149,97,160,80,194,63,260,62,295,51,342,40,397,31″ href=”” target=”” /><area shape=”poly” alt=”asia” title=”” coords=”924,73,707,66,685,99,687,163,660,190,653,218,674,246,771,257,892,294,918,292″ href=”” target=”” /><area shape=”poly” alt=”africa” title=”” coords=”522,182,560,176,588,195,623,193,662,260,683,258,647,321,685,343,672,385,633,357,616,409,591,414,570,351,567,275,506,278,486,244,496,205″ href=”” target=”” /><area shape=”poly” alt=”australia” title=”” coords=”933,300,1017,327,1031,379,1035,446,973,461,862,407,863,375″ href=”” target=”” /><area shape=”poly” alt=”south america” title=”” coords=”330,261,358,267,389,292,387,310,434,317,419,340,418,364,395,380,386,411,365,411,373,413,377,425,360,434,371,481,343,465,335,429,331,385,324,349,300,323,292,311,299,289,311,259,317,255″ href=”” target=”” /><!– Created by Online Image Map Editor ( –></map>



    First of all, all code must be pasted into the so-called Text editor, not into the Visual editor.
    Then you must make the image mapping apply to the image above; you turn this:
    <img ETC ETC
    to this:
    <img usemap="#imgmap2013122917347" ETC ETC

    a) Image mapping works by setting coordinates: points at fixed distances from the top and the left edge of the image. The image you used to create the code is 1087px long, but the version inserted into your post is scaled down to 474px (because that’s the maximum that can fit in the main column of the theme), so the original coordinates are now way off the mark. If the theme had a fixed width, you should use a 474px wide image to create the code.
    b) Unfortunately the theme is ‘responsive’: it shrinks to adapt to different screen resolutions and mobile devices. So, even if you use a 474px image, the links will again be dislocated when your blog is viewed in a narrow device.
    In short, on themes like 2014 you can’t do what you were looking for.

The topic ‘image mapping code’ is closed to new replies.