Trợ giúp Tạo Loại Bài đăng Tùy chỉnh Trình chiếu với Hộp Meta Tùy chỉnh?


16

Tôi cần tạo một hộp meta bài đăng tùy chỉnh cho loại bài đăng tùy chỉnh "Trình chiếu" (loại bài đăng này đã được tạo). Mỗi metabox sẽ giữ nội dung trong mỗi slide slide và lưu nó vào các trường tùy chỉnh tương ứng. Mỗi metabox nên chứa các trường sau:

  • Tiêu đề (Trường văn bản)
  • Hình ảnh (Hoặc là Trường văn bản cho URL img hoặc lý tưởng nhất là Danh sách thả xuống hiển thị hình thu nhỏ của hình ảnh được đính kèm với bài đăng)
  • Mã nhúng (Vùng văn bản)
  • Mô tả (wysiwyg)
  • Ẩn Slide (Hộp kiểm để sử dụng để tạm thời ẩn một slide mà không xóa nó)
  • Xóa Slide (nút xóa nội dung của các trường meta bài đăng được điền bởi slide này)

Tôi cũng muốn có một nút ở đâu đó cho phép tôi "Thêm một slide" để khi nó được nhấp, nó sẽ thêm một Hộp Meta Custom "Slide" khác, trùng lặp với số đầu tiên nhưng thêm số tăng vào mỗi trường meta bài tùy chỉnh. Tôi hiện chỉ có 15 metabox và mẫu Trình chiếu được thiết lập theo cách nếu chỉ có 5 trong số các metabox được điền vào thì chỉ có 5 slide hiển thị.

Cuối cùng, tôi muốn có thể sắp xếp lại các trang chiếu, cho dù bằng cách "Kéo và thả" hoặc bằng một Trường văn bản khác mà tôi có thể nhập số thứ tự.

Tôi đã nhận được nó gần như là nơi tôi cần với plugin "Nhiều lĩnh vực" hơn và một số trợ giúp về mã từ Rarst. Với plugin "Nhiều lĩnh vực" hơn, tôi có các trường sau trong mỗi siêu dữ liệu:

  • Tiêu đề (Trường văn bản)
  • Hình ảnh (Danh sách thả xuống của hình ảnh được đính kèm với bài đăng)
  • Mã nhúng (Vùng văn bản)
  • Mô tả (wysiwyg)
  • Ẩn Slide (Hộp kiểm để sử dụng để tạm thời ẩn một slide mà không xóa nó)

Dưới đây là ảnh chụp màn hình về cách tôi thiết lập nó thông qua plugin "Nhiều lĩnh vực" hơn:

văn bản thay thế

Vấn đề với điều này là không có cách nào để xóa một slide khi nó được tạo bởi vì "Nhiều lĩnh vực" không sử dụng ở <?php delete_post_meta($post_id, $key, $value); ?>bất cứ đâu. Vấn đề khác với plugin là nó quá không đáng tin cậy và thường xuyên bị hỏng với các bản cập nhật.

Tôi đã có thể thực hiện một giải pháp tương tự với các metabox tùy chỉnh của riêng mình bao gồm:

  • Tiêu đề (Trường văn bản)
  • Hình ảnh (Trường văn bản cho URL img)
  • Mã nhúng (Vùng văn bản)
  • Mô tả (Vùng văn bản)
  • Ẩn Slide (Hộp kiểm để sử dụng để tạm thời ẩn một slide mà không xóa nó)

Với cách triển khai này, tôi dường như không thể làm cho nhiều trường TinyMCE hoạt động hoặc hộp thả xuống hình ảnh. Mã TinyMCE dường như hoạt động cho đến khi tôi thêm mã tạo các bản sao tăng dần của siêu dữ liệu đầu tiên tại thời điểm tôi gặp lỗi này ngay phía trên trường nơi các nút TinyMCE phải là : Warning: array_push() [function.array-push]: First argument should be an array....

Ngoài ra, ngay bây giờ tôi đang dựa vào các tác giả của mình để biết đưa vào EITHER một video hoặc một hình ảnh cho mỗi slide và điều đó tốt hơn nhưng có một nút radio cho phép họ chọn một slide nào (có thể mặc định là hình ảnh) được gắn với một tuyên bố hiển thị có điều kiện trong mẫu trình chiếu.

