在模板(佈景)中新增模組位置

(24 次投票)

modules-new

這是很多人詢問的問題了,由於需要一點點的HTML基礎功力,因此Asika比較晚做教學。要自行新增模組位置的人,建議最好稍微對 HTML, CSS 有些涉獵,必要時須要懂一點點PHP,以免把模板改出問題。

 

選定一個要加入模組的位置

我們這裡以內建的ja_purity模板來做說明。假設我想要加入新位置在橫幅下方元件區塊上方。如下圖。

 pos-01

 

我們得先知道那個位置在原始碼中的什麼地方。建議可以用一些FireFox的網頁開發套件來加快尋找位置的速度,如下圖是用FireBUG

pos-02

 

開始修改模板

所有的模組位置都在模板的index.php中定義。首先,修改原始碼的重要習慣要培養起來,先把檔案做備份。

image

 

經過搜索,我們知道那個位置是在< div id=”ja-content”>的下面

pos-03

 

我們加入一段code在message的下面並存檔。

 

< jdoc:include type="modules" name="new-position" style="xhtml" />

<與jdoc之間的空格要清除

其中name就是你要新增的模組位置的名稱,我是用new-position,其他照抄就好。如下圖。

pos-04

 

這樣子算是新增完成了,但要讓Joomla自動抓到你的新位置,必須要在模板xml檔中定義它。

pos-11

 

若是你嫌麻煩,還有別的方法。Joomla1.5支援模組位置手動輸入。直接輸入你新增的名稱即可。如圖我輸入new-position。

pos-05

 

儲存,到前台觀看,是不是成功了阿,就這麼簡單。

pos-06

 

沒有模組時讓某一區塊消失

有時候模板上若有一個區塊沒有模組,但該區塊有特殊顏色,會發生div被壓縮,剩一條線很難看的現象。我們可以藉由簡單的php代碼,讓該區塊沒有模組時,整個div全部隱藏起來。

代碼:

<?php if($this->countModules('new-position')) : ?>
要隱藏的內容
<?php endif; ?>

 

原理是計算某位置的模組數量,0的話,就不顯示被包起來的部分的HTML。如下圖

pos-07

 

大家可以看到,我在div中包了一段文字,一般來說沒有模組時文字還是會出現的。但經過剛剛那段代碼包起來後,一但new-position沒有模組時,整個div包含文字都會隱藏起來

有模組時:

pos-08 

 

沒有模組時:

pos-10

 

如此就能夠在模板中自行完很多變化了。當然這還只是牛刀小試,請各位期待日後的模板製作教學


建立0rz短址
Related Posts with Thumbnails

文章回應

avatar z8356a
0
 
 
請問一下
1.ja-content是自己定義的稱嗎?
2.怎麼會知到ja-content的位置,就是圖上的位置

感謝
avatar z8356a
0
 
 
上述的問題,我已了解了

我想問,
1. 第164那行要打嗎?
2. 若我想將那模組放左或右的話?該如何設,好想有些無法調位置

感謝
avatar z8356a
+1
 
 
我還想問一個問題,您在一個始用HTML碼所搜尋的位置,例如像 : ja-content這個位置,為何ja-content會是在那個位置,這是如何定的呢? 這跟我上面所問得類似,萬一沒有一個位置是我想要的,或是我想在這個位置的右邊、左邊,我該如何去限定ja-content指的就是這個區塊、這樣的長度? 這一部分是在那可做修改 感謝您 謝謝
avatar Asika
0
 
 
慢慢來,同學
ja-content之所以在那個位置沒有理由的,人家模版設計師就是寫在那個位置。所以這部份要靠你自己的html功力去搜尋了。
不是說ja-content指的是哪邊............... 還有 ja-content 是某個 div 的「id」,不是「位置」。

基本上你可能對html不是很熟悉,本篇文章開頭有先說明了必須要稍微懂html才能進行修改。畢竟這個分類叫程式修改耶......
avatar mike797
0
 
 
Use HTML , put one on it, set each width="50%, then you will have two frames, one left frame and one roght frame:
example:






countModules('new-position')) : ?>







countModules('new-position2')) : ?>







請登入後回應