Categories Hướng dẫn

Làm thế nào để thêm văn bản giữ chỗ trong các hình thức trọng lực

Nếu bạn chưa biết, Gravity Forms là một trong số ít các plugin liên quan đến WordPress dành cho người mới bắt đầu. Chúng tôi sử dụng nó trên trang web WordPress Gallery của chúng tôi, trang WordPress Coupon, và khá nhiều khách hàng mới. Gần đây trong khi làm việc trên trang web của khách hàng, chúng tôi phải tinh chỉnh kiểu dáng của mẫu để phù hợp với thiết kế yêu cầu chúng tôi đưa văn bản giữ chỗ trong Mẫu Gravity. Thật không may và đáng ngạc nhiên, tính năng này không được xây dựng trong Gravity Forms (Yet). Mặc dù chúng có tùy chọn để thêm văn bản giữ chỗ trong trường thả xuống và trường sau: category, không có tùy chọn nào để thêm trình giữ chỗ vào trường đầu vào và trường textarea. Điều này đã trở thành một vấn đề rất lớn đối với chúng tôi. Chúng tôi tìm kiếm thông qua các vùng hỗ trợ Gravity, nơi giải pháp duy nhất có sẵn là một hack mà thậm chí không làm việc đúng. Mặc dù nó cho phép chúng tôi đặt văn bản giữ chỗ, nhưng nó có những vấn đề lớn. Nếu người dùng chỉ nhấn nút gửi mà không thực sự điền vào trường, biểu mẫu sẽ xác nhận hợp lệ thay vì trả lại lỗi. Sau một cuộc tìm kiếm tốt, chúng tôi đã tìm ra giải pháp. Trong bài này, chúng tôi sẽ chỉ cho bạn cách thêm văn bản giữ chỗ trong các mẫu trọng lực sử dụng các bộ lọc mẫu jQuery và Gravity Form.

Vì vậy, có thể bạn đang tự hỏi tại sao chúng ta cần văn bản giữ chỗ khi nhãn có ở đó? Vâng trong thiết kế chúng tôi đang làm việc, chúng tôi không thể sử dụng nhãn cho mục đích tạo kiểu.

Ví dụ mẫu trọng lực với văn bản giữ chỗ

Tất cả chúng ta phải làm là thêm một hàm bằng cách sử dụng các bộ lọc Gravity Forms và sử dụng jQuery để xuất văn bản.

Mã cuối cùng

Mã cuối cùng là dưới đây. Bạn chỉ cần sao chép và dán tệp này vào tệp tin functions.php của mình và làm việc. Nhưng nếu bạn muốn đọc thêm về chức năng và cách hoạt động, sau đó tiếp tục đọc bài báo. Cũng tiếp tục đọc để xem cách thêm văn bản giữ chỗ trên các trường thả xuống.

    • Vì vậy, điều đầu tiên chúng ta phải làm là thêm một giá trị giữ chỗ dưới các trường Gravity Forms trong bảng quản trị. Để làm điều đó, bạn cần mở tệp functions.php của chủ đề và dán đoạn mã sau:

    • Hàm này sẽ thêm một trường văn bản giữ chỗ trong phần phụ trợ của Gravity Forms của bạn. Ví dụ chụp màn hình dưới đây:

    Trường giữ chỗ ở dạng Gravity

    Bây giờ chúng ta đã thêm trường trong bảng quản trị, bạn có thể tiếp tục và điền chúng vào với văn bản bạn muốn. Bước tiếp theo là để thực sự hiển thị văn bản trên hình thức thực tế. Để làm điều này, chúng tôi sẽ sử dụng jQuery. Những gì bạn cần làm là dán mã sau vào tệp tin functions.php của chủ đề ngay sau mã trước đó: 

    / * Chúng tôi sử dụng jQuery để đọc giá trị trình giữ chỗ và chèn nó vào trường * /

 add_action ('gform_enqueue_scripts', "my_gform_enqueue_scripts", 10, 2);

 hàm my_gform_enqueue_scripts ($ form, $ is_ajax = false) {
 ?> 
    Thao tác này sẽ xuất văn bản giữ chỗ trên trường đầu vào và trường văn bản và giữ nó xác nhận.  Bây giờ chúng tôi đã đề cập đến vấn đề này, chúng tôi vẫn cần thêm văn bản giữ chỗ trên các trường thả xuống của chúng tôi mà đoạn mã nhỏ này không làm cho chúng tôi.  Thankfully Gravity Forms đã được tích hợp sẵn theo mặc định. 
    

    Thêm văn bản giữ chỗ trong trường Biểu đồ Thu hút Trọng lượng xuống 
    

    Tất cả những gì bạn thực sự cần làm là tạo một nhãn với một giá trị trống.  Vâng, điều đó nghe có vẻ gây bối rối cho chúng tôi khi chúng tôi lần đầu tiên nghe nó là tốt.  Nhưng nó thực sự là không.  Vì vậy, thêm một trường thả xuống trong Gravity Forms.  Nhấp vào hộp kiểm cho biết Enable Values.  Sau đó thêm Nhãn với giá trị trống.  Tham khảo ảnh chụp màn hình dưới đây: 
    

    Thả xuống Văn bản giữ chỗ ở dạng Gravity 
    

    Đó là tất cả những gì bạn phải làm để thêm văn bản giữ chỗ trong Gravity Forms.  Bạn có lẽ tự hỏi nếu đây là người mới bắt đầu thân thiện WordPress liên hệ với plugin mẫu, thì tại sao nó không thêm một cái gì đó đơn giản đã?  Vâng, chúng tôi tự hỏi điều tương tự chính xác.  Vì vậy, người sáng lập @syedbalkhi đã liên lạc với một trong những đối tác của Gravity Forms, Carl Hancock.  Dưới đây là cuộc trò chuyện mà họ có: 
    




    Vì bạn có thể thấy rằng đây là điều mà họ biết, và nó sẽ được thêm vào trong các bản phát hành trong tương lai.  Để xem tất cả những điều tuyệt vời Gravity có thể làm, chỉ cần kiểm tra bài viết của chúng tôi về Gravity Forms. 
    

    Tín dụng đến chức năng tuyệt vời và đoạn mã jQuery đi tới Jorge Pedret (@jorgepedret).