มีเว็บง่ายๆ ได้แล้ว! วันนี้! กับ Hitzthemeเทมเพลตจูมล่า ภาษาไทย รองรับมือถือ
ดูขั้นตอนการสั่งซื้อ>>ที่นี่
Hitztheme จูมล่าเทมเพลตสำหรับคนไทย ใช้งานง่าย
ออกแบบสำหรับเว็บไซต์องค์กร บริษัท และหน่วยงานราชการ
ชำระครั้งเดียว ใช้งานได้ตลอดชีพ สำหรับ 1 เว็บไซต์ออนไลน์
เลือกใช้ได้ทันที ไม่ต้องเริ่มจากศูนย์
พร้อมใช้งาน ได้เหมือน Demo
ปรับแต่งได้เอง ใช้ง่ายสำหรับทุกคน
ทีมงานให้คำแนะนำตลอดการใช้งาน
โดยปกติแล้ว การเขียน CSS แบบทั่วไปนั้นจะมีการกำหนดการใช้ค่า ตามรูปแบบดังนี้
selector {property: value}
รูปแบบของคำสั่ง CSS นั้นจะประกอบไปด้วย 3 ส่วนคือ
โดยถ้านำรูปแบบมาเขียนก็จะได้ดังนี้
#recommend{ color:#ff0000; font-family:Tahoma, Geneva, sans-serif; font-size:12px;}
โดยแต่ละ Property จะจบด้วยเครื่องหมาย ; เสมอ และจะอยู่ในวงเล็บปีกกา {....Property.....}
ไฟล์ css ในเทมเพลตของเรานั้น จะมีด้วยกัน 2 ไฟล์หลัก ก็คือ
อาทิเช่น tonnum.css โดยจะเป็นไฟล์หลักในการกำหนดรูปแบบของ css ในเทมเพลต โดยเบื้องต้น ในแต่ละ Div set เราได้กำหนด css ไว้ให้แยกจากกัน
/*** top ***/#top{ background:#fff; padding-top:10px; padding-bottom:20px;}#top-body{ padding:0px;}#social{ padding-top:15px;}
/*** slide ***/#slide{padding:0px; overflow:hidden !important;}.favth-carousel-inner{ margin:0px !important;}.favslider-carousel .favth-carousel-indicators{ margin-top:20px !important;}
/*** recommend ***/#recommend{ padding-top:3%; padding-bottom:2%;}#recommend h2{ padding-bottom:10px;}
นั้นหมายความว่าในแต่ละ div set จะสามารถกำหนดเฉพาะจุดของ Module ได้โดยเพิ่ม css ลงในแต่ละส่วน อาทิเช่น ต้องการเพิ่มสีพื้นหลังของ div set ที่ชื่อ recommend ท่านก็เพิ่มดังนี้
/*** recommend ***/#recommend{ padding-top:3%; padding-bottom:2%;background:#000000;}#recommend h2{ padding-bottom:10px;}
จะเห็นว่าเราได้เพิ่มสีพื้นหลังเป็นสีดำ ให้กับในส่วน div set ที่ชื่อ recommend

