JoomlaHitz สอนทำเว็บไซต์ด้วย Joomla แนะนำการใช้งานจูมล่า! Extensions Template

การเลือกใช้ Template Joomla

การเลือกใช้ Template Joomla

   สวัสดีครับ เรื่องต่อไปผมจะพูดถึงส่วนที่สำคัญไม่น้อยก็คือการเลือกใช้ Template Joomla ในการสร้างเว็บไซต์ เพราะโดยทัวไปแล้วนั้น ไม่ว่าเราจะออกแบบเว็บไซต์แบบไหน เราก็ต้องมี Template หลักที่เป็นตัวเริ่มต้นในการสร้างเว็บไซต์ก่อนเสมอ แล้วการเลือกใช้เทมเพลทนั้น ไม่ว่าเพื่อนๆจะสร้างสักกี่เว็บไซต์ แต่ตัวเทมเพลทก็ยังคงเป็นตัวเดิมที่ใช้อยู่ตลอดนั้นเอง เอะยังไง ลองติดตามดูครับ


เพื่อนๆคงสงสัยว่าแล้วทำไมเราไม่เปลี่ยนเทมเพลทไปตามเว็บไซต์ที่เราจะทำ เราอาจจะเลือกเทมเพลทที่ใกล้เคียงกับความต้องการของเราในแต่ละเว็บไซต์ก็ได้นี่ เนื่องจาก ก็เพราะว่าการเปลี่ยนเทมเพลทไปเรื่อยๆ จะทำให้เราไม่เข้าใจและอาจสับสน ในการกำหนดรายละเอียดของแต่ละเทมเพลทที่แตกต่างกัน แต่ถ้าเราใช้เทมเพลทตัวเดิม ออกแบบเว็บไซต์ใหม่ไปเรื่อยๆ เราก็จะทราบถึงส่วนต่างๆว่าเราจะไปแก้ไขตรงไหน ไปกำหนดเพิ่มเติมตรงไหน นั้นเอง

เอาเป็นว่าถ้าจะให้บอกเป็นแนวก็จะได้หลักการเลือกเทมเพลทดังนี้
1.ต้องเป็นเทมเพลทฟรี เพราะจะไม่ติดปัญหาเรื่องของลิขสิทธิ
2.เทมเพลทฟรี จะมีการกำหนดรายละเอียดที่ไม่ซับซ้อน ดังนั้น เราก็ต้องเลือกดูที่ไฟล์ index.php ว่าเราพอที่จะดูแล้วเข้าใจมากน้อยแค่ไหน เช่น ในส่วน head ของไฟล์ index.php มีการกำหนดอะไรบ้าง เป็นต้น นะครับ
3.รูปแบบที่เราเห็นใน demo ของเทมเพลทนั้น มีการกำหนดองค์ประกอบต่างๆ ที่ตรงต่อความต้องการของเราไหม เช่น โทนสี ตัวอักษร สีลิงค์ เป็นต้น แต่โดยความเป็นจริง เราสามารถเปลียนแปลงที่หลังได้ครับ
4.เทมพลทที่เลือก นำไปทดสอบกับ Extension ต่างๆดูแล้วว่ามีปัญหาหรือไม่นะครับ

ที่นี้มาดูเรื่องของ ระหว่าง Free Template หรือ แบบ commercial template (แบบเสียตังค์) เพื่อนๆจะเลือกใคร เพื่อนๆคงงงว่าทำไมผมถึงถามแบบนี้ ที่ผมต้องถามแบบนี้ก็เพราะว่า จากประสบการณ์ที่ผ่านมานั้น มันมองเห็นผมดีและผลเสียที่แตกต่างกันของเทมเพลททั้ง 2 แบบ ซึ่งผมจะสรุปออกมาให้เพื่อนๆได้รับทราบก่อนที่จะทำการเลือกเทมเพลทมาใช้ เพราะ หากถ้าเลือกมาแล้ว ทำไปได้สักพักแล้วปรากฎไม่สามารถแก้ไขอะไรต่อได้ เพื่อนๆก็ต้องกลับมาเริ่มต้นใหม่อีกที ซึ่งผมเคยเจอแบบนี้มาแล้ว มันเสียเวลาน่าดูครับ ทีนี้มาดูกันครับว่าทั้ง 2 แบบเป็นยังไง'


