Tìm theo từ khóa

Css thường dùng, cách tùy biến contact form 7



Contact Form 7 là một plugin rất tuyệt vời, hàng Nhật chất lượng cao mà từ khi dùng nó mình không có ý định thay thế bằng bất kỳ plugin nào khác. Cùng xem các tùy biến contact form 7 mà mình thường dùng cho contact form 7 nhé!

Css thường dùng cho Contact Form 7

Một số form thường dùng

Contact form 7 với placeholder text (dòng text hướng dẫn)

Kết quả




    Vertical contact form 7

    Kết quả


      Horizontal contact form 7

      Kết quả

        BONUS: Hack giao diện Contact Form 7 với shortcode của Flatsome

        Chúng ta có thể tận dụng các shortcode của Flatsome để tạo các giao diện Form phức tạp hơn, tuy nhiên mặt định Contact Form 7 không cho phép thực hiện các shortcode trong form khai báo.

        Tác giả của contact form (Takayuki Miyoshi) cho biết  để thực hiện các shortcode các bạn cần khai báo như sau:

        Khai báo cho phép Contact Form 7 thực thi sortcode

        Sau đó chúng ta có thể dùng shortcode của flatsome làm các form phức tạp như sau:

        Khai báo Contact Form 7

        Kết quả chúng ta có quả Form hoành tráng như sau

          Contact Form 7 & Flatsome shortcode














          Tùy biến Contact Form 7 chỉ dùng html & css

          Nếu bóc tách các thẻ HTML riêng ra thì chúng ta có thể dùng form html kết hợp với theme Flatsome mà không cần khai báo thực thi shortcode như sau

          Kết hợp với một ít gia vị CSS như sau

          Kết quả


            5/5 - (3 bình chọn)
            5 2 đánh giá
            Đánh giá bài viết
            Theo dõi
            Thông báo của
            guest
            0 Góp ý
            Mới nhất
            Cũ nhất Được bỏ phiếu nhiều nhất
            Phản hồi nội tuyến
            Xem tất cả bình luận
            0
            Rất thích suy nghĩ của bạn, hãy bình luận.x