Viết code cho file functions.php

[Lập trình theme WordPress] Thêm chức năng Theme Options

Một trong những file quan trọng nhất của một theme WordPress đó là file functions.php. Đây là một file bắt buộc trong theme và nó sẽ chứa các đoạn code nguồn mà bạn muốn nó luôn được load mỗi khi tải website, tóm lại là toàn bộ code PHP cần thiết trong một theme (ngoại trừ các code hiển thị nội dung) thì sẽ đều được viết vào file này.

Trong bài này, chúng ta sẽ tiến hành khai báo các đoạn code cần thiết trong file functions.php này, cũng như thiết lập một số hằng dữ liệu (constrant) để thiết lập một số dữ liệu quan trọng mà chúng ta sẽ cần sử dụng lại nhiều.

Thiết lập các hằng dữ liệu quan trọng

Trong khi viết code trong file functions.php, chúng ta sẽ dùng đi dùng lại một số đoạn code như get_stylesheet_directory_uri, hoặc khai báo các đường dẫn. Do vậy, chúng ta nên thiết lập trước một số hằng dữ liệu chứa cố định các giá trị đó để có viết thì chỉ cần viết tên hằng ra thôi.

Chúng ta có code ban đầu như sau:


/**
  @ Thiết lập các hằng dữ liệu quan trọng
  @ THEME_URL = get_stylesheet_directory() - đường dẫn tới thư mục theme
  @ CORE = thư mục /core của theme, chứa các file nguồn quan trọng.
  **/
  define( 'THEME_URL', get_stylesheet_directory() );
  define( 'CORE', THEME_URL . '/core' );

Rồi sau này khi bạn làm theme khác, hoặc cải tiến theme thì có thể thêm một số hằng dữ liệu vào để cho phù hợp với nhu cầu của mình, cái quan trọng là mình muốn tạo thói quen này cho các bạn ngay từ bây giờ.

Bây giờ bạn hãy tạo thêm một thư mục trong theme tên là core và tạo một file tên là init.php trong thư mục đó. Tại sao lại tạo thư mục này và file này làm cái gì? Bởi vì như mình đã nói ở đầu bài, là trong bài này mình sẽ hướng các bạn đến việc làm framework theme cho riêng mình luôn, nên thư mục /core sẽ chứa các file code PHP quan trọng trong theme của bạn mà bạn không muốn thay đổi nhiều nếu có nhu cầu tạo child theme. File init.php sẽ có ý nghĩa là load các file PHP đặc thù trong theme mình mà chúng ta sẽ tạo, ví dụ như load các file tạo widget của theme vào, bước này chúng ta sẽ làm sau.

Bạn viết tiếp vào file functions.php như sau để load file init.php.


/**
  @ Load file /core/init.php
  @ Đây là file cấu hình ban đầu của theme mà sẽ không nên được thay đổi sau này.
  **/

  require_once( CORE . '/init.php' );

Thiết lập chiều rộng nội dung ($content_width)

Bây giờ, bạn hãy đặt đoạn code này vào file functions.php nhé:


 /**
  @ Thiết lập $content_width để khai báo kích thước chiều rộng của nội dung
  **/
  if ( ! isset( $content_width ) ) {
  	/*
  	 * Nếu biến $content_width chưa có dữ liệu thì gán giá trị cho nó
  	 */
  	$content_width = 620;
   }

Biến $content_width nghĩa là chúng ta sẽ thiết lập chiều rộng tối đa mà phần hiển thị nội dung (không tính sidebar) mà theme được phép sử dụng, đây là một tính năng của theme WordPress. Khi thiết lập biến này, điều đó không có nghĩa là theme của bạn đã có chiều rộng vì ta phải viết CSS nữa. Nhưng việc khai báo như vậy sẽ giúp cho các thành phần hiển thị trong nội dung như các mã nhúng oEmbed, hình ảnh,….sẽ không bị tràn ra ngoài khung nội dung vì nó sẽ dựa theo giá trị $content_width mà hiển thị tối đa.

Hàm thiết lập chức năng của theme

Tiếp tục, chúng ta sẽ tạo một hàm tên gì đó và sẽ có chức năng móc vào cái hook init của WordPress để khởi tạo các chức năng sẽ được theme hỗ trợ, như post format, customizer,…Hãy chèn đoạn sau vào:


/**
  @ Thiết lập các chức năng sẽ được theme hỗ trợ
  **/
  if ( ! function_exists( 'thachpham_theme_setup' ) ) {
  	/*
  	 * Nếu chưa có hàm thachpham_theme_setup() thì sẽ tạo mới hàm đó
  	 */
  	function thachpham_theme_setup() {

  	}
  	add_action ( 'init', 'thachpham_theme_setup' );

  }