Free Template Joomla

   เป็นเทมเพลทที่เปิดโอกาศให้เราได้นำไปใช้ได้ฟรีๆ นะครับ (เพื่อนๆคงบอกอันนี้ตู ก็รู้อยู่แล้วบอกทำไมอะ -*-) แต่ความแตกต่างโดยหลักทั่วไปแล้วก็คือ เทมเพลทแบบนี้ จะใช้คำสั่งหรือ Script ต่างๆ รวมถึงลูกเล่นต่างๆ น้อยมาก บางเทมเพลทก็ดูไม่ได้เลยก็ว่าได้ เพื่อนๆคงเจอมาเยอะสำหรับฟรีเทมเพลท ที่ไม่ถูกใจเอาสะเลย ก็มี ใช่ไหมครับ แต่ว่า การที่เทมเพลทนั้นมีรายละเอียดไม่มาก กลับส่งผลดีกับเราอย่างยิ่งเลยก็ว่าได้ เพราะเอาไรนะหรือ ลองดูอันนี้นะครับ

<?php

defined( '_JEXEC' ) or die( 'Restricted access' );
$LeftMenuOn = ($this->countModules('position-4') or $this->countModules('position-5') or $this->countModules('position-7'));
$RightMenuOn = ($this->countModules('position-6') or $this->countModules('position-8'));
$TopNavOn = ($this->countModules('position-13'));

$app = JFactory::getApplication();
$sitename = $app->getCfg('sitename');
$sitetitle = $this->params->get('sitetitle');
$sitedescription = $this->params->get('sitedescription');

$logopath = $this->baseurl . '/templates/' . $this->template . '/images/logo.gif';
$logo = $this->params->get('logo', $logopath);
$logoimage = $this->params->get('logoimage');
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="/<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/css/template.css" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="/<?php echo $this->baseurl ?>/templates/<?php echo $this->template; ?>/js/sfhover.js"></script>
</head>

 คือส่วน Head ในไฟล์ index.php ของ ฟรีเทมเพลท เพื่อนๆจะเห็นว่า มีรายละเอียดไม่มาก เราพอที่จะทำความเข้าใจได้โดยง่าย จนถึงสามารถเพิ่มเติ่มหรือแก้ไขไฟล์ได้ ทีนี้ถ้าลองดูในส่วนนี้

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php
if ($favicon = $this->helix3->getParam('favicon')) {
$doc->addFavicon(JURI::base(true) . '/' . $favicon);
} else {
$doc->addFavicon($this->helix3->getTemplateUri() . '/images/favicon.ico');
}
?>
<!-- head -->
<jdoc:include type="head" />
<?php
$megabgcolor = ($this->helix3->PresetParam('_megabg')) ? $this->helix3->PresetParam('_megabg') : '#ffffff';
$megabgtx = ($this->helix3->PresetParam('_megatx')) ? $this->helix3->PresetParam('_megatx') : '#333333';

$preloader_bg = ($this->helix3->getParam('preloader_bg')) ? $this->helix3->getParam('preloader_bg') : '#f5f5f5';
$preloader_tx = ($this->helix3->getParam('preloader_tx')) ? $this->helix3->getParam('preloader_tx') : '#f5f5f5';

