xử lý đầu ra HTML lớn thông qua mã plugin


9

Gần đây tôi đã viết plugin WP đầu tiên của mình có thêm một shortcode để nhúng bộ sưu tập hình ảnh jquery tùy chỉnh vào bài viết. Nó chủ yếu chỉ đưa một đoạn HTML tốt vào bài đăng, cùng với javascript cần thiết để khởi tạo.

Tuy nhiên, tôi đã phải xây dựng đầu ra HTML theo quy trình, như một chuỗi trong PHP. Loại súp thẻ này luôn khiến tôi phát điên và tôi đã từng làm việc với các khung MVC cung cấp những thứ như các hàm trợ giúp và các mẫu một phần để tạo HTML.

Cách tiếp cận chung cho các tác giả plugin cần quản lý số lượng lớn HTML hoặc JS được xây dựng động là gì?

Câu trả lời:


12

@Byran M. Tôi có xu hướng sử dụng hai cấu trúc mà tôi không thường thấy các nhà phát triển WordPress khác sử dụng thường xuyên, điều này làm tôi ngạc nhiên, nhưng tôi thích chúng rất nhiều.

1.) Di truyền

Bạn có thể lưu trữ các khối văn bản lớn dưới dạng chuỗi heredocs có thể trông như thế này để tôi có thể lưu trữ lo lắng về việc trộn các trích dẫn đơn và kép:

   $html=<<<HTML
<input type="{$type}" size="{$size}" id="{$id}" class="{$class}" value="{$value}" />
HTML;

Lưu ý rằng các biến có thể được truyền cho một hàm dưới dạng một mảng và sau đó extract()ed hoặc bạn có thể gán chúng theo các cách khác. Cũng lưu ý rằng tôi sử dụng dấu ngoặc nhọn không phải vì chúng luôn được yêu cầu nhưng chúng làm cho mã dễ đọc hơn. (Tất nhiên với các chức năng như the_content()khác biệt về mặt vật chất so với get_the_content()WordPress không phải lúc nào cũng làm cho phong cách mã hóa này trở nên dễ dàng.)

Hơn nữa, mặc dù nó có thể không liên quan đến bạn là nếu tôi sử dụng các tên heredoc như HTML, SQL, v.v. thì IDE PhpStorm của tôi thực hiện cú pháp cú pháp và sẽ cho tôi tự động hoàn thành và tô màu cú pháp trong heredoc.

2.) Nối chuỗi bằng cách sử dụng một mảng

Thành ngữ khác tôi muốn sử dụng là thu thập nội dung thành một mảng và sau đó implode()là mảng. Mặc dù tôi chưa bao giờ đánh giá điểm này vì vậy nó có thể ít hữu ích hơn tôi cho rằng tôi biết rằng nối chuỗi lặp lại là một kẻ giết người khi các chuỗi ngày càng lớn hơn (nếu có ai biết tại sao cách tiếp cận này không tốt hơn hoặc nếu bạn biết cách tiếp cận tốt hơn tôi 'rất thích nghe phản hồi):

function my_get_form_and_fields($input_items) {
    $html = array();
    $html[] = '<form name="my_form" method="get">';
    foreach($input_items as $input_item) {
        extract($input_item);
        $html=<<<HTML
<input type="{$type}" size="{$size}" id="{$id}" class="{$class}" value="{$value}" />
HTML;
    $html[] = '</form>';
    return implode("\n",$html);         
}   

1
+1 cho Heredocs, chúng thật tuyệt vời, đặc biệt là trong tình huống này.
không ai vào

Haven thực sự không có thời gian để đánh giá điều này, nhưng có vẻ như cách tiếp cận đơn giản nhất đưa ra những gì tôi cần.
Bryan M.

+1 cho nối chuỗi / chuỗi. Tôi làm điều đó rất nhiều. Nó làm cho nó dễ dàng để xây dựng các chuỗi mà không có dòng mới và không gian bên ngoài.
s_ha_dum

5

Kiểm tra chức năng này cho PHP:

http://php.net/manual/en/feft.ob-start.php

Bạn có thể đệm một tệp được bao gồm chỉ chứa mã html trong đó, thành một biến php. Điều này sẽ làm cho nó sạch hơn để duy trì.

Vì vậy, bạn kết thúc với một cái gì đó như thế này:

ob_start();
   include('path/to/my/html/file.php');
   $includedhtml = ob_get_contents();
ob_end_clean();

Sau đó, bạn có thể trả về $ includehtml ở nơi bạn cần và nó giữ cho nội dung html của bạn tách biệt khỏi phải lặp lại tất cả bên trong chuỗi php.


4

Tôi chưa thực sự sử dụng khung này, nhưng mô hình mẫu mà nó cung cấp có thể sẽ hấp dẫn. Bạn có thể muốn xem cách tác giả thiết lập nó.

https://github.com/Emerson/Sanity-Wordpress-Plugin-Framework

Mẫu ========= Bất cứ khi nào có thể, chúng ta nên tách PHP khỏi HTML. Trong Wordpress, bạn sẽ thấy cả hai kết hợp với nhau mà không sợ hãi. Mặc dù đây thường là một "cách dễ dàng" để làm mọi việc, nhưng nó gần như không bao giờ là "cách đúng đắn". Thay vào đó, chúng ta nên tách biệt hai người, do đó giữ cho logic của chúng ta trong sạch và quan điểm của chúng ta bị câm. Với mục đích này, chúng ta có phương thức $ this-> render ('my-template'). Một vài ví dụ:

    // From within a method in our controller
    $this->data['message'] = 'Pass this on to the template please';
    $this->render('my-template');

    // Meanwhile, in the /plugin/views/my-template.php file
    <h2>The Separation of Logic and Views</h2>
    <p><?php echo $this->data['message'];?></p>

Nó chỉ sử dụng bộ đệm đầu ra, giống như mô tả của Todd Perkins trong câu trả lời của ông.
Ian Dunn

2

Điều đó phụ thuộc vào loại HTML và JS.

JavaScript

Trước hết, tách các phần động ra khỏi các phần tĩnh càng nhiều càng tốt. Sau đó tải bất kỳ biến động nào bạn cần trong thời gian chạy và xếp hàng các tập lệnh tĩnh của bạn trong tiêu đề (hoặc chân trang, bất cứ thứ gì). Nhưng theo cách này, phần lớn JS của bạn tách biệt với PHP của bạn.

HTML

Đây là vấn đề xây dựng mã của bạn sạch sẽ trong PHP. Nếu bạn có khối lượng lớn HTML mà bạn sẽ sử dụng lại, tôi sẽ lưu trữ chúng dưới dạng các biến riêng biệt. Sau đó ghép các thứ lại với nhau khi shortcode được gọi đơn giản như:

echo $firstblock;
echo $shortcodecontent;
echo $lastblock;

Thay vì cố gắng xây dựng nó theo thủ tục, hãy xây dựng một đối tượng (vâng, PHP hỗ trợ các đối tượng) có chứa tất cả các khối HTML khác nhau của bạn, sau đó hướng dẫn nó sử dụng dữ liệu nào và dữ liệu nào sẽ truyền lại. Điều này sẽ giúp bạn tiết kiệm rất nhiều thời gian.

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.