Tabs & Slides 分頁套件,少少空間裝入更多資料

(14 次投票)

image

tabs與slides是很常見用來減少文章長度並分類的網頁功能,現在非常流行。大家可以看到Yahoo首頁新聞用的就是Tabs的標籤分頁功能來區分不同主題。

在Joomla!中也有無數套件可以達到這功能了。現在介紹一個最有名也最方面使用的tabs標籤套件「Tabs & Slides」,同樣由JoomlaWorks開發。

 

下載Tabs & Slides

JoomlaWork下載首頁

Tabs & Slides分成外掛模組兩種套件。外掛是用來在文章中插入分頁用的,模組則是可以在模組區塊中插入多個模組並以標籤做區分。

tab-01

 

同樣可以直接由網址安裝,我們先把外掛模組兩個都裝上去

tab-02

 

外掛的用法

現在我們先介紹外掛的用法,先到外掛管理啟動它。右邊是Slides滑動的速度調整。

tab-03

 

往下捲,可以看見簡易使用教學。

tab-04

 

我們照著在文章中輸入即可,最後要加上結束標籤。這裡故意標顏色是給大家參考用,實際使用時請不要加任何效果在code上面。

tab-05

 

這是展示結果,可以看到標籤標題也能夠自定

tab-06

 

如此,我們就可以任意得在不同標籤頁中放置任何圖文內容,這樣即可把一篇很長的文章區分成不同分頁。

tab-07

 

接著示範Slides的用法,每段內容用一個完整slides標籤閉合起來。

tab-08

 

前台效果

tab-09

 

模組的用法

同樣先到模組管理啟動。我們先看一下右邊參數。

Unique ID (required)是用來替每個分頁集合作區分的,最好每個tabs模組使用不同的ID。

Position (from which to load other modules)則是要顯示哪個模組區塊的所有模組,預設是left。

此時請注意一件事,若要顯示left的模組,Tabs & Slides 就別放在left上,否則會造成無窮迴圈無法顯示頁面。這裡我把它放在right上。

tab-11

 

前台效果

tab-12

 

其實joomla中的模組位置是可以手動輸入的,你可以輸入一個不存在的模組位置,比如 tab-custom

image

 

然後熱門文章的模組位置我也輸入tab-custom

image

 

這樣就能夠抓到該模組了,彈性是不是很高呢。

image

 

 

延伸資源:

jTabs - 用jQuery製作的tab功能,與yahoo一樣滑鼠移上去就會變動

image

 

RokTabs - 教華麗的一款tabs套件,但沒有slides的功能

image

 

TabaManager-GK2 - 功能多也很華麗的tabs套件

image image

image image

 

在JED的 tabs & slides 專區還有更多選擇:按此前往

 


建立0rz短址
Related Posts with Thumbnails

文章回應

avatar stum
0
 
 
在這我有一個疑問,
你說joomla中的模組位置是可以手動輸入,
那所有模組都可以這樣用嗎???
還有你在上方打的這個位置"tab-custom",
你說他不存在joomla裡面,他是己建立的位置。
那joomla要怎麼知道這個"tab-custom"自己建立的位置在哪呢??
因為以上你並沒有敘述位置在哪,那我們要怎麼知道??
avatar Asika
0
 
 
模組位置只是一個用來辨別要不要顯示模組的"名稱"而已
模板中都會內建給你選擇

如果你手動輸入一個名稱 EX: abc
那麼模板中沒有abc這個位置的話,模組就不會出現在前台

但某些套件可以手動輸入模組位置去抓模組出來顯示
所以我在這些套件中輸入abc
模組就會被套件給顯示出來了

這樣敘述懂嗎???
我手動輸入就是因為不想讓它自己在joomla中出現
而是透過tab模組來出現
avatar stum
0
 
 
恩 謝謝 大大
avatar z8356a
0
 
 
1.請問大大,tabamanager-gk2是否可以用在內頁的側邊,因為我發覺,原始的內頁,就是一大片都沒東西,相說這樣的套件,是否可限定在內頁用。

2.請問是否有好的編輯套件(所見及所得),我發覺原始的蠻弱的,請問編輯文章時,可自選字型、大小、顏色嗎?

以上 感謝您 感謝
avatar ldwang
0
 
 
我裝了Tabs & Slides(外掛).
後來我看123介紹, 考慮裝Imagesized plugin for joomla 1.5.x 來用看看.
最後發現是一裝上Imagesized, 之前用到Tabs & Slides的文章就打開來一片空白.
一移掉Imagesized, 用到Tabs & Slides的文章就恢復正常.
(joomla1515, appserv2.5.10, windowsXPSP3)

純回報一下
avatar Asika
0
 
 
啟動 FrontPage only 試試看,也就是文章內頁不做縮圖,只在blog頁面做縮圖摘要,看看還會不會相衝突
avatar jimmy04
0
 
 
版大!請問一下!我已按照步驟安裝外掛第一個,也都按照你的方式,可是都無法成功,有限定要用哪個編輯套件嗎?
avatar binnan
0
 
 
用這個外掛在文章中設定好之後在google chrome,firefox中都可以看到效果,可是在ie中單位中有些電腦可以看到,有些卻看不到這個效果,很奇怪呢?
請登入後回應