Điều này có nghĩa là, hàm thachpham_theme_setup() sẽ được tạo mới nếu máy chủ kiểm tra chưa có hàm đó tồn tại. Sau đó, hàm này sẽ được móc vào action hook init của WordPress để nó sẽ được thực thi sau khi WordPress đã load xong trang.

Bây giờ, chúng ta sẽ tiến hành viết code vào trong hàm thachpham_theme_setup() để thiết lập một số tính năng.

Thiết lập theme có thể dịch được sang nhiều ngôn ngữ

Chức năng này có nghĩa là chúng ta sẽ khai báo thư mục chứa ngôn ngữ trong theme, và khai báo textdomain để load các chuỗi ngôn ngữ có trong theme nhằm mục đích cho theme có thể đọc được các file ngôn ngữ và người dùng có thể dịch ra nhiều ngôn ngữ khác nhau bằng việc sửa/tạo file .po.

Chúng ta có code như sau:


/*
* Thiết lập theme có thể dịch được
*/
$language_folder = THEME_URL . '/languages';
load_theme_textdomain( 'thachpham', $language_folder );

Cái textdomain nghĩa là một cái tên nhận diện các chuỗi mà chúng ta sẽ cho phép dịch trong theme. Cách viết chuỗi chứa textdomain mình sẽ nói về sau.

Tự chèn liên kết RSS Feed trong mã nguồn

Đây là một chức năng nhỏ trong WordPress, nó sẽ tự thêm một liên kết RSS Feed chèn trong cặp thẻ <head> trong mã nguồn website để các trình đọc RSS Feed có thể hiểu trực tiếp địa chỉ RSS Feed trong website của bạn mà không cần khai báo chính xác địa chỉ RSS Feed, tạo sự thuận tiện cho người đọc.


 /*
 * Tự chèn RSS Feed links trong <head>
 */
 add_theme_support( 'automatic-feed-links' );

Thêm chức năng thumbnail cho post

Chức năng thumbnail ở đây nghĩa là chức năng Featured Image mà khi chúng ta soạn post. Để cho cái đó có thể hiển thị ra thì chúng ta phải khai báo sử dụng chức năng này trong theme:


 /*
 * Thêm chức năng post thumbnail
 */
 add_theme_support( 'post-thumbnails' );

Thêm chức năng title-tag

Đây là một chức năng mới có trong WordPress 4.1 trở đi. Chức năng title-tag nghĩa là sẽ giúp cho theme tự thêm thẻ <title> trên tài liệu HTML được xuất ra và nó sẽ có cấu trúc khá thông minh như:

  • Hiển thị kiểu Tên website | Mô tả website ở trang chủ
  • Hiển thị kiểu Tên post/page | Tên website ở trang nội dung post type

Điều này có nghĩa là sau này chúng ta code file header.php thì sẽ không cần thêm hàm wp_title() nữa. Hãy cứ yên tâm là các plugin hỗ trợ SEO như WordPress SEO by Yoast đều tương thích với chức năng này.


 /*
 * Thêm chức năng title-tag để tự thêm <title>
 */
 add_theme_support( 'title-tag' );

Thêm chức năng Post Format

Chức năng Post Format nghĩa là chúng ta có thể tùy biến việc hiển thị post theo các định dạng như Video, Image, Gallery, Quote,…Ở đây chúng ta sẽ chỉ sử dụng vài post format mà thôi.</pre>


/*
* Thêm chức năng post format
*/
add_theme_support( 'post-formats',
    array(
       'image',
       'video',
       'gallery',
       'quote',
       'link'
    )
 );

Bây giờ bạn có thể thử vào tạo post mới sẽ thấy có khung chọn Post Format rồi.

Thêm chức năng custom background

Chức năng này sẽ giúp cho người dùng có thể đổi lại màu nền hoặc thêm ảnh nền cho website dễ dàng thông qua Customize.


/*
* Thêm chức năng custom background
*/
$default_background = array(
   'default-color' => '#e8e8e8',
);
add_theme_support( 'custom-background', $default_background );

Tạo menu location

Trong cái theme mà chúng ta sẽ làm sẽ có một menu hiển thị ra bên ngoài. Do vậy chúng ta sẽ tiến hành viết code để WordPress tạo một Menu Location để chúng ta có thể thêm menu vào đó.



/*
* Tạo menu cho theme
*/
register_nav_menu ( 'primary-menu', __('Primary Menu', 'thachpham') );