Tôi đang xử lý tải lên hình ảnh thông qua hộp "Hình ảnh nổi bật" tích hợp trong thanh bên mặc dù tôi không bận tâm đến một siêu dữ liệu tùy chỉnh chỉ đơn giản nói "Tải lên hình ảnh" ở đầu bảng ghi.

Cuối cùng, tôi đang tìm kiếm một slideshow tương tự như thế này: http : //www.nytimes.com/sl lanh / 2010/08/10 / science / 201810angier-1.html . Tôi muốn tôi cũng có thể có một video dưới dạng nội dung trong slide thay vì hình ảnh. Tôi cần một bảng quản trị trực quan và dễ sử dụng cho các nhà văn của mình (họ không rành về công nghệ và không đáng tin cậy khi sử dụng html và / hoặc shortcodes). Chỉ trong trường hợp không rõ ràng từ ví dụ, mọi slide sẽ tạo ra một lần xem trang mới.

Sắp xếp lại Drag'n'Drop không phải là ưu tiên cao nhưng sẽ rất tuyệt. Tôi tìm thấy một plugin xử lý việc này thực sự tốt: SlideDeck . Thật không may, plugin không phù hợp với nhu cầu của tôi, nhưng cách họ xử lý việc đặt hàng các slide khá lắt léo. Đó là một metabox riêng biệt trong thanh bên cho phép bạn kéo các slide xung quanh theo thứ tự bạn muốn. Đây cũng là cách bạn thêm các trang chiếu, bằng cách nhấp vào nút "Thêm trang chiếu" để thêm một Bản chiếu Metabox khác vào bảng ghi. Đây là một ảnh chụp màn hình:

văn bản thay thế

Bạn cũng có thể xem thêm ảnh chụp màn hình của nó trong kho lưu trữ wordpress .

Đây là tất cả mã của tôi:

Các chức năng thiết lập Loại bài đăng trình chiếu và Trình chiếu trình chiếu của tôi: http://loak.pastebin.com/g63Gf186

Mã ban đầu từ DeluxeBloggingTips.com (DBT) mà tôi dựa trên Metaboxes của mình từ: http://loak.pastebin.com/u9YTQrxf

Phiên bản mã DBT mà tôi đã sửa đổi để cung cấp cho tôi các phiên bản gia tăng của cùng một metabox: http://loak.pastebin.com/WtxGdPrN

Một phiên bản sửa đổi của mã DBT mà Chris Burbridge đã tạo để cho phép nhiều phiên bản của TinyMCE: http://loak.pastebin.com/Mqb3pKhx Với mã này, TinyMCE hoạt động.

Việc sửa đổi mã Burbridge của tôi cố gắng kết hợp gia tăng của tôi và trường cho phép bạn chọn hình ảnh từ danh sách thả xuống của tất cả các hình ảnh được đính kèm vào bài đăng: http://loak.pastebin.com/xSuenJTK Trong lần thử này, TinyMCE bị hỏng và thả xuống không hoạt động.

Điều này có thể không quan trọng nhưng chỉ trong trường hợp bạn đang tự hỏi, đây là mã tôi sử dụng để lấy mã nhúng từ meta bài đăng tùy chỉnh, thay đổi kích thước và chèn nó vào bài đăng: http://loak.pastebin.com / n7pAzEAw

Đây là phiên bản chỉnh sửa của câu hỏi ban đầu để phản ánh tình trạng hiện tại của dự án và trả lời các câu hỏi được đăng trong các bình luận. Cảm ơn Chris_O vì đã đưa tiền thưởng vào việc này. Ngoài ra, cảm ơn RarstJustin đã giúp tôi giải quyết rất nhiều điều này trong diễn đàn ThemeHy điều.com . Tôi đã dành hàng giờ đồng hồ cho việc này và bị mắc kẹt (tôi đã dành một vài giờ một mình cho Câu hỏi này). Mọi sự trợ giúp sẽ rất được trân trọng.


