Giao diện mặc định của Thematic
Nếu bây giờ chúng ta có hỏi trong các WordPress Framework Theme thì framework nào nhiều người sử dụng nhất tại Việt Nam thì có lẽ câu trả lời thuộc về Genesis, và tiếp đến sau đó là Thesis. Chúng ta vốn suy nghĩ rằng những cái gì trả phí luôn là tốt nhất, điều này luôn đúng với Genesis hay Thesis.
Nhưng có một điều rằng liệu có dám chắc 60% (chỉ cần 60% thôi) người sử dụng 2 framework đình đám này là tự mua? Đừng giận mình, đó là sự thật. Vậy thì thay vì chúng ta vi phạm bản quyền như vậy thì làm sao lại không sử dụng một cái gì đó miễn phí mà vẫn tốt nhỉ?
Sau một thời gian dài thử dùng trên tất cả các framework miễn phí mà mình từng được biết thì mình thấy Thematic là có hướng sử dụng khá giống với Genesis nhất mà cũng dễ tùy biến nhất nên bây giờ mình sẽ giới thiệu nó cho mọi người sử dụng. Và để khuyến khích, sắp tới mình sẽ làm tutorial và một vài child theme dành riêng cho Thematic, đồng thời mình đã Việt hóa nó.
Giới thiệu Thematic Framework
Thematic Framework phải liệt thuộc dạng framework khá “già” nếu so với Genesis hay Thesis bởi vì mình không biết chính xác thời gian nó ra mắt vào năm nào nhưng ở năm 2008 thì đã thấy nó.
Tuy ra đời đã lâu nhưng có vẻ nó không rầm rộ như Genesis (trả phí) hay Hybrid Core (gần như miễn phí), chắc có lẽ là nó quá xấu mặc dù nó vẫn được update đến bây giờ và vẫn có thành viên sử dụng thảo luận tại forum Thematic.
Thematic Framework được tạo ra bởi Ian Stewart (Yes, anh ấy đến từ Automattic), Chris Gossmann và Gene Robinson và bạn có thể hiểu Thematic là một starter theme hay framework cũng đều được bởi vì không giống các framework khác, Thematic sử dụng cấu trúc theme theo chuẩn WordPress mà bạn có thể tự sửa trực tiếp trên theme gốc mà không cần tạo thêm child-theme. Nhưng mình vẫn khuyến khích các bạn nên tạo child theme ra mà tùy biến để không phải bị mất đi các Action Hooks quan trọng.
Download – Forum – Homepage
Tại sao mình lại khuyên dùng Thematic?
Có nhiều lý do khách quan lẫn chủ quan để mình khuyến khích bạn dùng Thematic, cụ thể như:
Miễn phí
Miễn phí sử dụng, miễn phí hỗ trợ trên forum. Chúng ta được dùng một framework tốt mà không cần phải đi xin xỏ hoặc ngồi lựa virus nếu có download trên internet. Như thế không phải tốt hơn sao?
Dễ sử dụng
Cũng như bao framework khác, chúng ta đa phần sử dụng Action và Filter để tùy biến. Nhưng ví dụ như Genesis chẳng hạn, nếu không có cái documentation của họ thì dễ gì bạn mò ra những Filter Hooks quan trọng được, nhưng Thematic thì khác, bạn có thể dễ dàng biết được một cái hook bất kỳ mà bạn đang tìm kiếm, chỉ việc mở theme gốc lên và mở file bạn cần xem hook ra là thấy rồi.
Như ví dụ ảnh trên, chẳng cần filter, chúng ta có thể thay đổi toàn bộ nội dung bên trong của hook bằng cách phổ thông như sau
add_action( ‘thematic_indexloop’, ‘tpcustom_indexloop’ );
function tpcustom_indexloop() { ?>//Viết vòng lặp vào đây
<?php }
vậy là xong, coi như cái loop mặc định của Thematic đã được biến đổi đi và bạn tự nhiên viết loop của mình vào. Tương tự, bạn có thể sử dụng các hook khác để chèn nội dung vào website dễ dàng, chẳng khác gì Genesis.
Đừng bỏ qua: Danh sách Action Hooks của Thematic (biểu đồ)
Còn nếu bạn chưa hiểu về cấu trúc của Thematic thì cứ mở theme mặc định lên và soi nó tầm một xíu là hiểu ngay để có thể dễ dàng tùy biến theo ý mình.
Nhiều đặc điểm nổi bật
Dĩ nhiên là được làm bởi thành viên Automattic thì nó sẽ khác một xíu. Bao gồm:
- 13 khu vực chèn widget – Awesome.
- Hỗ trợ 3 layout khác nhau.
- Hỗ trợ theme options, dễ dàng tạo thêm theme option.
- Blank style, nghĩa là ngoài các CSS cơ bản ra thì nó chẳng có gì hết để bạn dễ dàng viết thêm CSS.
- Hoạt động tốt nhất với plugin SEO All in One SEO Pack và Platinum SEO. Nhưng mà yên tâm đi, nó vẫn hoạt động tốt với SEO by Yoast vì mình thử rồi.
- Tối ưu để cài thêm các plugin như Subscribe to Comments, WP-PageNavi, và Comment-license.
- Hỗ trợ class động cho thẻ body đa dạng hơn để các chuyên gia CSS thỏa sức sáng tạo.
- Hỗ trợ sẵn một child theme ví dụ kèm theo, chỉ cần copy thư mục đó ra ngoài wp-content/themes, mở file style.css sửa lại các thông tin như tên theme, họ tên của mình, kích hoạt và FAP FAP FAP.
- Tích hợp sẵn SuperFish Menu.
Làm thế nào để custom Thematic?
Để dễ dàng cho những người mới, mình bày cho các bạn một số cách để có thể custom Thematic theo ý của mình bằng nhiều cách khác nhau.
1. Tạo một child theme trước khi làm bất cứ gì
Như mình đã nói ở trên, Thematic là một framework nên tốt nhất bạn nên tạo một child theme dựa trên theme gốc vì họ có update gì thì không bị loạn cả lên.
Cách tạo child theme cho Thematic cũng giống như bao framework khác, đó là tạo một thư mục theme mới tạo wp-content/themes.
Sau đó tạo file style.css và khai báo như sau:
/*
Theme Name: Blogline child theme for Thematic
Theme URI: https://thachpham.com
Description: Use this theme to start your Thematic Child Theme development.
Author: Thach Pham
Author URI: https://thachpham.com
Template: thematic
Version: 1.0
Tags: white, three-columns, two-columns, fixed-width, theme-options, left-sidebar, right-sidebar, threaded-comments, sticky-post, microformats
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*//* Reset browser defaults */
@import url(‘../thematic/library/styles/reset.css’);/* Apply a basic layout */
@import url(‘../thematic/library/layouts/2c-r-fixed.css’);/* Apply basic image styles */
@import url(‘../thematic/library/styles/images.css’);/* Apply default theme styles and colors */
/* It’s better to actually copy over default.css into this file (or link to a copy in your child theme) if you’re going to do anything outrageous */
@import url(‘../thematic/library/styles/default.css’);/* Prepare theme for plugins */
@import url(‘../thematic/library/styles/plugins.css’);/*=========[Sửa ở dưới này ]================*/
Bạn có thể không import những file CSS mà bạn không muốn sử dụng bằng cách xóa bớt đi. Dễ hiểu phải không. Rồi tạo tiếp một file functions.php như sau:
/**
* Define theme setup
*/
function childtheme_setup() {
//Khai báo những tính năng cần bật (add_theme_support)
}
add_action(‘thematic_child_init’, ‘childtheme_setup’);
Hoặc có một cách khác là trong gói theme của Thematic đã đính kèm sẵn một child theme ví dụ, bạn chỉ cần copy nó ra ngoài thư mục wp-content/themes và sử dụng thôi.
2. Viết CSS đè lên
Cái này chắc ai cũng biết rồi đúng không nào, chỉ là soi class bằng FireBug hoặc Inspect Elements rồi viết lại CSS theo ý mình. Cách tốt nhất là bạn viết theo cấu trúc CSS của file default.css rồi đè lên.
Còn nếu bạn chưa biết thì nên dợt một khóa CSS căn bản tại W3S.
3. Sử dụng Action Hooks
Cách này để chèn một cái gì đó khác lạ vào theme thông qua các hooks (ở đây bạn có thể hiểu là một điểm chỉ định để bạn chèn). Ví dụ bạn vào trang Visualizing Thematic Framework sẽ thấy danh sách các Action Hooks qua các phần cụ thể, chẳng hạn như thematic_belowheader() được dùng để bạn chèn một cái gì đó nằm dưới header, chẳng hạn như chèn một nội dung ngay dưới đó thì bạn viết code như sau:
add_action( ‘thematic_belowheader’, ‘customthematic_belowheader’ );
function customthematic_belowheader() {?>
<div class="example">Đây là nội dung hiển thị dưới header</div>
<?php }
Dĩ nhiên là viết vào file functions.php của child theme hoặc viết ở một file PHP nào đó rồi include vào file functions.php nhé.
Xem thêm: Hướng dẫn Action & Filter Hook toàn tập.
4. Sử dụng Filter
Trước tiên nếu bạn chưa hiểu qua khái niệm Filter là gì thì xem Video hướng dẫn WordPress Filter của mình nhé.
Ví dụ mặc định shortcode [theme-link] sẽ in ra địa chỉ website của Thematic, nếu bạn muốn sửa thành sẽ in ra địa chỉ theme của mình thì có thể dùng filter như sau:
function childtheme_theme_link($themelink) {
return $themelink . ‘ & <a class="child-theme-link" href="http://example.com/" title="Awesome Theme" rel="designer">Awesome Theme</a>’;
}
add_filter(‘thematic_theme_link’, ‘childtheme_theme_link’);
5. Chép đè cấu trúc
Nếu bạn không muốn sử dụng cấu trúc của một file nào đó mà muốn thay đổi toàn bộ thành cấu trúc của riêng mình thì có thể chọn cách này. Ví dụ như bạn không muốn dùng file index.php của theme mẹ thì bạn có thể chép đè bằng cách tạo file index.php cho thư mục child theme của mình, sau đó viết code cho file đó theo ý bạn.
Hybrid + Thematic = Full Power
Hybrid Core đã rất nổi tiếng vì framework khá thông minh và toàn diện, và mình đang tiến hành tích hợp nó vào Thematic để nó nhiều tính năng sẵn hơn để bạn có thể sử dụng.
Nhân tiên mình cũng sẽ làm một ít Thematic Child Theme đơn giản trong thời gian tới. Và mình cũng hy vọng sẽ có thêm nhiều người cùng xây dựng các child theme cho Thematic để phục vụ nhu cầu của người Việt.
File Việt hóa Thematic
Trong Thematic hỗ trợ rất nhiều ngôn ngữ khác nhau nhưng tiếc là chưa có tiếng Việt, do đó mình đã dịch xong 100% các cụm từ cần dịch, ngoại trừ các từ chuyên nghành như Trackback, URL, Email, Website,…
Bạn có thể tải file Việt hóa tại đây và trong đó bao gồm hướng dẫn bạn cài vào.
Tài nguyên dành cho Thematic Framework
- Build WordPress Sites Fast With the Thematic Theme Framework
- How To Modify WordPress Themes The Smart Way
- Useful Thematic Filters
- 10 design tips for your custom wordpress theme built with thematic
Mong rằng Thematic sẽ giúp cho bạn có cơ hội sử dụng một theme Framework miễn phí để thay thế các framework trả phí như Genesis hay Thesis cho những ai chưa đủ điều kiện. Hãy tin mình đi, chỉ cần biết một xíu PHP, cách sử dụng Action Hooks và CSS đã đủ bạn tự tùy biến một framework rồi, rành luôn Filter nữa thì quá tốt.
