Trang chủ WordpressWordpress Development Giới thiệu serie Lập trình theme WordPress 2015

Giới thiệu serie Lập trình theme WordPress 2015

bởi Thạch Phạm
37 bình luận 6635 views

Chào các độc giả tại ThachPham.Com!

Trước đây trên thachpham.com đã có một serie khá dài mang tên Lập trình theme WordPress, tuy nhiên hiện tại mình đã xóa serie đó đi vì có quá nhiều kiến thức bên lề thay vì chú trọng vào việc lập trình theme WordPress, đâm ra nhiều người đã bị kẹt ở giữa serie.

Hiểu được khó khăn đó, mình đã sắp xếp lại và làm một serie hoàn toàn mới, tập trung tối đa vào việc lập trình một theme WordPress hoàn toàn là của riêng bạn, có thể nói đó là một Framework Theme của riêng bạn vì nếu bạn làm được theme trong serie này, bạn có thể tái sử dụng nó cho các dự án khác của bạn vì mình đã có nói qua cách “thiết kế” cấu trúc theme thế nào cho khoa học, chuyên nghiệp.

Trong serie này, bạn sẽ được biết qua các giai đoạn để có thể tự viết một theme WordPress bắt đầu từ những dòng code đầu tiên. Điều này có nghĩa là chúng ta không sử dụng bất cứ cái gì có sẵn, từ khung theme đến CSS mà sẽ tự viết hoàn toàn. Do là tự viết và tập trung vào kỹ thuật xây dựng theme, bài thực hành trong serie này sẽ không có Responsive, mà nếu bạn muốn thêm Responsive thì có thể làm dễ dàng từ bài Làm sao để có giao diện Responsive của mình.

lap-trinh-theme-cover

Mục tiêu của serie

Trong serie Lập trình theme WordPress 2015 này, mình có mục tiêu là phải mô tả được hết các thuật ngữ, lý thuyết và quan trọng nhất là kỹ năng tự lập trình một theme WordPress, dù nó chỉ là đơn giản nhưng chính vì cái đơn giản này sẽ là nền tảng quan trọng nhất nếu bạn muốn làm các theme phức tạp hơn.

Thông qua việc triển khai và thiết kế cấu trúc thư mục, bạn sẽ hiểu được một cấu trúc theme là thế nào và các template của một theme. Từ đó bạn sẽ dễ dàng hiểu các theme khác và có thể tùy biến theo cấu trúc của mình.

Mình cũng sẽ nói qua về cách tạo action hook cho theme (đã viết riêng tại đây) để bạn có thể dễ dàng tùy biến hoặc bảo trì về sau. Ý nghĩa và công dụng của action hook thì trong quá trình đi xuyên suốt serie bạn sẽ hiểu.

Kiến thức & Công cụ yêu cầu

Do serie này mình sẽ tập trung vào việc lập trình một theme WordPress nên các kiến thức rất cơ bản như HTML và CSS mình sẽ không nói qua, mà nếu có thì chỉ một chút thôi để không bị loãng. Do vậy mình khuyến khích các bạn nên có các kiến thức như:

Và công cụ, thì mình cần bạn chuẩn bị:

  • XAMPP hoặc một localhost nào đó đã có cài đặt sẵn WordPress và:
    • Theme Unit Test (Import file .xml vào, cách import xem tại đây).
    • Cài đặt plugin Developer và kích hoạt các module như Debug Bar, Debug Bar Console, Debug Bar Extender, Monster WidgetSimply Show IDs.
    • Mở file wp-config.php lên và sửa WP_DEBUG thànhtrue.
  • Một editor hoặc IDE mà bạn quen sử dụng để viết code như Sublime Text, NetBeans hoặc Brackets cũng được. Khuyến khích Sublime Text vì nó nhẹ.
  • Về trình duyệt mình khuyến khích bạn dùng Google Chrome hoặc Firefox.

Ngoài ra khi cài xong WordPress, phần Settings -> Media bạn nên để nguyên hoặc thiết lập giá trị giống ảnh dưới.

laptrinhtheme-mediasettings