// load css, less and js
$this->helix3->addCSS('bootstrap.min.css, font-awesome.min.css') // CSS Files
->addJS('bootstrap.min.js, jquery.sticky.js, main.js') // JS Files
->lessInit()->setLessVariables(array(
'preset' => $this->helix3->Preset(),
'bg_color' => $this->helix3->PresetParam('_bg'),
'text_color' => $this->helix3->PresetParam('_text'),
'major_color' => $this->helix3->PresetParam('_major'),
'megabg_color' => $megabgcolor,
'megatx_color' => $megabgtx,
'preloader_bg' => $preloader_bg,
'preloader_tx' => $preloader_tx,
))
->addLess('legacy/bootstrap', 'legacy')
->addLess('master', 'template');

//RTL
if ($this->direction == 'rtl') {
$this->helix3->addCSS('bootstrap-rtl.min.css')
->addLess('rtl', 'rtl');
}

$this->helix3->addLess('presets', 'presets/' . $this->helix3->Preset(), array('class' => 'preset'));

//Before Head
if ($before_head = $this->helix3->getParam('before_head')) {
echo $before_head . "\n";
}
?>
...

 อันนี้คือส่วน Head ของ Template แบบ commercial ผมถามว่าถ้าเราพึงหัดทำ Template หรือเล่นมาไม่เยอะ เราจะทราบไหมครับว่าในส่วน นี้กำหนดอะไรบ้าง อยู่ส่วนไหนบ้าง (นี้ยังไม่จบส่วน Head นะคับ) แล้วถ้าเกิดเราอยากจะแก้ตำแหน่งสักจุดในเทมเพลท เราจะหาเจอไหมครับ สำหรับ เทมเพลทแบบ commercial template เพื่อนๆคิดว่าอาจจะหาเจอแต่ต้องใช้เวลาสักพัก แล้วถ้าไฟล์ในโฟรเดอร์ เทมเพลทมีแบบในรูปที่.1

การเลือกใช้ Template Joomla

รูปที่.1

    ถ้ามันมีเยอะแบบนี้ เราก็คงใช้เวลาศึกษาน่าดูกว่าจะรู้ว่า 1 ตำแหน่ง ที่ต้องการ มันต้องไปกำหนดที่ไหนบ้างนะครับ ถ้าเพื่อนๆมีเวลามากพอผมก็คงไม่ว่าอะไรนะครับ แต่การที่เทมเพลทมีการโหลดเยอะๆนั้น ก็จะส่งผลโดยตรงต่อการใช้งาน Extension อื่นๆ นะครับ หมายความว่า โดยปกติแล้ว เราจะเห็นว่าเทมเพลท แบบ commercial template นั้น จะออกมาในรูปแบบสำเร็จรูป ที่ extension มาให้พร้อมใช้ เพียงพอและลงตัวกับเทมเพลทที่ให้มา พูดง่ายๆก็คือ ไม่ต้องเพิ่มอะไรเลย เว็บสวยเหมือนตัวอย่างแน่นอน แต่ความจริงก็คือ เราไม่ได้ใช้องค์ประกอบหรือ extension ที่ให้มา เท่านั้น เรายังต้องมี extension อื่นๆ เพิ่มเติม นั้นจึงเกิดปัญหาทันที เพราะ เทมเพลท แบบ commercial template ไม่ได้ออกแบบมาให้รองรับทุก extension นะครับ เช่น ในตำแหน่ง Images show แสดงได้พอดีกับ module ที่ให้มา แต่พอเปลียนไปใช้ Module ตัวอื่น กลับใช้งานไม่ลงตัวสะงั้น หรือบางที่เว็บค้างเลย เป็นต้นนะครับ

 

