เมื่อทำ3ขั้นตอนนี้ครบแล้วมาถึงตอนนี้เราจะมาใส่ google map กันใน blog ของเรากันสักที่นะครับ
สำหรับคนที่จะเอาไปใส่เว็บก็สามารถดัดแปลงจากบทความนี้ได้นะครับเหมือนๆกันครับ
อย่างแรกก็ login เข้า blogครับ
ไปที่รูปแบบ->แก้ไข html ครับ
ใส่โค้ดนี้ใต้้ำ แท็ก head ดังรูปครับ
<script src="http://maps.google.com/maps?file=api&v=2&key=ใส่ key ของคุณตรงนี้" type="text/javascript"> </script>
ในส่วนของ key เราก็ใส่ของเว็บเราที่ไปขอมาจาก google ครับ ใส่ตามรูปเลยครับ
ถ้าใส่ของคนอื่นมันจะมีข้อความเตือนครับ
เสร็จแล้วก็คลิกบันทึกแม่แบบครับครับ
ต่อไปก็ ไปที่ส่งบทความ ->แก้ไขหน้าเว็บครับ
กดเพิ่มหน้าเว็บใหม่ดังรูปครับ
เราก็ใส่ชื่อหน้าที่ต้องการแสดงครับ เช่นเกี่ยวกับเรา เป็นต้นครับหรือจะใส่ตามตัวอย่างก็ไม่เป็นไรครับ
ช่อง editor คลิกแก้ไข html ครับ ด้านล่างตัวเลือกบทความเลือก แสดง html โดยตรง
ช่อง editor ใส่โค้ดนี้ลงไปครับ
<div style="text-align: center;"> <div id="map" style="width:400px;height:400px;float:none;margin:0 auto;border:1px solid black;">Google Map</div> <script type="text/javascript"> if (GBrowserIsCompatible()) { map = new GMap2(document.getElementById("map")); map.addControl(new GLargeMapControl()); p = new GLatLng(ลองติจูด,ละติจูด); map.setCenter(p, 14); var icon = new GIcon(G_DEFAULT_ICON); icon.iconAnchor = new GPoint(25, 35); icon.infoWindowAnchor = new GPoint(25, 5); pm = new GLatLng(ลองติจูด,ละติจูด); gmarker = new GMarker(pm,{}); map.addOverlay(gmarker); }; </script> </div>สังเกตุโค้ดดีๆจะเห็นส่วนที่บอกว่า ละติจูดกับลองติจูด ให้แทนค่าในนั้นด้วยพิกัดที่เราต้องการให้หมุดชี้
ที่เราไปหามานั้นเอง(ตอนที่2)
กดเผยแพร่หน้าครับเป็นอันเสร็จดูตัวอย่างได้ครับที่
http://bloggernaja.blogspot.com/p/googlemap_27.html
ขอบคุณที่อ่านบทความครับ ^^
PRAEWPUN Shoes Says:
9 กรกฎาคม 2553 เวลา 16:50
ทำตามแล้วค่ะ แต่ ทำไมมันโหลดนานจังเลยคะ
ขอบคุณมากนะคะ สำหรับบทความดีๆ มีประโยชน์มากเลยค่ะ
PRAEWPUN Shoes Says:
9 กรกฎาคม 2553 เวลา 16:52
ทำไงให้มันโหลดเร็วขึ้นคะ มันไม่มีแผนที่ขึ้นมาด้วยค่ะ รบกวนด้วยนะคะ
bloger Says:
12 กรกฎาคม 2553 เวลา 00:39
http://theniti.blogspot.com/2010/07/java-script-blogger.html
ลองดูครับ ตอบช้ายังดีกว่าไม่ตอบครับ ^ ^