前言

相信大家都遇到過(guò)，我們?cè)谑褂每棄?mèng)DedeCMS系統(tǒng)程序開(kāi)發(fā)網(wǎng)站中，會(huì)遇到很多因網(wǎng)頁(yè)版面設(shè)計(jì)限定的寬度，使文章標(biāo)題需要進(jìn)行字?jǐn)?shù)限制，通常做法是在a標(biāo)簽中加入一個(gè)title屬性，讓鼠標(biāo)放上去的時(shí)候顯示完整標(biāo)題。但是標(biāo)題被剪裁掉一些字符而不完整，下面腳本之家的小編就為你推薦另外幾種標(biāo)題調(diào)用方式，如進(jìn)行標(biāo)題判斷，DedeCMS判斷簡(jiǎn)略標(biāo)題為空時(shí)則顯示完整標(biāo)題。

具體方法如下：

方法一： 

{dede:field name='array' runphp='yes'} if (@me['shorttitle']=='') @me=@me['title'];else @me=@me['shorttitle'];{/dede:field} 

方法二： 
 

[field:array runphp='yes'] if (@me['shorttitle']=='') @me=@me['title'];else @me=@me['shorttitle'];[/field:array]

這個(gè)方法可以在{dede:arclist}標(biāo)簽中套用。
 

方法三：
 

有時(shí)標(biāo)題過(guò)長(zhǎng)，全部顯示會(huì)導(dǎo)致排版混亂，影響美觀。但顯示一部分又影響用戶體驗(yàn)。我們希望當(dāng)標(biāo)題在一定長(zhǎng)度范圍內(nèi)時(shí),全標(biāo)題顯示，當(dāng)標(biāo)題過(guò)時(shí)，只顯示一定長(zhǎng)度，后面加省略號(hào)，然后當(dāng)鼠標(biāo)移上去時(shí)再顯示標(biāo)題的全部?jī)?nèi)容，這樣就即做到了不影響版面的布局，又做到了標(biāo)題內(nèi)容的全部顯示。
 

這里給出不需要修改程序，只修改模板的方法。舉例，下面的標(biāo)題列表，最長(zhǎng)的標(biāo)題50字節(jié)，只想顯示30字節(jié)，模板代碼如下：
 

           <ul>
                {dede:arclist titlelen='50' row='10'}
                <li><a title="[field:title /]" href="[field:filename /]">[field:title function='( strlen("@me")>30 ? cn_substr("@me",30)."..." : "@me" )'/]</a></li>
                {/dede:arclist}
           </ul>

很明顯，解決問(wèn)題的關(guān)鍵在于用 [field:title function='( strlen("@me")>34 ? cn_substr("@me",30)."..." : "@me" ) ' /] 代替了原來(lái)的 [field:title /] ，在輸出標(biāo)題時(shí)多了一個(gè)判斷的過(guò)程，先判斷標(biāo)題是否大于34字節(jié)，如果大于則只輸出30字節(jié)的長(zhǎng)度，并加上省略號(hào)。而title="[field:title /]" 則不受影響，鼠標(biāo)移上去時(shí)顯示標(biāo)題的全部?jī)?nèi)容。
 

方法四：

除上面修改模板的方法外，還有編程或CSS等方法。但能通過(guò)模板解決的問(wèn)題，編程就不必要了。CSS的方法如下： 
 

<a style="width:120px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;" title="DedeCMS2007即將發(fā)布" href=" " >DedeCMS2007即將發(fā)布</a>

解釋：width:120px; 限定長(zhǎng)度，text-overflow:ellipsis ：當(dāng)對(duì)象內(nèi)文本溢出時(shí)顯示省略標(biāo)記...，white-space:nowrap：強(qiáng)制文本在一行內(nèi)顯示，overflow:hidden：溢出內(nèi)容為隱藏。更多相關(guān)的使用技巧大家可以參考這篇文章：http://www.dbjr.com.cn/article/50258.htm
 

CSS的方法比修改模板還要簡(jiǎn)單，不過(guò)很遺憾，text-overflow:ellipsis屬性在firefox中是沒(méi)有效果的。所以，還是使用上面的修改模板的方法吧。
 

最近還發(fā)現(xiàn)了另外一個(gè)問(wèn)題，dede標(biāo)題鏈接，有則能鏈接無(wú)則不連接，下面是解決的方法：

{dede:list pagesize='15' orderby='weight' orderway='desc'}
        <dl>
         <dt>[field:pubdate function='strftime("%Y/%m/%d",@me)'/]</dt>
         <dd>
[field:array runphp='yes'] if (@me['body']=='') @me=@me['title'];else{ @me = '<a href="'.@me['arcurl'].'" title="'.@me['description'].'" target="_blank">'.@me['title'].'</a>';}[/field:array]      
         </dd>
        </dl>
{/dede:list}

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)腳本之家的支持。
 

最新評(píng)論