Modify Templates

Modify Templates

出自LifeType 中文文件計畫

(修訂版本間差異)
跳轉到: 導航, 搜尋
(讓文章 連結 分類 等列表可收折)
當前修訂版本 (2006年8月27日 (日) 18:33) (檢視原始碼)
(增加MyShare。)
 
(13個中途的修訂版本沒有顯示。)
第16行: 第16行:
</smarty>
</smarty>
-
原文發表在 [http://ajer001.blog.twntwn.info/post/1/461 阿駕零零壹 &copy; 學習筆記]。
+
原文發表在 [http://twntwn.info/blog/ajer001/archives/461 阿駕零零壹 &copy; 學習筆記]。
第28行: 第28行:
</smarty>
</smarty>
-
原文發表在 [http://ajer001.blog.twntwn.info/post/1/1160 阿駕零零壹 &copy; 學習筆記]。
+
原文發表在 [http://twntwn.info/blog/ajer001/archives/1160 阿駕零零壹 &copy; 學習筆記]。
第57行: 第57行:
</smarty>
</smarty>
-
原文發表在 [http://ajer001.blog.twntwn.info/post/1/260 阿駕零零壹 &copy; 學習筆記]。
+
原文發表在 [http://twntwn.info/blog/ajer001/archives/260 阿駕零零壹 &copy; 學習筆記]。
 +
 
== 讓文章 連結 分類 等列表可收折 ==
== 讓文章 連結 分類 等列表可收折 ==
第78行: 第79行:
<!-- 下一行 加上標題語法 -->
<!-- 下一行 加上標題語法 -->
-
<a xhref="javascript:expandIt(document.getElementById('recentpost'))">最新文章</a>
+
<a href="javascript:expandIt(document.getElementById('recentpost'))">最新文章</a>
<ul id="recentpost" name="recentpost" style="display: none;">
<ul id="recentpost" name="recentpost" style="display: none;">
第84行: 第85行:
{assign var="passwordObj" value=$post->getFieldObject("password_field")}
{assign var="passwordObj" value=$post->getFieldObject("password_field")}
{if $passwordObj != "" &&  $passwordObj->getValue() != ""}
{if $passwordObj != "" &&  $passwordObj->getValue() != ""}
-
<li><a title="Secert Post, Sorry" xhref="{$url->postLink($post)}">{$post->getTopic()}</a></li>
+
<li><a title="Secert Post, Sorry" href="{$url->postLink($post)}">{$post->getTopic()}</a></li>
{else}
{else}
-
<li><a title="{$post->getText()|truncate:150:"..."|strip_tags|escape}" xhref="{$url->postLink($post)}">{$post->getTopic()}</a></li>
+
<li><a title="{$post->getText()|truncate:150:"..."|strip_tags|escape}" href="{$url->postLink($post)}">{$post->getTopic()}</a></li>
{/if}
{/if}
{/foreach}
{/foreach}
第102行: 第103行:
<!-- 在此放入標題語法 -->
<!-- 在此放入標題語法 -->
{foreach from=$mylinkscategories name=linkcategory item=linkcategory}
{foreach from=$mylinkscategories name=linkcategory item=linkcategory}
-
<b><a xhref="javascript:expandIt(document.getElementById('lnk{$smarty.foreach.linkcategory.iteration}'))"> {$linkcategory->getName()} </a></b><br />
+
<b><a href="javascript:expandIt(document.getElementById('lnk{$smarty.foreach.linkcategory.iteration}'))"> {$linkcategory->getName()} </a></b><br />
<ul id="lnk{$smarty.foreach.linkcategory.iteration}" name="lnk{$smarty.foreach.linkcategory.iteration}" style="display: none;">
<ul id="lnk{$smarty.foreach.linkcategory.iteration}" name="lnk{$smarty.foreach.linkcategory.iteration}" style="display: none;">
{foreach from=$linkcategory->getLinks() item=link}
{foreach from=$linkcategory->getLinks() item=link}
-
<li><a xhref="{$link->getUrl()}" title="{$link->getDescription()}">{$link->getName()}</a></li>
+
<li><a href="{$link->getUrl()}" title="{$link->getDescription()}">{$link->getName()}</a></li>
{/foreach}
{/foreach}
</ul>
</ul>
第112行: 第113行:
</smarty>
</smarty>
-
原文有最新文章、最新迴響、分類、連結等的語法,因為太長,所以需要完整語法請參考 [http://ajer001.blog.twntwn.info/post/1/1144 阿駕零零壹 &copy; 學習筆記]。
+
原文有最新文章、最新迴響、分類、連結等的語法,因為太長,所以需要完整語法請參考 [http://twntwn.info/blog/ajer001/archives/1144 阿駕零零壹 &copy; 學習筆記]。
 +
 
== 收藏文章的連結 ==
== 收藏文章的連結 ==
 +
目前網路上提供的文章連結收藏、分享的服務很多,當你寫了一篇好文章的時候,也應該方便一下讀者們,讓他們可以方便的收藏文章。
 +
*說明:
 +
:目前有 Delicious、HEMiDEMi、Furl、Technorati,會陸續增加,或參考後面增加連結說明。
 +
 +
*使用方法
 +
:將語法貼到文章適當位置即可。
 +
 +
<smarty>
 +
+<a href="http://del.icio.us/login/?url={$url->postPermalink($post)}&title={$post->getTopic()}" title="Add To Your Del.icio.us" target="_blank">Del.icio.us</a>
 +
+<a href="http://www.furl.net/storeIt.jsp?p=1&t={$post->getTopic()}&u={$url->postPermalink($post)}" title="Add To Your Furl" target="_blank">Furl</a>
 +
+<a href="http://www.hemidemi.com/user_bookmark/new?title={$post->getTopic()}&url={$url->postPermalink($post)}" target="_blank" title="Add To Your HEMiDEMi" >HEMiDEMi</a>
 +
+<a href="http://technorati.com/faves?add={$url->postPermalink($post)}" target="_blank" title="Add To Your Technorati Favorites" >Technorati</a>
 +
+<a href="http://myshare.url.com.tw/index.php?func=newurl&url={$url->postPermalink($post)}&desc={$post->getTopic()}" target="_blank" title="Add To Your MyShare" >MyShare</a>
 +
</smarty>
 +
 +
*增加連結:
 +
:分析他們的連結,並且搭配 {$url->postPermalink($post)} 取得文章連結、{$post->getTopic()} 取得文章標題。
 +
 +
 +
原文發表在 [http://twntwn.info/blog/ajer001/archives/1143 阿駕零零壹 &copy; 學習筆記]。
== 變更字體大小的JavaScript ==
== 變更字體大小的JavaScript ==
 +
由於每個人習慣的字體大小不同,而且閱讀的時候字體大一點真的會比較舒服,利用這個語法,就可以自行放大縮小字體。
 +
 +
*使用教學:
 +
1. 編輯「header.template」,將下面語法放入<head></head>之間。
 +
<smarty>
 +
{literal}<script language="javascript" type="text/javascript">
 +
function doZoom(size){
 +
document.getElementById('content').style.fontSize=size+'px'}
 +
</script>{/literal}
 +
 +
P.S. 其中,content 請改成你希望放大區域的 CSS id。
 +
</smarty>
 +
 +
2. 將下面語法放入適當位置。
 +
<smarty>
 +
<a href="javascript:doZoom(20)">放大</a>
 +
<a href="javascript:doZoom(16)">正常</a>
 +
<a href="javascript:doZoom(12)">縮小</a>
 +
 +
P.S. 括號內的數字代表字體大小,可自行修改。
 +
</smarty>
 +
 +
原文發表在 [http://twntwn.info/blog/ajer001/archives/1075 阿駕零零壹 &copy; 學習筆記]。
 +
 +
 +
== 修改每月彙整為下拉式選單 ==
 +
隨著你的Blog使用時間越來越久,就會看到旁邊的每月彙整越來越長,這時候能夠收藏起來當然最好。
 +
 +
*使用方法:
 +
:使用下面語法替換,並且加上適當的區塊語法。
 +
<smarty>
 +
{literal}<script language="javascript" type="text/javascript">
 +
function MM_jumpMenu(targ,selObj,restore){ //v3.0
 +
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
 +
if (restore) selObj.selectedIndex=0;
 +
}</script>{/literal}
 +
<!-- 加入區塊標題語法 -->
 +
<select name="menu_menu" onChange="MM_jumpMenu('parent',this,0)">
 +
<option>每月彙整</option>
 +
{foreach from=$archives item=archivelink}
 +
<option value="{$archivelink->getUrl()}">{$archivelink->getName()} [{$archivelink->getNumArticles()}]</option>
 +
{/foreach}
 +
</select>
 +
<!-- 加入區塊結尾語法 -->
 +
</smarty>
 +
 +
原文發表在 [http://twntwn.info/blog/ajer001/archives/199 阿駕零零壹 &copy; 學習筆記]。
 +
 +
 +
== 顯示 Blog 訪客人數等統計資訊 ==
 +
管理介面中,有個顯示閱讀總數、文章總數、迴響總數、引用總數的地方。我們將這個拿到模板中來顯示。
 +
 +
*使用方法:
 +
:將下面語法,你需要的項目,放到模板適當位置即可。
 +
<smarty>
 +
閱讀總數:{$blog->getViewedTotal()}
 +
文章總數:{$blog->getTotalPosts()}
 +
迴響總數:{$blog->getTotalComments()}
 +
引用總數:{$blog->getTotalTrackbacks()}
 +
</smarty>
 +
 +
原文發表在 [http://twntwn.info/blog/ajer001/archives/222 阿駕零零壹 &copy; 學習筆記]。
 +
 +
 +
== 顯示作者資料 ==
 +
管理介面中,有個「使用者設定」,你可以在裡面設定照片、自我介紹等等。下面提供您顯示的辦法。
 +
 +
*使用方法:
 +
:將下面的語法,放到你想要顯示的位置,並加上適當的區塊語法。
 +
<smarty>
 +
{assign var=blogOwner value=$blog->getOwnerInfo()}
 +
{if $blogOwner->getfullName()==""}
 +
Blogger:{$blogOwner->getUsername()}<br/>
 +
{else}
 +
Blogger:{$blogOwner->getfullName()}<br/>
 +
{/if}
 +
{if $blogOwner->hasPicture()}
 +
{assign var=picture value=$blogOwner->getPicture()}
 +
<img src="{$url->resourcePreviewLink($picture)}" title="{$blogOwner->getUsername()}" /><br>
 +
{/if}
 +
{if $blogOwner->getfullName()!=""}
 +
About:{$blogOwner->getAboutMyself()}
 +
{/if}
 +
</smarty>
 +
 +
原文發表在 [http://twntwn.info/blog/ajer001/archives/221 阿駕零零壹 &copy; 學習筆記]。
 +
 +
 +
== 解決 連結過長 無法自動換行 的問題 ==
 +
這個問題通常會出現在 Summary 或是 sidebar 上面,據說出問題的都是 Firefox,XD。
 +
 +
*修改辦法:
 +
:將你要修改的地方,利如:
 +
<smarty>
 +
{$comment->getText()}
 +
 +
{$post->getText()}
 +
</smarty>
 +
:在這個裡面加上 '''|regex_replace:"/http:[^ ]+/":" [link] "''',例如:
 +
<smarty>
 +
{$comment->getText()|strip_tags|truncate:100:"..."|regex_replace:"/http:[^ ]+/":" [link] "}
 +
 +
{$post->getText()|strip_tags|truncate:100:"..."|regex_replace:"/http:[^ ]+/":" [link] "}
 +
</smarty>
 +
:如此一來就會用 [link] 連結,來取代原本的網址了。
 +
 +
原文發表在 [http://blog.nlhs.tyc.edu.tw/post/2/53 lss實驗室]。
 +
 +
== 要如何加入 JavaScript 到模版中才不會出問題 ==
 +
 +
在模版的語法中,'''{''' 與 '''}''' 是保留字,所以不能使用。如果你的 JavaScript 中包含這兩個字元,那麼當然就會出錯。解決方式如下:
 +
 +
<php>
 +
{literal}
 +
你的 JavaScript 程式
 +
{/literal}
 +
</php>
 +
 +
這樣就可以了。LifeType 的模版引擎就會把這一段文字當成純文字來看待。

當前修訂版本

目錄

編輯文章 與 管理迴響的連結

編輯文章或管理迴響時,通常必須登入到管理介面,如果是舊文章就很麻煩了。在文章中加入連結,方便編輯與管理。

  • 使用方法:
修改模板,將下面語法放到適當位置即可。
管理前,請先登入管理區。
  • 修改文章:

  1. <a href="{$url->getUrl("/admin.php")}?op=blogSelect&blogId={$blog->getId()}&action=editPost&postId={$post->getId()}" target="_blank">修改文章</a>
  • 管理迴響:

  1. <a href="{$url->getUrl("/admin.php")}?op=blogSelect&blogId={$blog->getId()}&action=editComments&articleId={$post->getId()}" target="_blank">管理迴響</a>

原文發表在 阿駕零零壹 © 學習筆記


發表迴響時 顯示預設標題

目前的模板,都是沒有標題,而通常訪客也都不會填寫,所以加上預設會變成「Re:文章標題」的語法。這樣從 Comment RSS、Sidebar 看也會知道是回覆哪一篇文章。

  • 修改辦法:
編輯「commentform.template」,找到標題的位置,沒有就自己增加。加上「value="Re:{$post->getTopic()}"」,例如:

  1. <input id="subject" name="commentTopic" value="Re:{$post->getTopic()}" >

原文發表在 阿駕零零壹 © 學習筆記


秘密文章

外掛程式中,有個 秘密文章,不過因為是外掛的關係,在文章列表、RSS等等許多地方,都會露餡。所以提供一下補強的辦法。

  • Mark 提供的版本:

  1. {assign">assign">assign var=isSecretField value=$post->getFieldObject("password_protected")}
  2. {if empty($isSecretField) || $isSecretField->getValue() != 1}
  3. 沒有密碼要顯示的東西
  4. 有密碼要顯示的東西
  5. {/if}
  • 來源不詳:

  1. {foreach from=$recentposts item=post}
  2. {assign">assign">assign var="passwordObj" value=$post->getFieldObject("password_field")}
  3. {if $passwordObj != "" && $passwordObj->getValue() != ""}
  4. 有密碼要顯示的東西
  5. 沒有密碼要顯示的東西
  6. {/if}
  7. 其中,要注意 foreach 的變數。

原文發表在 阿駕零零壹 © 學習筆記


讓文章 連結 分類 等列表可收折

當文章、分類、連結等越來越多後,會發現列表「樂樂長」,這時候就要可以收納一下。

  • 說明:
1. 已經順便加上了秘密文章的判斷。
2. 對 Firefox 和 IE 都確定沒有問題。
3. expandIt 語法由 Mark 提供,以下各用法修改自 Reic
  • 使用方法:
將語法貼到適當位置即可。
  • 最新文章:

  1. <!-- 最新文章 -->
  2. <script type="text/javascript">
  3. function expandIt(getIt) {ldelim} getIt.style.display=(getIt.style.display=="none")?"":"none"; {rdelim}
  4. </script>
  5.  
  6. <!-- 下一行 加上標題語法 -->
  7. <a href="javascript:expandIt(document.getElementById('recentpost'))">最新文章</a>
  8.  
  9. <ul id="recentpost" name="recentpost" style="display: none;">
  10. {foreach from=$recentposts item=post}
  11. {assign">assign">assign var="passwordObj" value=$post->getFieldObject("password_field")}
  12. {if $passwordObj != "" && $passwordObj->getValue() != ""}
  13. <li><a title="Secert Post, Sorry" href="{$url->postLink($post)}">{$post->getTopic()}</a></li>
  14. <li><a title="{$post->getText()|truncate:150:"..."|strip_tags|escape}" href="{$url->postLink($post)}">{$post->getTopic()}</a></li>
  15. {/if}
  16. </ul>
  17. <!-- 在此放入結尾語法 -->
  • 連結列表:

  1. <!-- 連結 -->
  2. <script type="text/javascript">
  3. function expandIt(getIt) {ldelim} getIt.style.display=(getIt.style.display=="none")?"":"none";
  4. </script>
  5. <!-- 在此放入標題語法 -->
  6. {foreach from=$mylinkscategories name=linkcategory item=linkcategory}
  7. <b><a href="javascript:expandIt(document.getElementById('lnk{$smarty.foreach.linkcategory.iteration}'))"> {$linkcategory->getName()} </a></b><br />
  8. <ul id="lnk{$smarty.foreach.linkcategory.iteration}" name="lnk{$smarty.foreach.linkcategory.iteration}" style="display: none;">
  9. {foreach from=$linkcategory->getLinks() item=link}
  10. <li><a href="{$link->getUrl()}" title="{$link->getDescription()}">{$link->getName()}</a></li>
  11. </ul>
  12. <!-- 在此放入結尾語法 -->

原文有最新文章、最新迴響、分類、連結等的語法,因為太長,所以需要完整語法請參考 阿駕零零壹 © 學習筆記


收藏文章的連結

目前網路上提供的文章連結收藏、分享的服務很多,當你寫了一篇好文章的時候,也應該方便一下讀者們,讓他們可以方便的收藏文章。

  • 說明:
目前有 Delicious、HEMiDEMi、Furl、Technorati,會陸續增加,或參考後面增加連結說明。
  • 使用方法
將語法貼到文章適當位置即可。

  1. +<a href="http://del.icio.us/login/?url={$url->postPermalink($post)}&title={$post->getTopic()}" title="Add To Your Del.icio.us" target="_blank">Del.icio.us</a>
  2. +<a href="http://www.furl.net/storeIt.jsp?p=1&t={$post->getTopic()}&u={$url->postPermalink($post)}" title="Add To Your Furl" target="_blank">Furl</a>
  3. +<a href="http://www.hemidemi.com/user_bookmark/new?title={$post->getTopic()}&url={$url->postPermalink($post)}" target="_blank" title="Add To Your HEMiDEMi" >HEMiDEMi</a>
  4. +<a href="http://technorati.com/faves?add={$url->postPermalink($post)}" target="_blank" title="Add To Your Technorati Favorites" >Technorati</a>
  5. +<a href="http://myshare.url.com.tw/index.php?func=newurl&url={$url->postPermalink($post)}&desc={$post->getTopic()}" target="_blank" title="Add To Your MyShare" >MyShare</a>
  • 增加連結:
分析他們的連結,並且搭配 {$url->postPermalink($post)} 取得文章連結、{$post->getTopic()} 取得文章標題。


原文發表在 阿駕零零壹 © 學習筆記

變更字體大小的JavaScript

由於每個人習慣的字體大小不同,而且閱讀的時候字體大一點真的會比較舒服,利用這個語法,就可以自行放大縮小字體。

  • 使用教學:

1. 編輯「header.template」,將下面語法放入<head></head>之間。

  1. {literal}<script language="javascript" type="text/javascript">
  2. function doZoom(size){
  3. document.getElementById('content').style.fontSize=size+'px'}
  4. </script>{/literal}
  5.  
  6. P.S. 其中,content 請改成你希望放大區域的 CSS id。

2. 將下面語法放入適當位置。

  1. <a href="javascript:doZoom(20)">放大</a>
  2. <a href="javascript:doZoom(16)">正常</a>
  3. <a href="javascript:doZoom(12)">縮小</a>
  4.  
  5. P.S. 括號內的數字代表字體大小,可自行修改。

原文發表在 阿駕零零壹 © 學習筆記


修改每月彙整為下拉式選單

隨著你的Blog使用時間越來越久,就會看到旁邊的每月彙整越來越長,這時候能夠收藏起來當然最好。

  • 使用方法:
使用下面語法替換,並且加上適當的區塊語法。

  1. {literal}<script language="javascript" type="text/javascript">
  2. function MM_jumpMenu(targ,selObj,restore){ //v3.0
  3. eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  4. if (restore) selObj.selectedIndex=0;
  5. }</script>{/literal}
  6. <!-- 加入區塊標題語法 -->
  7. <select name="menu_menu" onChange="MM_jumpMenu('parent',this,0)">
  8. <option>每月彙整</option>
  9. {foreach from=$archives item=archivelink}
  10. <option value="{$archivelink->getUrl()}">{$archivelink->getName()} [{$archivelink->getNumArticles()}]</option>
  11. </select>
  12. <!-- 加入區塊結尾語法 -->

原文發表在 阿駕零零壹 © 學習筆記


顯示 Blog 訪客人數等統計資訊

管理介面中,有個顯示閱讀總數、文章總數、迴響總數、引用總數的地方。我們將這個拿到模板中來顯示。

  • 使用方法:
將下面語法,你需要的項目,放到模板適當位置即可。

  1. 閱讀總數:{$blog->getViewedTotal()}
  2. 文章總數:{$blog->getTotalPosts()}
  3. 迴響總數:{$blog->getTotalComments()}
  4. 引用總數:{$blog->getTotalTrackbacks()}

原文發表在 阿駕零零壹 © 學習筆記


顯示作者資料

管理介面中,有個「使用者設定」,你可以在裡面設定照片、自我介紹等等。下面提供您顯示的辦法。

  • 使用方法:
將下面的語法,放到你想要顯示的位置,並加上適當的區塊語法。

  1. {assign">assign">assign var=blogOwner value=$blog->getOwnerInfo()}
  2. {if $blogOwner->getfullName()==""}
  3. Blogger:{$blogOwner->getUsername()}<br/>
  4. Blogger:{$blogOwner->getfullName()}<br/>
  5. {/if}
  6. {if $blogOwner->hasPicture()}
  7. {assign">assign">assign var=picture value=$blogOwner->getPicture()}
  8. <img src="{$url->resourcePreviewLink($picture)}" title="{$blogOwner->getUsername()}" /><br>
  9. {/if}
  10. {if $blogOwner->getfullName()!=""}
  11. About:{$blogOwner->getAboutMyself()}
  12. {/if}

原文發表在 阿駕零零壹 © 學習筆記


解決 連結過長 無法自動換行 的問題

這個問題通常會出現在 Summary 或是 sidebar 上面,據說出問題的都是 Firefox,XD。

  • 修改辦法:
將你要修改的地方,利如:

  1. {$comment->getText()}
  2. {$post->getText()}
在這個裡面加上 |regex_replace:"/http:[^ ]+/":" [link] ",例如:

  1. {$comment->getText()|strip_tags|truncate:100:"..."|regex_replace:"/http:[^ ]+/":" [link] "}
  2. {$post->getText()|strip_tags|truncate:100:"..."|regex_replace:"/http:[^ ]+/":" [link] "}
如此一來就會用 [link] 連結,來取代原本的網址了。

原文發表在 lss實驗室

要如何加入 JavaScript 到模版中才不會出問題

在模版的語法中,{} 是保留字,所以不能使用。如果你的 JavaScript 中包含這兩個字元,那麼當然就會出錯。解決方式如下:

  1. {literal}
  2. 你的 JavaScript 程式
  3. {/literal}

這樣就可以了。LifeType 的模版引擎就會把這一段文字當成純文字來看待。