Ở đoạn trên, mình sẽ tạo một menu có slug tên là primary-menu, và sẽ đặt tên menu này là Primary Menu. Thế cái đoạn __('Primary Menu', 'thachpham') có ý nghĩa gì? Đó chính là một đoạn text mà mình muốn những người sử dụng theme sau này có thể tự dịch được sang ngôn ngữ khác bằng các phần mềm dịch, và thachpham chính là textdomain để nhận diện. Tất cả các đoạn text mà bạn muốn có thể dịch được sẽ đều phải viết có cấu trúc là __('Text', 'textdomain') thay vì chỉ viết thông thường.

Tạo sidebar

Theme này sẽ có một sidebar nên chúng ta sẽ cần tạo ra một sidebar để chút nữa chúng ta có thể viết code hiển thị vào file sidebar.php nhé.


 /*
 * Tạo sidebar cho theme
 */
 $sidebar = array(
    'name' => __('Main Sidebar', 'thachpham'),
    'id' => 'main-sidebar',
    'description' => 'Main sidebar for Thachpham theme',
    'class' => 'main-sidebar',
    'before_title' => '<h3 class="widgettitle">',
    'after_title' => '</h3>'
 );
 register_sidebar( $sidebar );

Bây giờ bạn có thể sẽ thấy sidebar đã xuất hiện trong Appearance -> Widgets rồi đó.

Toàn bộ nội dung functions.php trong bài này


<?php

/**
  @ Thiết lập các hằng dữ liệu quan trọng
  @ THEME_URL = get_stylesheet_directory() - đường dẫn tới thư mục theme
  @ CORE = thư mục /core của theme, chứa các file nguồn quan trọng.
  **/
  define( 'THEME_URL', get_stylesheet_directory() );
  define( 'CORE', THEME_URL . '/core' );

/**
  @ Load file /core/init.php
  @ Đây là file cấu hình ban đầu của theme mà sẽ không nên được thay đổi sau này.
  **/

  require_once( CORE . '/init.php' );

 /**
  @ Thiết lập $content_width để khai báo kích thước chiều rộng của nội dung
  **/
  if ( ! isset( $content_width ) ) {
  	/*
  	 * Nếu biến $content_width chưa có dữ liệu thì gán giá trị cho nó
  	 */
  	$content_width = 620;
   }

/**
  @ Thiết lập các chức năng sẽ được theme hỗ trợ
  **/
  if ( ! function_exists( 'thachpham_theme_setup' ) ) {
  	/*
  	 * Nếu chưa có hàm thachpham_theme_setup() thì sẽ tạo mới hàm đó
  	 */
  	function thachpham_theme_setup() {
  		/*
  		 * Thiết lập theme có thể dịch được
  		 */
  		$language_folder = THEME_URL . '/languages';
  		load_theme_textdomain( 'thachpham', $language_folder );

  		/*
  		 * Tự chèn RSS Feed links trong <head>
  		 */
  		add_theme_support( 'automatic-feed-links' );

  		/*
  		 * Thêm chức năng post thumbnail
  		 */
  		add_theme_support( 'post-thumbnails' );

  		/*
  		 * Thêm chức năng title-tag để tự thêm <title>
  		 */
  		add_theme_support( 'title-tag' );

  		/*
  		 * Thêm chức năng post format
  		 */
  		add_theme_support( 'post-formats',
  			array(
  				'video',
  				'image',
  				'audio',
  				'gallery'
  			)
  		 );

  		/*
  		 * Thêm chức năng custom background
  		 */
  		$default_background = array(
  			'default-color' => '#e8e8e8',
  		);
  		add_theme_support( 'custom-background', $default_background );

                /*
                 * Tạo menu cho theme
                 */
                 register_nav_menu ( 'primary-menu', __('Primary Menu', 'thachpham') );

                /*
                 * Tạo sidebar cho theme
                 */
                 $sidebar = array(
                    'name' => __('Main Sidebar', 'thachpham'),
                    'id' => 'main-sidebar',
                    'description' => 'Main sidebar for Thachpham theme',
                    'class' => 'main-sidebar',
                    'before_title' => '<h3 class="widgettitle">',
                    'after_sidebar' => '</h3>'
                 );
                 register_sidebar( $sidebar );
  	}
  	add_action ( 'init', 'thachpham_theme_setup' );

  }

Lời kết

Vậy là trong bài này chúng ta đã có một file functions.php khá đầy đủ các tính năng cần thiết trong theme rồi. Thêm vào đó, cũng ta đã có thêm thư mục /core trong theme và file init.php trong đó nhưng chưa có nội dung.