Bạn có thể vẽ một hình ảnh simle cho thấy toàn bộ hình ảnh, như một bản phác thảo hay không? Tôi nghĩ rằng đó là hữu ích để hiểu rõ hơn nhu cầu của bạn.
hakre

Tôi đã thêm một số ví dụ vào phía dưới. Nếu điều này không đủ rõ ràng mọi thứ lên cho tôi biết.
matt

Nó vẫn chưa rõ ràng?
matt

Bất kỳ ai? Là cái này trên?
matt

@Hakre, bạn có?
matt

Câu trả lời:


6

Từ vẻ bề ngoài của mọi thứ, đặt cược an toàn nhất và lộ trình dễ dàng nhất của bạn sẽ là rẽ nhánh plugin More Field dành riêng cho bạn sử dụng. Hai tính năng lớn nhất tôi có thể thấy ngã ba của bạn cần là một "nhà máy" và giao diện kéo và thả.

Nhiều lĩnh vực

Đề xuất của tôi sẽ là xem xét lớp WordPress Widget và sử dụng nó làm mô hình cho nhà máy lĩnh vực của bạn - về cơ bản, mượn khả năng tạo nhiều phiên bản của một trường sau khi bạn đã xây dựng khung cho nó.

Đây là cốt lõi của cách nhiều widget hoạt động trong một thanh bên:

  • Bạn xác định mã cho mỗi widget một lần bằng cách mở rộng WP_Widgetlớp.
  • Sau đó, bạn có thể tạo bao nhiêu bản sao của widget mà bạn muốn
    • Các chi tiết cụ thể của từng widget được lưu trữ dưới dạng dữ liệu nối tiếp trong bảng tùy chọn
  • Bạn có thể tùy chỉnh từng tiện ích, loại bỏ chúng bằng một deletelệnh đơn giản và đặt rõ ràng vị trí của chúng thông qua giao diện kéo và thả Giao diện

Kéo và thả

Một lần nữa, tôi khuyên bạn nên tìm đến hệ thống widget WordPress để lấy cảm hứng. Chúng ta đã có một giao diện kéo và thả khá trực quan được thiết lập ở đó, do đó, sẽ khá dễ dàng để tái sử dụng nhiều mã tương tự ở nơi khác. Hoặc, nếu bạn muốn thực sự ưa thích, bạn có thể triển khai hệ thống kéo và thả của riêng mình bên trong một trường meta tùy chỉnh riêng biệt.

Vì vậy, mỗi slide sẽ được xác định bởi một hộp meta tùy chỉnh được liên kết với bài viết. Thứ tự của các slide sẽ được đặt bởi một hộp meta tùy chỉnh riêng biệt cũng được liên kết với bài đăng. Tôi khuyên bạn nên gửi các bản cập nhật slide qua AJAX để bạn có thể tự động cập nhật hộp meta thứ tự slide dựa trên thông tin (điều này ngăn việc phải nhấn "cập nhật" theo cách thủ công và đợi trang tải lại trước khi di chuyển mọi thứ xung quanh).

Giao diện người dùng jQuery có giao diện " có thể kéo " tuyệt vời mà bạn có thể dễ dàng thao tác cho các mục đích của mình trong hộp meta tùy chỉnh này. Phần khó không phải là xây dựng giao diện, nó nhận được sự giao tiếp chính xác , nhất quán giữa hộp meta và bộ sưu tập hộp meta slide ở nơi khác trên trang.

Tóm tắt

Những gì tôi thu thập được từ bài viết của bạn là bạn có một giải pháp khả thi:

  • Bạn đã thêm 15 trường tùy chỉnh vào loại bài đăng tùy chỉnh của mình thông qua tiện ích Nhiều trường hơn nhưng muốn tự động thêm / xóa các trường thay vì làm việc với một số được đặt
  • Bạn muốn có một cách để điều chỉnh thứ tự của các trường tùy chỉnh này để các slide tải theo thứ tự

Cách tôi tiếp cận điều này là để trừu tượng hóa quá trình tạo meta tùy chỉnh cho một lớp mà tôi có thể sử dụng nhiều lần để tạo các trường meta tùy chỉnh mới. Sau đó, tôi sẽ mở rộng lớp để khởi tạo hai loại hộp meta: một cho các slide, một cho cấu trúc slide. Tôi cũng sẽ tích hợp vào hộp meta cấu trúc slide khả năng tự động tạo các hộp meta slide mới (các hộp meta slide sẽ chứa hành động "xóa" của riêng chúng).