ตัวอย่างการเปลี่ยนสีพื้นหลังใน Div Set ที่ชื่อ recommend ให้เป็นสีดำ
อาทิเช่น tonnum-m.css ในไฟล์นี้ จะเป็นตัวกำหนดการปรับขนาดของ css จากไฟล์หลัก (ตามข้อ 1) ให้ทำการแสดงผลรองรับในขนาดมือถือต่างๆ โดยเบื้องต้น เราแยกไว้ดังนี้
/* เมื่อความกว้างต่ำกว่า 1360px max*/@media screen and (max-width: 1360px) {
}/* เมื่อความกว้างต่ำกว่า 1024px max*/@media screen and (max-width: 1024px) {
.favth-carousel-caption h3 { font-size:2em !important ;} .favslider-caption-description { font-size:16px !important;}}
/* เมื่อความกว้างต่ำกว่า 768px max*/@media screen and (max-width: 768px) { #logo{ text-align:center;} #banner img{ text-align:center !important; margin:0 auto 0 auto; display:block; }}
/* เมื่อความกว้างต่ำกว่า 500px max*/@media screen and (max-width: 480px) {
#social { text-align:center; padding-top:10px;} .favth-carousel-caption h3 { font-size:1.4em !important ;} .favslider-caption-description { font-size:14px !important;}}
ซึ่งตามหลักการแล้ว เทมเพลตจะมองหาค่าที่กำหนดจากบรรทัดล่างสุดก่อนเสมอ ถ้าไม่พบการกำหนดใดๆ ก็จะเลื่อนขึ้นมาตามค่าต่างๆ จนถึงบนสุด จากหลักการนี้ เราเลยได้แยกขนาดความกว้างเอาไว้ โดยให้เทมเพลต มองจากขนาดต่ำสุดก่อน ถ้าไม่พบ ถึงค่อยขยับขึ้นมาดูในขนาดที่ใหญ่ขึ้นนั้นเอง แต่เราได้แยกในส่วน Blog เอาไว้ต่างหาก ที่ด้านล่างของไฟล์ css เพื่อให้เทมเพลตตรวจสอบก่อนเสมอ
** โปรดอย่าสลับการจัดเรียง เพราะจะสงผลในส่วนการแสดงผลที่เพียนไป
Code Components เป็น code หลักที่ใช้ในการเรียกแสดงข้อมูลในแต่ละหน้า โดยอ้างอิงจาก Component หรือ Content ที่สร้างขึ้นในส่วน Menu ซึ่งจะส่งผลให้ ในการสร้างเมนูต่างๆ ก็จะดึงการแสดงผลของ component หรือ content ในเมนูนั้นๆ มาแสดงผ่านทาง code นี้
<jdoc:include type="component" />
โดยปกติจะถูกใช้แค่ 1 ครั้งในเทมเพลตเท่านั้น เหมือน Code Message โดยเราได้กำหนดการเรียกใช้งานไว้ใน Div set ที่ชื่อ component เป็นหลักอยู่แล้ว

ตัวอย่าง ในข้อมูล กรอบสีส้ม คือการใช้งาน Code Components เรียก Content มาแสดงตามเมนู
Code Message คือ code ที่ใช้สำหรับในการเรียกคำแจ้งเตือนต่างๆ ซึ่งจะเป็นข้อความจากระบบของ Joomla โดยการใช้งานนั้นจะเพิ่ม code นี้ลงไปใน
<jdoc:include type="message" />
ซึ่งโดยปกติแล้ว Code Message นี้ จะอยู่ด้านบนของ code ของ component เสมอ
<jdoc:include type="message" /> <jdoc:include type="component" />
และจะถูกใช้แค่ 1 ครั้งในเทมเพลตเท่านั้น โดยเราได้กำหนดการเรียกใช้งานไว้ใน Div set ที่ชื่อ component เป็นหลักอยู่แล้ว โดยที่ Code Message จะทำงานก็ต่อเมื่อ มีการใส่ข้อมูลหรือได้รับข้อมูลต่างๆ ในหน้าเว็บไซต์ รวมถึงข้อความแจ้งเตือนในกรณีที่ทำไม่ถูกต้องในหน้าเว็บไซต์

ตัวอย่าง Code Message แสดงข้อความในกรณีที่เราไม่ใส่ email ให้ถูกต้อง
โดยปกติแล้ว ในส่วนคอลัมน์ที่เรากำหนดไว้นั้น จะมี code ที่ไว้สำหรับเรียกใช้งาน Module ผ่านชื่อ positions ที่กำหนดเอาไว้ใน code ท่านสามารถเพิ่ม Positions Module เองได้ง่ายๆ ด้วย code นี้
<jdoc:include type="modules" name="positions_name" style="xhtml" />
โดยให้ท่านเปลี่ยนตรง positions_name เป็นชื่อ positions ที่ท่านต้องการ อาทิเช่น
<jdoc:include type="modules" name="phone" style="xhtml" />
ท่านจะได้ positions ที่ชื่อ phone ไว้สำหรับเรียกใช้งาน module ซึ่งโดยปกติแล้ว เราจะทำการสร้าง code นี้พร้อมกับการสร้างคอลัมน์ใน Div Set ไปในตัว โดยตั้งชื่อ ID ให้ตรงกับชื่อ positions เพื่อความสะดวกในการจำ
<div id="top" class="container-fluid"> <div id="top-body" class="container"> <div id="logo" class="col-xs-12 col-sm-12 col-md-3 col-lg-3"> <jdoc:include type="modules" name="logo" style="xhtml" /> </div> <div id="menu" class="col-xs-12 col-sm-12 col-md-5 col-lg-5"> <jdoc:include type="modules" name="menu" style="xhtml" /> </div> <div id="social" class="col-xs-12 col-sm-12 col-md-2 col-lg-2"> <jdoc:include type="modules" name="social" style="xhtml" /> </div> <div id="phone" class="col-xs-12 col-sm-12 col-md-2 col-lg-2"> <jdoc:include type="modules" name="phone" style="xhtml" /> </div> </div></div>
ตัวอย่างการเพิ่มคอลัมน์ และ code เรียกใช้งาน module ที่ชื่อ phone ลงใน div set ของ Top
หลังจากที่ท่านเพิ่ม คอลัมน์ และ code เรียกใช้งาน module แล้วนั้น ในส่วนหลังบ้านของ Joomla ในส่วน Module ท่านจะต้องทำการพิมพ์ชื่อ positions ลงไปในช่องของ positions โดยตรง เพราะท่านจะไม่สามารถมองเห็นชื่อ positions ที่ชื่อ phone จากในรายการ ในขณะนี้

ตัวอย่างการเพิ่ม Position ใหม่ลงในเว็บไซต์ โดยการพิมพ์ชื่อ position ลงไป
หลังจากที่ท่านพิมพ์ชื่อ positions ลงไปแล้วนั้น ให้ทำการตรวจสอบคำให้ถูกต้อง ถ้า ok แล้ว ให้ทำการ ENTER 1ครั้ง ระบบก็จะทำการเก็บชื่อ Positions ให้ท่านโดยอัตโนมัติ

ตัวอย่าง หลังจากกด Enter แล้ว ชื่อก็จะถูกเก็บเข้าไปในรายการ positions
และเมื่อเราทำการ Save Module เราก็จะเห็นชื่อ Positions อยู่ในรายการ เพื่อไว้สำหรับเรียกใช้งานในครั้งต่อๆ ไป

ตัวอย่างรายการชื่อ positions ที่เราเพิ่มเข้าไป
เท่านี้! ก็มีเว็บไซต์พร้อมใช้งานแล้ว
เลือกดีไซน์ที่เหมาะกับธุรกิจหรือหน่วยงานของคุณ แล้วสั่งซื้อเพื่อรับไฟล์ดาวน์โหลด
ติดตั้งผ่าน QuickStart หรืออัปโหลดขึ้นโฮสติ้ง ได้ครบพร้อมใช้งานในไม่กี่ขั้นตอน
แก้ไขข้อความ รูปภาพ เมนู และสีสัน ให้ตรงกับแบรนด์ของคุณ
ออกแบบมาเพื่อความยืดหยุ่น ความเร็ว และประสบการณ์ใช้งานที่ดีที่สุด
ตอบโจทย์ทั้งธุรกิจและองค์กร
ปรับแต่งหน้าเว็บไซต์ได้อย่างอิสระ ไม่ต้องเขียนโค้ด
รองรับการจัดวางแบบลากวาง พร้อมดีไซน์ที่ทันสมัย.
รวมเครื่องมือสำคัญที่ช่วยให้คุณสร้างเว็บไซต์ได้อย่างมืออาชีพ
โดยไม่ต้องพึ่งนักพัฒนา.
เทมเพลตออกแบบอย่างมืออาชีพ มี Demo ให้เลือก
ช่วยให้คุณเริ่มต้นเว็บไซต์ได้ทันที
ออกแบบมาเพื่อรองรับเว็บไซต์
ทุกประเภทอย่างมืออาชีพ
เมนูและระบบภาษาไทย เข้าใจง่าย
ปรับแต่งได้เอง เหมาะกับคนไทย
จูมล่า 6 เทมเพลต แบบ Webkit เวอร์ชั่นล่าสุด รองรับ php 8.3 ขึ้นไป
มี Options Template ที่หลากหลายมากยิ่งขึ้น ดูคำแนะนำเทมเพลตจูมล่า 6 ได้แล้ว >> ที่นี่ <<
Ton-Num6 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Ton-Num5 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Ton-Num4 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Ton-Num3 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Ton-Num2 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Ton-Num1 J6 คือ Joomla 6 Template สำหรับเว็บไซต์ท่องเที่ยวและบล็อกทริป ดีไซน์ทันสมัย เน้นการแสดงภาพและประสบการณ์...
Joomla 6 Template เทมเพลตหน่วยงานราชการ เทมเพลตองค์กร เทมเพลตเทศบาล เทมเพลตโทนสีน้ำเงิน-ฟ้า ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตเว็บราชการ เทมเพลตหน่วยงานรัฐ เทมเพลตเว็บองค์กร เทมเพลตโทนสีน้ำเงิน-แดง ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน...
Joomla 6 Template เทมเพลตเว็บราชการ เทมเพลตหน่วยงานรัฐ เทมเพลตเว็บองค์กร เทมเพลตโทนสีฟ้า ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตหน่วยงานราชการ เทมเพลตองค์กร เทมเพลตเทศบาล เทมเพลตโทนสีส้ม ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Asoke Government1 J6 คือ Joomla 6 Template สำหรับเว็บไซต์หน่วยงานราชการ เทศบาล อบต และองค์กรภาครัฐ ดีไซน์เรียบง่าย ดูเป็นทางการ ใช้งานง่าย...
Joomla 6 Template เทมเพลตเว็บราชการ เทมเพลตหน่วยงานรัฐ เทมเพลตเว็บองค์กร เทมเพลตโทนสีส้ม ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Asoke BIZ4 J6 คือ Joomla 6 Template ที่ออกแบบมาเพื่อเว็บไซต์บริษัท องค์กร และธุรกิจโดยเฉพาะ ด้วยดีไซน์เรียบหรู ดูเป็นมืออาชีพ ใช้งานง่าย...
Minimal Interior4 J6 คือ Joomla 6 Template สำหรับธุรกิจออกแบบภายในและสถาปนิก ดีไซน์มินิมอล เรียบหรู โชว์ผลงานเด่น ปรับแต่งง่าย...
Asoke BIZ6 J6 คือ Joomla 6 Template ที่ออกแบบมาเพื่อเว็บไซต์บริษัท องค์กร และธุรกิจโดยเฉพาะ ด้วยดีไซน์เรียบหรู ดูเป็นมืออาชีพ ใช้งานง่าย...
Asoke BIZ2 J6 คือ Joomla 6 Template ที่ออกแบบมาเพื่อเว็บไซต์บริษัท องค์กร และธุรกิจโดยเฉพาะ ด้วยดีไซน์เรียบหรู ดูเป็นมืออาชีพ ใช้งานง่าย...
Minimal Interior3 J6 คือ Joomla 6 Template สำหรับธุรกิจออกแบบภายในและสถาปนิก ดีไซน์มินิมอล เรียบหรู โชว์ผลงานเด่น ปรับแต่งง่าย...
Minimal Interior6 J6 คือ Joomla 6 Template สำหรับธุรกิจออกแบบภายในและสถาปนิก ดีไซน์มินิมอล เรียบหรู โชว์ผลงานเด่น ปรับแต่งง่าย...
Asoke School4 J6 คือ Joomla 6 Template สำหรับเว็บไซต์โรงเรียน สถานศึกษา และหน่วยงานด้านการศึกษา ดีไซน์เรียบง่าย ดูเป็นระเบียบ ใช้งานง่าย...
Minimal School5 J6 คือ Joomla 6 Template สำหรับโรงเรียนและสถาบันการศึกษา ดีไซน์มินิมอล ดูเป็นระเบียบ ใช้งานง่าย...
Asoke School3 J6 คือ Joomla 6 Template สำหรับเว็บไซต์โรงเรียน สถานศึกษา และหน่วยงานด้านการศึกษา ดีไซน์เรียบง่าย ดูเป็นระเบียบ ใช้งานง่าย...
Asoke School2 J6 คือ Joomla 6 Template สำหรับเว็บไซต์โรงเรียน สถานศึกษา และหน่วยงานด้านการศึกษา ดีไซน์เรียบง่าย ดูเป็นระเบียบ ใช้งานง่าย...
Joomla 6 Template เทมเพลตเด็ก เทมเพลตโรงเรียน เทมเพลตแม่และเด็ก เทมเพลตโทนสีส้ม ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตโรงเรียน เทมเพลตสถาบันการศึกษา เทมเพลตวิทยาลัย เทมเพลตโทนสีชมพู-ฟ้า ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตโรงเรียน เทมเพลตสถาบันการศึกษา เทมเพลตวิทยาลัย เทมเพลตโทนสีชมพู-ฟ้า ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตโรงเรียน เทมเพลตสถาบันการศึกษา เทมเพลตวิทยาลัย เทมเพลตโทนสีม่วง-ชมพู ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตมหาวิทยาลัย เทมเพลตโรงเรียน เทมเพลตการศึกษา เทมเพลตโทนสีชมพู ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Minimal School3 J6 คือ Joomla 6 Template สำหรับโรงเรียนและสถาบันการศึกษา ดีไซน์มินิมอล ดูเป็นระเบียบ ใช้งานง่าย...
Joomla 6 Template เทมเพลตมหาวิทยาลัย เทมเพลตโรงเรียน เทมเพลตการศึกษา เทมเพลตโทนสีเขียว ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
Joomla 6 Template เทมเพลตโรงเรียน เทมเพลตสถาบันการศึกษา เทมเพลตวิทยาลัย เทมเพลตโทนสีเขียว-ส้ม ออกแบบอย่างมืออาชีพ ใช้งานง่าย จำหน่าย 15 พฤศจิกายน 2568
แนะนำตัวอย่างเทมเพลตสำหรับ จูมล่า 6
Joomla 5 Template ดูได้จาก >> ที่นี่
ไม่ต้องมีความรู้ด้านโค้ด ก็สามารถปรับแต่งทุกองค์ประกอบของเว็บไซต์ได้
ครบ จบ ในที่เดียว ผ่านระบบหลังบ้านเทมเพลตที่ออกแบบมาเพื่อคุณ
ครบทุกฟีเจอร์สำคัญ รองรับ Responsive และฟอนต์ภาษาไทย
พร้อมระบบปรับแต่ง Template และ CSS ที่ให้คุณออกแบบเว็บไซต์ได้อย่างอิสระ
รองรับ Responsive หรือ Desktop บนมือถือ เพื่อตอบโจทย์ทุกการใช้งาน
ปรับขนาดและจัดวางโมดูลได้อย่างยืดหยุ่น รองรับการแสดงผลหลายคอลัมน์ในตำแหน่งเดียว
รองรับการปรับรูปแบบเว็บไซต์เพื่อสื่อสารในโอกาสพิเศษได้อย่างเหมาะสม
เปิดใช้งานเทมเพลตได้ทันที พร้อมตรวจสอบสถานะการติดตั้งได้อย่างมั่นใจ
ปรับแต่งโครงสร้างหน้าเว็บได้ทันที ด้วยระบบที่ใช้งานง่ายและยืดหยุ่น
ตั้งค่าและปรับแต่งผ่านเมนูภาษาไทย ใช้งานง่าย ปรับแต่งได้ทันที
เลือกใช้ฟอนต์ภาษาไทยได้หลากหลายและฟรีด้วย Google Fonts ภาษาไทย
แก้ไขและปรับแต่ง CSS ได้ตามต้องการ เพิ่มสไตล์เว็บไซต์ได้อย่างอิสระ
รวมคำถามที่พบบ่อยเกี่ยวกับการใช้งานเทมเพลต
เพื่อช่วยให้คุณเข้าใจระบบและเริ่มต้นได้อย่างมั่นใจ
จะได้รับไฟล์เทมเพลตสำหรับติดตั้ง พร้อม Quickstart (ติดตั้งพร้อม Demo) และเอกสารแนะนำการใช้งานพร้อม User+pass ของ Quickstart
สามารถติดตั้งแบบ Quickstart เพื่อให้ได้เว็บไซต์เหมือน Demo และปรับแก้เนื้อหาได้ทันที
สามารถใช้งานได้ เทมเพลตถูกออกแบบให้ใช้งานง่าย และมีโครงสร้างพร้อมใช้งาน
สามารถปรับได้ทั้ง layout, โลโก้, เมนู และเนื้อหาผ่านระบบ Module และ Template Settings
มีตำแหน่ง Module ให้หลากหลาย รองรับการจัด layout ได้หลายรูปแบบตามต้องการ
สามารถกำหนด layout และ module แยกตามแต่ละเมนูได้อย่างอิสระ
สามารถเพิ่ม Script เช่น Tracking หรือเครื่องมืออื่น ๆ ได้ในส่วน Head หรือ Body ได้โดยตรง
รองรับการใช้งานร่วมกับ Extension ของ Joomla ได้อย่างยืดหยุ่น
รองรับการเขียน Custom CSS เพื่อปรับแต่งเว็บไซต์ในระดับที่ละเอียดมากขึ้น
รองรับ Extension ยอดนิยม และสามารถใช้งานร่วมกับ Page Builder ได้อย่างยืดหยุ่น
มีระบบยืนยันสิทธิ์การใช้งานผ่าน Serial Code เพื่อความมั่นใจในการใช้งาน
รองรับระบบหลายภาษาของ Joomla สามารถสร้างเว็บหลายภาษาได้
ประสบการณ์จริงจากผู้ใช้งาน ที่ไว้วางใจเลือกใช้เทมเพลตและบริการของ Hitztheme