Chỉ vậy thôi.

Video hướng dẫn cấu hình localhost khi làm theme

Nếu bạn dùng wptest.io mà quá nặng để bị lỗi khi import thì bạn dùng Theme Unit Test nhé.

Bạn đã sẵn sàng chưa?

Bạn đã sẵn sàng để bắt đầu chưa? Nếu rồi thì hãy xem tiếp phần kế để bắt đầu nhé, còn nếu chưa sẵn sàng thì cũng bắt đầu luôn. 😀

37 bình luận

Có thể bạn quan tâm

0 0 vote
Article Rating
guest
37 Comments
mới nhất
cũ nhất đánh giá nhiều
Inline Feedbacks
View all comments

[…] trúc template là hãy thực hành tuỳ chỉnh theme thật nhiều. Hoặc hãy tham gia serie Lập trình theme WordPress để biết cách tự code một theme từ A tới […]

[…] Học lập trình theme WordPress [A-Z] […]

[…] Tham khảo: Hướng dẫn thiết kế theme from scratch. […]

[…]  Series WordPress Theme Development – Thạch Phạm […]

[…] Học lập trình theme WordPress [A-Z] […]

trackback

[…] Tham khảo: Hướng dẫn thiết kế theme from scratch. […]

[…] Học lập trình theme WordPress [A-Z] […]

Lộc

Chao anh Thạch Phạm, anh cho em hỏi khi em cai đặt Developer và xong các bước thì import cái xml và chạy thì nó xuất hiện lỗi nhừ này
“Fatal error: Maximum execution time of 60 seconds exceeded in C:xampphtdocsDoubleDesignwp-includeswp-db.php on line 1877 ”
vậy là do bản wordpress của em bị lỗi đúng không anh ?

huy

Chào thạch phạm không biết mình hỏi ở đây có đúng khu vực không nhưng mình đang gặp 1 vấn đề với theme porto wordpress mà không biết cách giải quyết . Vấn đề là : Mình đã import demo BUSINESS-CONSULTING của theme porto nhưng cái demo này có 1 phần contact ở dưới footer mà mình không biết sửa ở đâu . Cậu có thể giúp mình không ? đây là demo mình đã cài : http://www.newsmartwave.net/wordpress/porto/business-consulting/

Đô Trần

Không thể nhập Theme Unit Test Anh AD ơi. “”Notice: wp_get_http đã bị loại bỏ từ phiên bản 4.4.0! Hãy sử dụng WP_Http. in E:xamppprohtdocswordpresswp-includesfunctions.php on line 3829″”

Khang

Lỗi này làm sao để fix vậy

Installation failed: Download failed. cURL error 35: error:0D0C50A1:asn1 encoding routines:ASN1_item_verify:unknown message digest algorithm

Luu Phong

” Import WordPress Failed to import Đa phương tiện “canola2” Failed to import Đa phương tiện “dsc20050315_145007_132” Failed to import Đa phương tiện “dsc20050727_091048_222” Failed to import Đa phương tiện “dsc20050813_115856_52” Failed to import Đa phương tiện “dsc20050831_165238_332” Failed to import Đa phương tiện “dsc20050901_105100_212” Failed to import Đa phương tiện “Bell on Wharf” Failed to import Đa phương tiện “Golden Gate Bridge” Failed to import Đa phương tiện “Sunburst Over River” Failed to import Đa phương tiện “Boardwalk” Failed to import Đa phương tiện “Yachtsody in Blue” Failed to import Đa phương tiện “Rain Ripples” Failed to import Đa… Xem thêm »

trankhanhhoang

Về thông báo Fatal error: Maximum execution time Bạn vào C:\xampp\php mở file php.ini thay đổi như sau
max_execution_time = 1000
Bạn lưu lại và restart lại xampp để thay đổi có hiệu lực nhé

Mình cũng bị lỗi như bạn trên, bạn nào hướng dẫn giúp mình cách sửa với???
Failed to import Đa phương tiện “canola2”
Failed to import Đa phương tiện “dsc20050315_145007_132”
...

trankhanhhoang

