မဂၤလာပါရွင့္။
Spiceworks Myanmar မွ Web Designer အျဖစ္ တာဝန္ယူလုပ္ကိုင္ေနတဲ႔ ဆုရည္ထြန္းပါ။
ဒီတစ္ပတ္မိတ္ဆက္ေပးခ်င္တာကေတာ့ Image Map Generator အေၾကာင္းပါ။ တခ်ိဳ႕ coding ပိုင္းလုပ္ေနတဲ့ သူေတြအေနနဲ႔ေတာ့ image map ဆိုတာဘာလဲ? ဘာအတြက္သုံးတာလဲ? စသျဖင့္ ရင္းႏွီးၿပီးသားျဖစ္ႏိုင္သလို အခုမွ ၾကားဖူးတဲ့လူေတြအတြက္ ညီမက ျပန္ၿပီးေျပာျပေပးသြားပါ့မယ္ရွင့္။
What is an image map generator ?
Image Map Generator ဆိုတာကေတာ့ image ေပၚက အစိတ္အပိုင္းေတြကေန တျခား website တစ္ခု or external link ကို click ေထာက္ၿပီး သြားလို႔ရေအာင္ျပဳလုပ္တာပဲျဖစ္ပါတယ္ရွင့္။
hotspot area တစ္ခုရွိတာနဲ႔ ပုံေပၚမွာ mouse ေထာက္ၿပီး link ရဲ႕ title ေတြ alt tag information ေတြ အျပင္ click ေခါက္ၿပီး link သြားႏိုင္မွာျဖစ္ပါတယ္။
Image Map Generator ကို ကိုယ္တိုင္ detail က်က်ေလ့လာခ်င္တယ္ဆိုရင္ေတာ့ W3School မွာ ေလ့လာႏိုင္ပါတယ္။
Image Map Generator From W3School
ဒီေန႔ ညီမကေတာ့ အခ်ိန္တိုအတြင္း image map ကို ထုတ္ေပးႏိုင္တဲ့ website ကိုမိတ္ဆက္ေပးၿပီး နမူနာလုပ္ျပေပးသြားမွာျဖစ္ပါတယ္ရွင့္။
1. Visit https://www.image-map.net/
ပထမအဆင့္အေနနဲ႔ free online image map ထုတ္ယူဖို႔ရန္အတြက္ image map website ကိုအရင္သြားရပါမယ္။
https://www.image-map.net
2. Add or upload your image
ဒုတိယအဆင့္အေနနဲ႔ဆိုရင္ေတာ့ Select Image from My PC ( or ) Load Image from website ဆိုတဲ့ button ႏွစ္ခုထဲက မိမိအဆင္ေျပမည့္ နည္းလမ္းကိုေ႐ြးၿပီး image map ျပဳလုပ္ခ်င္တဲ့ ပုံကို upload တင္ေပးရပါမယ္။
ညီမက world map image ပုံတစ္ခုကို upload တင္လိုက္ပါ့မယ္။ေအာက္ပါပုံအတိုင္း ရရွိမွာျဖစ္ပါတယ္။
3. Draw your shapes on the image
image map ျပဳလုပ္မယ့္ပုံကို upload တင္ၿပီးရင္ေတာ့ ပုံထဲက link သြားခ်င္တဲ့ အပိုင္းကို select ျပဳလုပ္ေပးၿပီး shape ျပဳလုပ္ေပးပါ။
မိမိျပဳလုပ္ခ်င္တဲ့ shape ေပၚမူတည္ၿပီး rect (or) poly (or) circle စသျဖင့္ shape ပုံစံကိုေ႐ြးခ်ယ္ႏိုင္ပါတယ္။
image ေပၚမွာ shape ျပဳလုပ္ၿပီးသြားရင္ေတာ့ ထို shape ျပဳလုပ္ထားတဲ့ေနရာကိုႏွိပ္လိုက္ရင္သြားမယ့္ link setting ထည့္ေပးပါ။
4. Add links and grab the image map generator code
ၿပီးရင္ေတာ့ Show Me The Code! button ကိုႏွိပ္ၿပီး ရလာတဲ့ code ကို copy ယူပါ။
5. That’s it – you now have the HTML code for your image map. You can now insert it into your web page or WordPress page.
ရလာတဲ့ codeကို image map အေနျဖင့္ အသုံးျပဳမည့္ html coding မွာေသာ္လည္းေကာင္း wordpress မွာပါ ထည့္သြင္းအသုံးျပဳလို႔ရမွာျဖစ္ပါတယ္ရွင့္။
အဆုံးထိဖတ္ေပးတဲ့အတြက္ ေက်းဇူးအထူးတင္ရွိပါတယ္။
မိမိတို႔ရဲ႕ product ေတြကို customer ေတြဆီအလ်င္အျမန္ေရာက္ရွိေအာင္ အေထာက္အကူေပးႏိုင္တဲ့ website ေတြဖန္တီးခ်င္တယ္ဆိုရင္ Spiceworks Myanmar Company ကိုအခ်ိန္မေ႐ြးဆက္သြယ္ေမးျမန္းႏိုင္ပါတယ္ရွင့္။
https://www.spiceworksmyanmar.com/contact/