Commercial template Joomla

    เป็นเทมเพลทแบบที่เราต้องเสียตังค์ ซื้อนะครับ (หรือไม่หว่า อิอิ) โดยปกติเทมเพลประเภทนี้นิยมออกมาตาม Component หลักๆ ที่มีในจูมล่า หรือทางผู้ผลิตมีทำขึ้นมานะครับ โดยอาศัยยึด Component เป็นหลักแล้วแตกรายละเอียดออกมาให้ลงตัวกับ Component นั้นๆ โดยเพิ่มเติมในส่วนโมดูลของ Component ดังกล่าว ให้ลงตัวมากยิ่งขึ้น และ ที่เป็นทีเด็ดก็คือ Script หรือ ลูกเล่นต่างๆ สุดอลังการ งานช้างเลยก็ว่าได้ โดยเทมเพลทเหล่านี้นั้นมักจะมีตัวอย่างแสดงให้เห็นในเว็บของผู้ผลิต และที่าสำคัญคือ มีการบอกรายละเอียดต่างๆอย่างครบครั้นและมีไฟล์ที่เป็นตัวอย่าง เช่นเนื้อหา หรือข้อมูลต่างๆ มาให้พร้อม เพื่อที่จะให้เรานำไปเปรียบเทียบในการทำเว็บไซต์ เรียกง่ายๆว่า สมบูรณ์แบบทุกอย่างตามที่มีให้นั้นเอง

 

   ถามว่าแล้ว commercial template เหมาะกับใคร คำตอบก็คือ เหมาะกับเว็บบริษัทหรือหน่อยงาน ที่ไม่ต้องการแก้ไขหรือนำเสนอเนื้อหามากนัก เพียงแค่ดูให้ตรงกับความต้องการ ว่ารูปแบบ โทนสี และการกำหนดเมนู พอๆกับที่เราต้องการใช่ไหม ถ้าใช่ก็ ok เลย แต่ถ้าเป็นเว็บที่ต้องการรายละเอียดเฉพาะอย่าง มากๆ แบบนี้จะไม่ค่อยเหมาะสักเท่าไหร นอกสะจากว่าเรามีประสบการณ์มากพอที่จะแก้ไขเทมเพลทได้ อันนั้นก็อีกเรื่องหนึ่งนะครับ

    เอาละครับ ที่บอกมาทั้งหมดก็ขึ้นอยู่กับเพื่อนๆว่าจะเลือกแบบไหน แต่ในความคิดส่วนตัวนั้น ก็ยังชอบเทมเพลทฟรีมากกว่า คือ เลือก รูปแบบของโทนสีต่างๆ เช่น สีของหัวข้อ สีของลิงค์ รูปแบบเมนู การจัดองค์ประกอบโดยรวมดูดี เทานี้ก็พอแล้ว ส่วนลูกเล่นนั้น ผมว่ามันอยู่ที่ Module หรือ plugin ที่เรานำมาใช้มากว่าครับ จะเป็นตัวสร้างสีสรรให้กับเว็บเรามากกว่าครับ อยากให้เพื่อนๆให้ความสำคัญในการเลือกสักนึด เพราะในอนาคตถ้าติดปัญหาแล้วแก้ไม่ได้นี้ เรื่องใหญ่นะครับ

ปล. ทั้งหมดนี้เป็นเพียงความคิดและประสบการ์ณของผมเท่านั้น อาจมีถูกบ้างผิดบ้าง ก็ขออภัยไว้ก่อน

ขอบคุณครับ
Webmaster JoomlaHitz.com (ริว)

  • No comments found

Leave your comments

Post comment as a guest

0
Powered by Komento

แนะนำบทความ

ติดตั้งภาษาไทย ใน VirtueMart
สวัสดีครับ หลังจากที่เราติดตั้ง VirtueMart สำหรับ Joomla แล้วนะครับ ในบทนี้เราจะมาคุยกันถึงเรื่องของภาษาไทยกันบ้าง เพราะเพื่อนๆหลายๆคนอาจจะงงกับรายละเอียดของ VirtueMart ...

สถิติผู้เข้าชม

0.png3.png3.png9.png1.png4.png
Today33
Yesterday500
This week1965
This month10798
Total33914

Who Is Online

7
Online

23 มิถุนายน 2560