Thiết kế theme wordpress phần 6

26/12/2013 15:26 54991

Nếu chưa xem phần 5 thì xem theo link dưới nhé bạn:

• Thiết kế theme wordpress phần 5

Hôm nay chúng ta sẽ đi tìm hiểu về theme option và searchform:

Bạn nhìn vào ảnh thấy đơn giản đúng không nào, tuy nhiên việc mà chúng ta làm thì không phải ít đâu, tôi xin nói sơ qua các công việc làm để tạo một phần như hình vẽ trên, các nút rss, nút mạng xã hội là chúng ta sử dụng theme option đẻ lưu các url về rss về mạng xã hội, còn cái hộp tìm kiếm chúng ta sẽ sử dụng chức năng searchform của wordpress

Mã html của hình trên là:

• Thiết kế theme wordpress phần 7
• Thiết kế theme wordpress phần 8
• Giới thiệu khóa học làm chủ công nghệ Responsive Design
• Giới thiệu và hướng dẫn sử dụng code xem video haivl
• Dự án ebook thiết kế theme wordpress từ A->Z-Vì một cộng động yêu thích wordpress
• Lý do dự án về Ebook thiết kế theme wordpress ra đời
• Tản mạng về css
• Buổi tảng mạn về jquery
• Buổi tảng mạn về Php, mysql, apache, phpmyadmin, xampp
• Buổi tảng mạn về wordpress
• Kế hoạch html cho theme wordpress

Tạo menu tên là Theme option gắn vào wordpress admin, để làm việc này bạn mở file functions.php lên và gõ vào các lệnh dưới đây:

Tôi xin giải thích các dòng lệnh bênh trên:

• Hàm mylove_add_options: là hàm tôi khai báo dùng để lưu các options mặc định khi theme được cài đặt
• Hàm add_option: là làm tạo một option mới với tên và giá trị mặc định để lưu vào cơ sở dữ liệu
• add_action( ‘after_setup_theme’, ‘mylove_add_options’ ): chỉ đơn giản là thực hiện hàm mylove_add_options (hàm do chúng ta khởi tạo) ngay sau khi theme được cài đặt xong
• create_menu: là hàm tôi khai báo
• add_menu_page: là hàm có nhiệm vụ tạo menu, tham số đầu tiên của hàm là tạo một tiêu đề trên thanh tiêu đề, tham số thứ hai là tạo một mục menu ở đây là theme option, tham số thứ 3 là quyền để có thể thực hiện tác vụ này, tham số thứ 4 là một tham số trên url, phần bôi đỏ như hình dưới đó bạn

tham số thứ 5 là hàm cần thực hiện ở đây là mylove_theme_option, tham số thứ 6 là icon của menu, nếu bạn để trống nó sẽ sử dụng icon mặt định của wordpress, ở đây chúng ta để trống (phần đóng khung đỏ như hình ở dưới) 

tham số thứ 7 là vị trí hiểm thị menu, bạn có thể tham khảo bản vị trí dưới đây

• add_action(“admin_menu”,’create_menu’): là một action (hành động) của hook admin_menu thì thực hiện cái hàm create_menu ( tạo menu)
• function mylove_theme_option(){
  include “settings.php”;
  }

đây chỉ là một hàm include (bao hàm) file settings.php

Bây giờ chúng ta sẽ đi tìm hiểu tiếp file settings.php (file này bạn tạo file mới ngang hàng với file functions.php và gõ các lệnh sau vào)
[php]
if(($_SERVER[‘REQUEST_METHOD’] == ‘POST’)):
update_option( ‘mylove_rss’, $_POST[‘mylove_rss’] );
update_option( ‘mylove_facebook’, $_POST[‘mylove_facebook’] );
update_option( ‘mylove_twitter’, $_POST[‘mylove_twitter’] );
update_option( ‘mylove_googleplus’, $_POST[‘mylove_googleplus’] );
update_option( ‘mylove_youtube’, $_POST[‘mylove_youtube’] );
endif;
?>

[/php]
Tôi xin giải thích sơ qua các lệnh bên trên, khi một hành động submit, ở đây chúng ta đặt tên là cập nhật được thực hiện thì biến $_SERVER[‘REQUEST_METHOD’] kiểm tra xem có phải xem có phải là một hành động post không nếu có thì thực hiện các update_option do người dùng nhập và các lệnh dưới chỉ là form mã html (bạn tự tìm hiểm nha), ở đây tôi chỉ đơn cử một trường hợp để bạn hiểu

<input name=”mylove_rss” type=”text” id=”mylove_rss” value=”<?php $value = get_option(‘mylove_rss’); echo !empty($value) ? get_option(‘mylove_rss’) : ”; ?>

mỗi khi chúng ta click vào theme option thì chúng ta sẽ lấy giá trị của từng option đã khởi tạo lúc vừa mới cài đặt theme và in giá trị ra value của input text

Mỏi tay quá đi…

(Còn tiếp…)