Ở bài sau, chúng ta sẽ đi qua việc viết thẳng đến nội dung của file header.php của theme nhé.

Nguồn: Viết code cho file functions.php | Thạch Phạm

Categories: Content Marketing, Digital Marketing, Google Ads, Kinh doanh, PHP, SEO, Server - Hosting, WordPress, WordPress Development, Wordpress Plugin, WordPress Theme, Wordpress Tutorial,
Tags: baemin, bán hàng online, bán hàng online trên facebook, bán hàng qua facebook, bán hàng quần áo, bán hàng thời trang, bán hàng trên baemin, bán hàng trên facebook, bán hàng trên fanpage, bán hàng trên grab, bán hàng trên marketplace, bán hàng trên now, bán hàng trên tiktok, báo cáo kết quả hoạt động kinh doanh, bí quyết kinh doanh online, bít tết Âu việt, black friday, buôn bán hàng thùng, buôn bán hàng thùng tuyển chọn, cách bán hàng online đắt khách, cách bán hàng trên marketplace, cách bán hàng trên tiktok, câu chuyện kinh doanh, câu chuyện thành công, chương trình khuyến mãi, công nghệ phần mềm bán hàng, cửa hàng cafe, cửa hàng minh tuấn mobile, cửa hàng phụ kiện, cửa hàng thời trang, cửa hàng thực phẩm, cửa hàng thực phẩm sạch, doanh số bán hàng, dox garage & coffee, dox garage &amp; coffee, đăng ký bán hàng trên baemin, đăng ký bán hàng trên go food, đăng ký bán hàng trên grab, đăng ký bán hàng trên now, facebook, facebook pos, fanpage, file excel, file excel báo cáo kết quả kinh doanh, file excel quản lý kho, foodngon, go food, go jek, grab, halo mobile, khởi nghiệp, khởi nghiệp kinh doanh, khởi nghiệp kinh doanh thời trang, kinh doanh cafe, kinh doanh điện thoại, kinh doanh điện tử điện máy, kinh doanh đồ handmade, kinh doanh gì sau dịch, kinh doanh mỹ phẩm, kinh doanh mỹ phẩm online, kinh doanh nhà hàng, kinh doanh online, kinh doanh phụ kiện, kinh doanh quán cafe, kinh doanh shop thời trang, kinh doanh siêu thị mini, kinh doanh spa, kinh doanh thành công, kinh doanh thời trang, kinh doanh thời trang trẻ em, kinh doanh thực phẩm, kinh doanh thực phẩm sạch thành công, kinh doanh trên facebook, kinh doanh trên grab, kinh nghiệm bán hàng, kinh nghiệm kinh doanh, làm đồ handmade, lily shop, link kháng tài khoản quảng cáo, lụa tơ tằm bá minh, marketing online, mặt hàng dễ bán, mẹo bán hàng, mẹo bán hàng trên facebook, mẹo hay, ngày black friday năm 2020 là ngày nào?, now, now - foody, phầm mềm quản lý bán hàng miễn phí, phần mềm chốt đơn, phần mềm chốt đơn hàng, phần mềm miễn phí, phần mềm pos, phần mềm quản lý bán hàng, phần mềm quản lý bán hàng đáng tin cậy, phần mềm quản lý bán hàng miễn phí, phụ kiện ben & tony, phụ kiện ben &amp; tony, phụ kiện hà xinh, quán cafe hiệu quả, quản lý cửa hàng, quản lý cửa hàng thời trang, quản lý nhà hàng, quản lý nhân viên, quản lý nhân viên cứng đầu, quản lý nhân viên thời vụ, quảng cáo thương hiệu, shop thời trang, shopee, siêu thị minimart, status, status bán hàng, status quảng cáo mỹ phẩm, stella spa, stt bán hàng online hài hước, stt tương tác bán hàng, t.u.s shop, tài khoản bị vô hiệu hóa, tài khoản facebook, tài khoản facebook bị vô hiệu hóa, tải miễn phí file excel quản lý kho, tăng doanh thu mùa black friday, thời trang kosta, thời trang mine, thời trang tú trần shop, thực phẩm sạch, thực phẩm sạch 02, thực phẩm sạch tâm an, thuê mặt bằng kinh doanh, tiki, tiktok, tú trần shop,
Cách chọn host để chạy tốt WordPress
Đếm lượt xem bài viết WordPress khi website có cache
Tác giả

Bình luận

Leave a Message

Registration isn't required.

NguyenLp LarTheme