以下程式不支援 IE，因為我不想在我的 Blog 上用 Framework，所以 IE 就沒辦法呈現，哈！只要將以下其中一個的程式碼加在 </body> 之前就可以了。
在[文章]的最[前面]插入地圖
<script type="text/javascript">
function showGoogleMap(pos){
var w=300,h=300,z=14;
try {
var postOuter=document.getElementsByClassName('post-outer');
for(var i=0; i<postOuter.length; i++){
var postLocation=postOuter[i].getElementsByClassName('post-location')[0];
var point=postLocation.getElementsByTagName('a')[0];
if(!point){continue;}
var mapIframe='<iframe width="'+w+'" height="'+h+'" src="'+point.href+'&output=embed&iwloc=z&z='+z+'" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><br />';
var postBody=postOuter[i].getElementsByClassName('post-body')[0];
switch(pos){
case 'loc-a':
postLocation.innerHTML+=mapIframe;
break;
case 'loc-b':
postLocation.innerHTML=mapIframe+postLocation.innerHTML;
break;
case 'post-a':
postBody.innerHTML+=mapIframe;
break;
case 'post-b':
default:
postBody.innerHTML=mapIframe+postBody.innerHTML;
break;
}
}
}catch(e){}
}
showGoogleMap('post-b');
</script>
在[文章]的最[後面]插入地圖
<script type="text/javascript">
function showGoogleMap(pos){
var w=300,h=300,z=14;
try {
var postOuter=document.getElementsByClassName('post-outer');
for(var i=0; i<postOuter.length; i++){
var postLocation=postOuter[i].getElementsByClassName('post-location')[0];
var point=postLocation.getElementsByTagName('a')[0];
if(!point){continue;}
var mapIframe='<iframe width="'+w+'" height="'+h+'" src="'+point.href+'&output=embed&iwloc=z&z='+z+'" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><br />';
var postBody=postOuter[i].getElementsByClassName('post-body')[0];
switch(pos){
case 'loc-a':
postLocation.innerHTML+=mapIframe;
break;
case 'loc-b':
postLocation.innerHTML=mapIframe+postLocation.innerHTML;
break;
case 'post-a':
postBody.innerHTML+=mapIframe;
break;
case 'post-b':
default:
postBody.innerHTML=mapIframe+postBody.innerHTML;
break;
}
}
}catch(e){}
}
showGoogleMap('post-a');
</script>
在[地點]的[前面]插入地圖
<script type="text/javascript">
function showGoogleMap(pos){
var w=300,h=300,z=14;
try {
var postOuter=document.getElementsByClassName('post-outer');
for(var i=0; i<postOuter.length; i++){
var postLocation=postOuter[i].getElementsByClassName('post-location')[0];
var point=postLocation.getElementsByTagName('a')[0];
if(!point){continue;}
var mapIframe='<iframe width="'+w+'" height="'+h+'" src="'+point.href+'&output=embed&iwloc=z&z='+z+'" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe><br />';
var postBody=postOuter[i].getElementsByClassName('post-body')[0];
switch(pos){
case 'loc-a':
postLocation.innerHTML+=mapIframe;
break;
case 'loc-b':
postLocation.innerHTML=mapIframe+postLocation.innerHTML;
break;
case 'post-a':
postBody.innerHTML+=mapIframe;
break;
case 'post-b':
default:
postBody.innerHTML=mapIframe+postBody.innerHTML;
break;
}
}
}catch(e){}
}
showGoogleMap('loc-b');
</script>
實際呈現樣式：
