blogger 在同頁面顯示意見表單(使用 iframe)
2008-07-01:不需要自己亂改了,Blogger in draft 已提供 Embedded comment form 來做這件事。中文改造法可參考 小Ken思路不轉彎: [Blogger in draft] 新功能:Embedded Comment Form和Star Ratings安裝。
我的情形是在後台設定意見表單位置,然後找地方插入 <b:include data='post' name='comment-form'/>
就差不多了。
偶然逛到一個 blog: fREE2Software 發現他的留言表單就直接擺在頁面下方(首頁沒放,單篇文章才有),這配置我在 google 上找了很久都沒見過,現在才看到活生生、還會跑的。立刻看了他 blogger hack 分類下的文章,可惜暫時沒有寫到,於是自己試做,結果摘要:
- 寫成一般的 JavaScript,用修改模板的方式套用。
- 使用流程:按下留言按鈕後,才在頁面上顯示留言表單(iframe)。
- 未解決問題:ie 有時候看不到「視覺驗證」圖片。
- Firefox 頁面未完全載入時,開出來的 iframe 內容不保證正確。要修正的話,可以等頁面完全載入再用 JavaScript 改留言按鈕的 onclick 屬性。
- 表單還是很醜怪…… 所以我最後還是沒用它。
試用方式:
- 在模板的
</header>
前面加上:
<script type='text/javascript'><!-- var iframeHereHeight = '210px'; // iframe 高度 function tryCommentHere(a,href) { // 若已有 iframe, 只做展開/收合 if( a.nextSibling && a.nextSibling.nodeName.toLowerCase()=='iframe' && a.nextSibling.src==href ) { if( a.nextSibling.style.display != 'none' ) { a.nextSibling.style.display = 'none'; } else { a.nextSibling.style.display = 'block'; } return; } // 若沒有 iframe, 建立新的 iframe var newIframeNode = document.createElement('iframe'); newIframeNode.setAttribute('src', href); newIframeNode.setAttribute('style', 'display:"block";'); newIframeNode.setAttribute('margin', 'auto'); newIframeNode.setAttribute('width', '90%'); newIframeNode.setAttribute('height', iframeHereHeight); newIframeNode.setAttribute('frameborder', '1'); newIframeNode.setAttribute('scrolling', 'auto'); if( !a.nextSibling ) { a.parentNode.appendChild(newIframeNode); } else { a.parentNode.insertBefore( newIframeNode, a.nextSibling ); } }; //--></script>
- 然後找到「留下意見」連結的標記,類似
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>留下意見</a>
,把 onclick 內容改為onclick="tryCommentHere(this, this.href); return false;"
就行了。
有 0 個意見
☂