không có ai giúp được ạ @Thạch Phạm ???

công tâm

ad cho mình hỏi mình có code HTML , giờ mình muốn bỏ vào wordpress thì phải làm sao ,

Bánh Đa

em mở Theme Check lên và nó như vậy anh à. WARNING: The tag yellow has been deprecated, please remove it from your style.css header. WARNING: The tag white has been deprecated, please remove it from your style.css header. WARNING: The tag responsive-layout has been deprecated, please remove it from your style.css header. WARNING: The tag red has been deprecated, please remove it from your style.css header. WARNING: The tag light has been deprecated, please remove it from your style.css header. WARNING: The tag gray has been deprecated, please remove it from your style.css header. WARNING: The tag fixed-layout has… Xem thêm »

theanh

anh cho em hỏi khi em import vào rồi và cài đặt theme của mình tự tạo thì dữ liệu không trả về theme mình tạo mà cài đặt ở trong theme Twenty sixteen của wp thì sửa như thế nào ạ

Cảnh Nguyễn

Bác thạch phạm cho e hỏi với ạ. E có dùng themes porto mọi người chia sẻ nhưng khi up lên host nó xuất hiện thêm vào chữ “Buy this theme!”. Như vậy là mình không sử dụng đc ạ?

Tuấn Lê

Bạn ơi, nếu mình có tên miền va đã có host riêng thì có phải mình vào phpMyadmin để tìm wp-config mà sửa theme check , nhưng mình vào quản trị host mình không thấy cái file đó , giờ phải làm như thế nào bạn

Em Tiến

Anh Thạch cho e hỏi. Em có làm 1 website rao vặt trên nền tảng wordpress. Có tính năng đăng ký thành viên. Khi thành viên mới đăng tin thì giao diện xấu. Em muốn thay giao diện đăng tin thì làm theea nào ạ. Em cảm ơn anh

Nha

Anh Thạch ơi, sao em import bên wptest.io hay Theme Unit Test cũng có lỗi này vậy anh?
Fatal error: Maximum execution time of 60 seconds exceeded in C:\xampp\htdocs\ryblog.com\wp-includes\class-wp-http-curl.php on line 332

Nha

em thử rồi mà cũng báo lỗi đó nữa

KimChi

Bạn ơi không biết bạn đã sửa được lỗi đó chưa vậy, nếu rồi có thể giúp mình không, mình cũng bị lỗi như bạn mà làm hoài không được. Thanks!

KimChi

.htaccess ở thư mục website nào vậy anh Thạch?

Nguyễn Hưng

Anh Thạch ơi? cho e hỏi có cách nào chỉnh sửa theme cơ bản không anh? e tìm link bài viết mà không thấy. Để lập trình theme này cần phải học qua CSS, lại mất thời gian lâu nữa. E mới học 50 bài wordpress cơ bản trong vòng 2, e cảm thấy tiếp thu rất rễ khi có video hướng dẫn làm. Nhưng e muốn đưa web e làm lên môi trường web luôn để thực hành. A có link bài viết nào nói về chỉnh sửa theme ko, a gửi cho e đường link với. E cảm… Xem thêm »

Nguyễn Hưng

e bật debug lên mà ko được ? bình luận gửi hình ảnh như nào anh nhỉ? sau khi e theme check nó báo lỗi như này là lỗi gì vậy anh Thạch ơi? INFO: Only one text-domain is being used in this theme. Make sure it matches the theme’s slug correctly so that the theme will be compatible with WordPress.org language packs. The domain found is mh-magazine-lite INFO: mh-widgets.php The theme appears to use include or require. If these are being used to include separate sections of a template from independent files, then get_template_part() should be used instead. Line… Xem thêm »

Nguyễn Hưng

làm sao để cái debug nó hiện lên vậy anh ơi?

Tran Thang

Bạn ơi, cho mình hỏi, mình cài plugin developer thì báo phải nhập thông tin Hostname, FTP Username, FTP Password thì phải làm sao? giúp mình với. Cám ơn bạn nhiều.

37
0
Would love your thoughts, please comment.x
()
x