3.5 .Thêm CSS và JS vào theme
3.6. Sử dụng Plugin Advanced Custom Field
Advanced Custom field là một plugin mà rất nhiều lập trình viên WordPress trên thế giới khuyên dùng vì nó sẽ rút ngắn thời gian bạn tạo meta box chỉ với vài cú click, thậm chí khâu gọi giá trị custom field của nó để hiển thị ra ngoài theme cũng rất nhanh vì hầu như chúng ta chỉ sử dụng một hàm duy nhất mà plugin này hỗ trợ sẵn. Để sử dụng plugin này ta chỉ cần biết những kiến thức php căn bản.
34
Hơn thế nữa, dù là plugin nhưng Advanced Custom field có hỗ trợ bạn export (truy xuất) các field mà bạn đã tạo ra thành code riêng, sau đó bạn có thể dễ dàng nhúng nó vào bất cứ dự án nào.
Cách tìm và cài plugin rất giống với cách cài theme, đó là bạn có thể cài qua 3 cách như cài trực tiếp từ thư viện trên Dashboard, upload file .zip của plugin hoặc upload plugin vào thư mục /wp-content/plugins trên localhost/host.
Để tìm plugin, các bạn truy cập vào Dashboard >> Plugins >> AddNew
Hình ảnh 3.11:Plugin Advanced Custom Field
Sau khi cài đặt xong bạn vào Dashboard >> CustomFields >> CustomFields
để tạo field và quản lý các field đã tạo. Ở đây bạn sẽ tạo field theo từng nhóm (group) bởi vì nó sẽ hiển thị theo nhóm trong khu vực viết bài.
Ấn nút Add New để bắt đầu tạo field.
Ở trong trang tạo field bạn sẽ có tất cả là 4 khu vực chính bao gồm: Tên nhóm (Enter title here).
Danh sách các field.
Location, ở đây có một tùy chọn Rules để ta thiết lập các điều kiện. Ví dụ ta sẽ thiết lập nó sẽ hiển thị và làm việc nếu nó thỏa mãn điều kiện nào đó. Options – bao gồm các tùy chọn nâng cao.
35
Hình ảnh 3.12: Giao diện của plugin Advanced Custom Field
Khi vào phần tạo field, ta sẽ cần điền tên nhóm field trước, đây chỉ là tên nhóm để ta dễ dàng quản lý sau này chứ không phải là tên field, ta có thể đặt sao cũng được. Ví dụ: Field phần mềm
Ở dưới phần danh sách field, bạn ấn vào nút Add Field để bắt đầu thêm một field vào nhóm.
Hình ảnh 3.13: Add Field để thêm field
Một cửa sổ nhỏ hiện ra, nó sẽ có các tùy chọn sau:
Field Label: Tên field hiển thị trong phần nhập liệu.
Field Name: Tên của field, để bạn gọi ra ngoài, không chứa ký tự đặc biệt và khoảng trắng. Thường nó sẽ tự xác định dựa vào Field Label.
36
Field Type: Loại field, hay còn gọi là Kiểu nhập liệu.
Field Introductions: Giới thiệu về field, nó sẽ hiển thị ngay bên dưới khung nhập liệu khi viết bài.
Required: Có bắt buộc phải nhập liệu cho field hay không.
Default Value: Giá trị mặc định sẽ áp dụng nếu người dùng không nhập liệu cho field.
Placeholder Text: Chữ sẽ hiển thị ngay bên trong khung nhập liệu. Prepend: Chữ sẽ hiển thị ngay trước khung nhập field.
Append: Giống prepend nhưng nằm ở phía sau.
Formatting: Có cho phép thực thi HTML từ giá trị hay không Character Limit: Giới hạn ký tự của giá trị nhập vào.
Conditional Logic: Thêm các điều kiện dựa vào các field khác. Ví dụ như field A có giá trị là abc thì sẽ hiển thị field hiện tại.
37
Hình ảnh 3.15: Điền thông tin cho field
Nhập xong bạn có thể tiếp tục ấn nút Add Field để thêm các field khác.
Ở phần Location ta có thể xem qua các tùy chọn ở đó để thiết lập cho field xuất hiện cụ thể ở trang nào.
Hình ảnh 3.16: Lựa chọn nơi field xuất hiện
Như ở hình ảnh ví dụ trên thì field sẽ xuất hiện ở trang Page có tên là “Home Page”.
38 Phần Options sẽ có các tham số như sau:
Position: Vị trí của nhóm field này.
Order No: Thứ tự hiển thị trong khu vực viết bài. Style: Chọn kiểu Standard.
Hide on Screen: Ẩn màn hình.
Hình ảnh 3.17: Phần Options của Custom Field
Nếu bạn tạo custom field cho Post, chỉ cần để mặc định. Sau khi chọn xong, hãy ấn nút Publish để hoàn tất khâu tạo field.