Toàn bộ trình chiếu sẽ được lưu trữ không phải bởi các hộp meta slide, mà bởi hộp meta cấu trúc slide vào trường meta tùy chỉnh cho bài đăng - meta tùy chỉnh sẽ là một mảng lởm chởm, với mỗi slide được biểu thị dưới dạng mảng trong đó - trong đặt hàng . Tùy chỉnh thứ tự trình chiếu trong hộp meta cấu trúc sẽ sắp xếp lại mảng và lưu lại meta bài đăng. Bằng cách này, tôi chỉ có 1 giá trị meta để đọc lại khi tôi muốn truy cập vào trình chiếu.

Giữa SlideDeck, Nhiều trường hơn và mã tùy chỉnh bạn đã kết hợp từ trước đến nay, bạn đã có hầu hết giải pháp của mình trong tay ... bạn chỉ cần làm cho tất cả cùng hoạt động cùng một lúc. Trước tiên, tôi tập trung vào việc thực hiện root trước khi thêm các chỉnh sửa JavaScript - tự động tạo, sửa đổi, lưu và xóa các slide quan trọng hơn trình soạn thảo văn bản phong phú, IMO. Lấy cái đó ra trước. Sau đó nhận được hệ thống đặt hàng xuống. Sau đó, bạn có thể tập trung vào việc có nhiều phiên bản TinyMCE hoạt động trên trang.


Cảm ơn đã giúp đỡ! Hiện tại đây là một chút trong bộ kỹ năng của tôi nhưng sẽ phục vụ như một hướng dẫn tốt trong quá trình học tập. Tôi biết về "các lớp" và nhận ra rằng tôi đã sử dụng một lớp trên mã metaboxes nhưng tôi vẫn không hiểu chúng. Một điều nữa tôi "biết" nhưng không hiểu đầy đủ là việc sử dụng mảng.
mờ

Lời khuyên của bạn về việc giảm các nguyên tắc cơ bản trước tiên có ý nghĩa nhưng tôi chống lại một số hạn chế trong thế giới thực đòi hỏi tôi phải đưa nó vào môi trường sản xuất càng sớm càng tốt và một trong những yếu tố quan trọng nhất là trình soạn thảo wysiwyg vì nhiều nhà văn rất phi kỹ thuật . Tôi không ngại làm cho dự án gia tăng và dựa vào nạng trên đường đi nhưng cách tiếp cận này rõ ràng cần phải có khả năng mở rộng. Điều đó nói với tôi rằng dường như sử dụng plugin "nhiều trường hơn" có thể đóng vai trò là giải pháp tạm thời cho đến khi tôi nhận ra điều này tuy nhiên tôi không chắc nó sẽ hoạt động với ...
matt

cách tiếp cận của bạn để lưu toàn bộ trình chiếu trong một trường tùy chỉnh. Bạn có thực sự nghĩ rằng đặt tất cả trong một lĩnh vực là tốt hơn? Điều này nghe có vẻ không biết gì nhưng dường như đối với tôi có nhiều lỗi hơn nếu wp phải viết lại toàn bộ slideshow mỗi khi có một thay đổi nhỏ.
matt

Lưu toàn bộ chương trình vào một trường meta vừa ngăn ngừa vừa giới thiệu các vấn đề: Nó tiết kiệm thời gian trên trang web thuyết trình bằng cách không buộc bạn phải chọn, đọc và lặp qua nhiều trường. Tuy nhiên, nếu một cái gì đó phá vỡ trong một slide và được ghi vào DB, nó sẽ phá vỡ toàn bộ trình chiếu. Chắc chắn là một sự đánh đổi, nhưng tôi luôn lựa chọn tốc độ và dễ phát triển.
EAMann

Bạn đang nói rằng nó tiết kiệm thời gian ở mặt trước của trang web? Tại sao điều đó sẽ xảy ra nếu nó chỉ hiển thị một slide mỗi lần?
matt

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.