家好呀!今天小紅書上來分享一篇關(guān)于友情鏈接HTML代碼的教程,讓我們一起來學(xué)習(xí)如何在網(wǎng)頁上添加友情鏈接吧!
我們需要了解什么是友情鏈接。友情鏈接,顧名思義,就是在網(wǎng)頁上相互分享鏈接,以增加網(wǎng)站之間的互相推薦和訪問。通過添加友情鏈接,我們可以促進(jìn)多個(gè)網(wǎng)站之間的互動(dòng)和合作,共同提高網(wǎng)站的流量和知名度。
我們該如何在網(wǎng)頁中添加友情鏈接呢?首先,我們需要使用HTML代碼來實(shí)現(xiàn)這一功能。下面將給大家介紹一種簡單的方法。
首先打開你要添加友情鏈接的網(wǎng)頁,然后找到你想要添加友情鏈接的位置。通常,我們將這些鏈接放置在頁面底部的“友情鏈接”或“合作伙伴”欄目中比較合適。
我們需要在HTML代碼中插入一個(gè)“”標(biāo)簽,表示一個(gè)無序列表。在這個(gè)列表中,每一個(gè)鏈接都將被表示為一個(gè)“”標(biāo)簽,這樣我們就可以依次添加多個(gè)鏈接了。
下面是一個(gè)示例代碼,供大家參考:
果您覺得文章對(duì)您有點(diǎn)用,麻煩在您閱讀、收藏、轉(zhuǎn)發(fā)的時(shí)候,順手幫忙點(diǎn)個(gè)贊、留個(gè)言、加關(guān)注,這是我繼續(xù)寫下去的絕佳動(dòng)力。
緣于老是被問網(wǎng)友問到類似以下問題:
SiteServer CMS系統(tǒng)能實(shí)現(xiàn)友情鏈接功能嗎?
SiteServer CMS系統(tǒng)如何實(shí)現(xiàn)友情鏈接的功能?
為什么在SiteServer CMS系統(tǒng)后臺(tái)沒有友情鏈接管理?
每次被問到諸如此類的問題時(shí),我就真的好無語,一是無語問問題的人對(duì)SiteServer CMS系統(tǒng)的真正原理(核心設(shè)計(jì)思想、或者說產(chǎn)品定位)沒理解;二是對(duì)SiteServer CMS系統(tǒng)官方的宣傳、文檔方面的工作的無語。
所以就特意寫了這么一篇特別簡單的文章:利用SiteServer CMS系統(tǒng)實(shí)現(xiàn)友情鏈接的功能。
首先是在SiteServer CMS系統(tǒng)后臺(tái)新建一個(gè)欄目,欄目名稱直接就叫“友情鏈接”(欄目名稱可能隨意),點(diǎn)擊下圖紅框的“添加欄目”按鈕:
然后進(jìn)入新建欄目界面,填寫欄目名稱為“友情鏈接”,如下圖所示:
欄目建完之后,就進(jìn)到“友情鏈接”欄目的內(nèi)容管理界面,如下圖所示:
點(diǎn)擊“添加內(nèi)容”進(jìn)入到內(nèi)容添加的界面,如下圖所示:
只要填寫上圖紅框的兩個(gè)字段:標(biāo)題和外部鏈接,一個(gè)是友情鏈接的名稱,一個(gè)是友情鏈接的鏈接地址,其他字段可以忽略不填寫。把所有友情鏈接內(nèi)容填寫進(jìn)去之后,回到內(nèi)容列表界面就是這樣的:
這樣的話,友情鏈接內(nèi)容錄入管理就算結(jié)束了,剩下就是模板調(diào)用這些數(shù)據(jù)的工作了。
當(dāng)然可能會(huì)覺得為什么友情鏈接的內(nèi)容發(fā)布頁面和新聞發(fā)布頁面的字段一樣呢,這么多用不上的字段,感覺好別扭,不習(xí)慣。沒關(guān)系,SiteServer CMS系統(tǒng)作為一個(gè)通用內(nèi)容管理系統(tǒng),不可能就這么不靈活的。如果你覺得有必要把其他用不上的字段去掉的話,請進(jìn)行以下操作。
進(jìn)入菜單:設(shè)置管理 /內(nèi)容模型設(shè)置 /內(nèi)容字段管理,如下圖所示:
注意:在上圖中,欄目一定要選擇剛才我們新建的“友情鏈接”欄目,下面顯示的就是此欄目內(nèi)容的所有字段,每個(gè)字段后面跟著一列“顯示樣式”,點(diǎn)擊添加,進(jìn)到字段顯示樣式編輯界面,如下圖所示:
如上圖紅框,如果這個(gè)字段不需要,則選擇不啟用,然后確定即可。所有字段設(shè)置完了之后,回到字段列表應(yīng)該能看到如下圖所示效果:
所有打X的表示不啟用,也就是說在內(nèi)容添加和編輯界面就不會(huì)再顯示這些字段了,如下圖所示:
這樣的內(nèi)容管理界面是不是顯的更清爽干凈了?
在前面一步講了如何把數(shù)據(jù)錄入SiteServer CMS系統(tǒng)后臺(tái)中,在這一步則來講講如何把友情鏈接的這些數(shù)據(jù)調(diào)取到前臺(tái)頁面中去,也就是常講的模板嵌套。
首先是新建一個(gè)欄目模板,模板名稱叫“友情鏈接”(可以隨便取),如下圖所示:
然后把友情鏈接欄目的靜態(tài)頁面代碼(html)拷備到上圖的編輯框中,如下圖所示:
從上圖紅框代碼可以看到,調(diào)用友情鏈接的數(shù)據(jù)特別簡單,就是利用一個(gè)<stl:contents>標(biāo)簽把欄目名稱為“友情鏈接”的欄目(channelname="友情鏈接")下所有內(nèi)容取出來,每一條內(nèi)容顯示一個(gè)序號(hào),同時(shí)顯示內(nèi)容的標(biāo)題(type="title")和內(nèi)容的鏈接(<stl:a>)。具體stl標(biāo)簽語言的用法可以參考官網(wǎng):http://stl.siteserver.cn,模板嵌套好之后保存好。
保存好模板之后就需要把新建的欄目和剛才嵌套好的模板匹配起來,如下圖所示:
注意,上圖顯示的匹配欄目模板,左邊選中“友情鏈接”這個(gè)欄目,然后右邊選中“友情鏈接”這個(gè)欄目模板,最后點(diǎn)擊中間的“匹配”按鈕,整個(gè)欄目模板匹配過程就完成了。剩下就是生成欄目頁面了,如下圖所示:
從上圖看到,選中“友情鏈接”這個(gè)欄目,然后點(diǎn)“生成選定欄目”按鈕即可,點(diǎn)完之后應(yīng)該能看到如下圖所示界面:
表示欄目頁生成結(jié)束,然后回到信息管理中的欄目管理菜單,如下圖所示:
點(diǎn)擊“友情鏈接”欄目前面的文件夾圖標(biāo),可以打開此欄目對(duì)應(yīng)的前臺(tái)頁面,然后我們就能看剛才模板嵌套中關(guān)于友情鏈接部分的效果了,左邊是編號(hào),右邊是內(nèi)容標(biāo)題,點(diǎn)標(biāo)題能打開每篇內(nèi)容的外部鏈接字段里存的鏈接地址,如下圖所示:
至此,利用SiteServer CMS系統(tǒng)實(shí)現(xiàn)友情鏈接功能的整個(gè)過程就完成了。其實(shí)經(jīng)過這樣一番演示可以發(fā)現(xiàn),如果利用SiteServer CMS去實(shí)現(xiàn)一個(gè)焦點(diǎn)輪播圖、文件下載等功能是不是一樣可以類似這樣來做?
在之前的深入講解SiteServer CMS:輔助表這篇文章里就已經(jīng)解釋過原因了,現(xiàn)在再把這段話摘錄于此。
SiteServer CMS的定位是做真正的內(nèi)容管理系統(tǒng),管理所有結(jié)構(gòu)化的數(shù)據(jù),而不僅僅管理新聞。只要是能結(jié)構(gòu)化的數(shù)據(jù),比如商品信息、人員信息、資產(chǎn)信息、項(xiàng)目信息等等,都可以通過SiteServer CMS系統(tǒng)進(jìn)行管理。這就決定了SiteServer CMS不會(huì)給友情鏈接這么小的一個(gè)網(wǎng)站專有功能。但通過SiteServer CMS還是很靈活很簡單就能實(shí)現(xiàn)友情鏈接的功能,主要是大家的思維習(xí)慣不能停留在一些自助建站或純粹的只能對(duì)新聞進(jìn)行管理的新聞發(fā)布系統(tǒng)上(他們也把這種新聞發(fā)布系統(tǒng)習(xí)慣性地叫種內(nèi)容管理系統(tǒng))
大媽上了空調(diào)車投了一塊錢。司機(jī)說:“兩塊”。大媽說:“是的,涼快”。司機(jī)說:“空調(diào)車兩塊!”。大媽答:“空調(diào)車是涼快”。司機(jī)又說:“投兩塊”! 大媽笑說:“不光頭涼快,渾身都涼快”,說完往后頭走。司機(jī)說:“我告訴你錢投兩塊”。大媽說:“我覺得后頭人少更涼快”司機(jī)無語,一車人笑倒了!溝通不到位,努力全白費(fèi)。保持微笑,不會(huì)變老。
者:悅?cè)粀ordpress建站(悅?cè)唤ㄕ荆?/p>
繼續(xù)分享wordpress建站教程。大家可以仔細(xì)觀察五,絕大多數(shù)的中文wordpress站點(diǎn)都會(huì)會(huì)友情鏈接模塊,因?yàn)閲鴥?nèi)的wordpress主題開發(fā)者大多比較重視SEO優(yōu)化,所以會(huì)把這項(xiàng)功能都集成在主題中。而絕大多數(shù)的wordpress外貿(mào)站點(diǎn)則沒有友情鏈接模塊,因?yàn)閲獾闹黝}開發(fā)者可能不是太關(guān)注這方面的問題,默認(rèn)情況下英文wordpress主題都是沒有友情鏈接模塊的,當(dāng)然這并不是說國外的開發(fā)者不懂SEO,而是國內(nèi)百度SEO和國外谷歌SEO優(yōu)化的注重點(diǎn)不同,谷歌對(duì)低質(zhì)鏈接的處罰力度比較大,要做好谷歌SEO優(yōu)化走傳統(tǒng)堆鏈接的方式已經(jīng)行不通了,而且一般人也找不到好的鏈接來交換。
如果我們做wordpress外貿(mào)建站時(shí)一定要加上友情鏈接模塊應(yīng)該怎么辦呢?我們可以手動(dòng)安裝友情鏈接插件。
wordpress友情鏈接插件
https://downloads.wordpress.org/plugin/link-manager.zip
大家可以通過上面的鏈接下載并安裝插件,啟用之后wordpress建站后臺(tái)就會(huì)多出一個(gè)鏈接模塊,還會(huì)多出一個(gè)鏈接小工具,它可以在頁面或小工具中進(jìn)行調(diào)用。
默認(rèn)情況下,wordpress友情鏈接插件會(huì)以豎排的方式來顯示鏈接,如上圖所示。
讓友情鏈接橫向顯示
/
.blogroll{undefined
width:1000px;
display:block;
/記得清除浮動(dòng)/
overflow:auto;
/兼容IE6/
}
.blogroll li{undefined
padding:0;
margin:0px 10px;
float:left;
display:block;
position: relative;
top: -22px;
}
如果你的想要讓友情鏈接在首頁底部顯示要怎么辦呢?大家可以把上面的代碼添加到自定議CSS中,一般國外的wordpress主題的自定議設(shè)置頁面都會(huì)有一個(gè)額外CSS添加的地方,添加進(jìn)去就可以了,如果沒有也可以使用第三方插件,比如Simple CSS,在插件中心下載安裝即可。
如上圖所示,CSS樣式生效后友情鏈接就會(huì)以橫排的方式來顯示了。
*請認(rèn)真填寫需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。