Adi's Weblog

Di Mambo CMS kita bisa menggunakan banyak template didalam satu website. Artikel berikut menjelaskan bagaimana menampilkan dua template berbeda namun sejenis dalam hal styling untuk halaman yang berbeda-beda. Misalkan saja kita ingin menampilkan tampilan tiga kolom di homepage dan dua kolom di halaman lain selain homepage.

Seperti pada gambar, kedua template diatas memiliki styling yang sama hanya berbeda di jumlah kolom. Ada dua cara untuk melakukan hal tersebut. Yang pertama menggunakan satu template dengan bantuan fungsi mosCountModules dan yang kedua menggunakan dua template, dimana salah satu template akan menjadi master template.

1. Cara pertama, satu template

Menggunakan satu template adalah cara termudah dimana kita hanya bermain di modul. Berikut contoh dasar layout html beserta css-nya utk master template (sebut saja template_2col)

#wrapper {
	clear:both;
	width:800px;
}
#leftcol {
	float:left;
	width:150px;
}
#maincol {
	float:left;
	width:500px;
}
#maincol-collapsed {
	float:left;
	width:650px;
}
#rightcol {
	float:left;
	width:150px;
}

<?php
if (mosCountModules('right') >= 1) {
  $preffix = '';
} else {
  $preffix = '-collapsed';
}
?>
<div id="wrapper">
  <div id="leftcol">
  <?php mosLoadModules('left',-2); ?>
  </div>
  <div id="maincol<?php echo $preffix; ?>">
  <?php mosMainBody(); ?>
  </div>
  <?php if($preffix == '') {  ?>
  <div id="rightcol">
  <?php mosLoadModules('right',-2); ?>
  </div>
  <?php } ?>
</div>

contoh css dan html diatas belum lengkap namun yang perlu diperhatikan adalah di

if (mosCountModules('right') >= 1) {
  $preffix = '';
} else {
  $preffix = '-collapsed';
}
?>

kode diatas menggunakan fungsi mosCountModules dimana jika terdapat modul yang dipublish dgn position ‘right’ maka $preffix diset kosong sedangkan jika tidak terdapat modul dengan position ‘right’, makan $preffix akan di set ‘-collapsed’. Dengan demikian kita bisa mendefine id mainbody-collapsed di css kita utk tampilan dua kolom dan menyembunyikan kolom ketiga dengan

<?php if($preffix == '') {  ?>
  <div id="rightcol">
  <?php mosLoadModules('right',-2); ?>
  </div>
<?php } ?>

Dengan menggunakan cara diatas kita bisa merubah tampilan, men-set id css yg berbeda sesuai dengan publish/unpublish module. Contoh diatas menyembunyikan kolom ketiga sehingga tempilan akan berubah menjadi dua kolom ketika tidak ada modul yang dipublish dgn posisi ‘right’.

Kelemahan dari cara pertama adalah kita tidak bisa secara leluasa meng-assign halaman-halaman mana saja yang menggunakan tiga kolom atau dua kolom. Tampilan tiga dan dua kolom hanya tergantung dari publish/unpublish modul tertentu didalam satu template.

2.Cara kedua, dua template

Menggunakan dua template lebih memudahkan serta membuat kita lebih leluasa dalam pengaturan karena kita cukup meng-assign template pertama (template dua kolom) sebagai default template dan template kedua digunakan di homepage saja. Untuk meng-assign template yang berbeda bisa dilakukan dari template manager.

Sebelumnya, kita harus membuat template kedua terlebih dahulu. Buatlah directory baru di templates misal template_3col dan buat file templateDetails.xml dan index.php seperti biasa. Kamu bisa mengcopy file templateDetails.xml dari master template (sebut saja template_2col) dan ubah sedikit di tag name. Setelah itu edit file index.php di directory template_3col yang barus saja dibuat.

<?php
defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' );
$templatetype = '3col';
include($mosConfig_absolute_path.'/templates/template_2col/index.php');
?>

pastikan lokasi file template yg di include dengan benar. Setelah itu ubah sedikit kode di index.php dari template_2col dari

<?php
if (mosCountModules('right') >= 1) {
  $preffix = '';
} else {
  $preffix = '-collapsed';
}
?>

menjadi

<?php
if ($templatetype == '3col') {
  $preffix = '';
} else {
  $preffix = '-collapsed';
}
?>

Perubahan dari mosCountModules(‘right’) >= 1 menjadi $templatetype == ’3col’ dilakukan karena menggunakan cara kedua, kita tidak lagi melakukan pengecekan berdasarkan publish/unpublish modul tetapi berdasarkan variabel $templatetype yg telah diset di template_3col kita tadi.

Dengan cara kedua tersebut, dengan mudah kita bisa merubah tampilan dua kolom atau tiga kolom tanpa harus melakukan publish/unpublish modul.

happy Mambo !