Mẫu đặt hàng HTML, CSS

Nhấp vào các tab trên bản demo để xem các kiểu biểu mẫu đặt hàng khác nhau. Đây là các biểu mẫu mẫu, bạn có thể chọn các trường của riêng mình

Tải xuống mã nguồn đầy đủ cho mẫu đơn đặt hàng chuyên nghiệp

Đặc trưng

  • Trình cài đặt đơn giản, không cần mã hóa
  • Nộp hồ sơ gửi qua email
  • Hoàn toàn đáp ứng cho các trình duyệt di động
  • Bảo mật bằng SSL/TLS (nếu được bật)
  • Hỗ trợ email SMTP
  • Bảo vệ chống thư rác reCAPTCHA v3
  • Tuân thủ GDPR
  • Nhiều phong cách để lựa chọn
  • Tùy chọn email trả lời tự động
  • Dễ dàng thêm bớt các trường
  • Không nhãn hiệu, nhãn trắng
  • Lưu trữ trên trang web của riêng bạn
  • Mã nguồn đầy đủ (HTML, JS, CSS và PHP)

Chọn lĩnh vực của riêng bạn

Chủ sở hữu giấy phép cũng sẽ nhận được quyền truy cập vào ứng dụng Trình tạo biểu mẫu. Điều này cho phép bạn dễ dàng tạo các biểu mẫu tùy chỉnh

Đảm bảo hoàn tiền trong 90 ngày

Điều khoản và điều kiện hoàn tiền được áp dụng

Mẫu đơn đặt hàng phiên bản pro được tạo để cài đặt và chạy trên trang web của bạn, cho phép khách truy cập của bạn gửi tin nhắn trực tiếp đến địa chỉ email bạn đã chọn. Nó đi kèm với sự hỗ trợ để giúp ngăn chặn thư rác và lạm dụng từ bot cũng như phần mềm độc hại khác và có thể được cài đặt và chạy chỉ trong vài phút

Chúng tôi có rất nhiều mẫu đơn đặt hàng khác có sẵn trong thư viện của chúng tôi (bạn sẽ nhận được tất cả các mẫu này cùng với giấy phép của mình)

Yêu cầu

Miễn là bạn có ý định lưu trữ các biểu mẫu trên Máy chủ Web với PHP V5. 5 trở lên, các biểu mẫu sẽ chạy hoàn hảo. Đọc thêm về các yêu cầu ở đây

Trình cài đặt mạnh mẽ

Bản tải xuống đi kèm với trình cài đặt biểu mẫu đơn giản nhưng mạnh mẽ yêu cầu bạn cung cấp cài đặt cấu hình, chẳng hạn. chọn kiểu, địa chỉ email và dòng chủ đề, chi tiết SMTP và khóa reCAPTCHA. Sau khi bạn cung cấp các thông tin chi tiết này và cài đặt biểu mẫu, biểu mẫu sẽ sẵn sàng để sử dụng

bảo vệ reCAPTCHA

Bạn có tùy chọn kích hoạt tích hợp chống thư rác của chúng tôi với Google reCAPTCHA để bảo vệ mẫu đơn đặt hàng của bạn khỏi nhiều hình thức lạm dụng bao gồm thư rác tự động. Tìm hiểu thêm về cách thiết lập tài khoản Google reCAPTCHA

Đáp ứng đầy đủ

Nếu bạn muốn biểu mẫu đặt hàng của mình hoạt động tốt trên thiết bị di động (điện thoại và máy tính bảng) cũng như máy tính để bàn, biểu mẫu sẽ thực hiện điều đó ngay lập tức. Nó sẽ thay đổi kích thước độc đáo để hoạt động tốt nhất trên trình duyệt của khách truy cập

tùy chỉnh email

Bạn có toàn quyền kiểm soát để tạo kiểu email theo ý muốn. Biểu mẫu đi kèm với các mẫu email dựa trên HTML và TEXT tiêu chuẩn, bạn có thể chỉnh sửa các mẫu này để đáp ứng nhu cầu của mình

Xác thực biểu mẫu

Khi khách truy cập của bạn sử dụng biểu mẫu của bạn, trình xác thực biểu mẫu sẽ kiểm tra các trường đã được hoàn thành chính xác chưa. Theo mặc định, nó sẽ đảm bảo người dùng nhập từ 2 đến 60 ký tự vào trường tên, cung cấp địa chỉ email hợp lệ, chọn chủ đề từ trình đơn thả xuống (bạn có thể thay đổi các tùy chọn này) và nhập từ 2 đến 3000 ký tự vào trường . Việc xác thực này được thực hiện trong thời gian thực bằng JavaScript trong trình duyệt (được kích hoạt lần đầu khi nhấp vào nút) và cũng được kiểm tra lại trên Máy chủ bằng PHP

Mở rộng biểu mẫu

Kể từ khi giới thiệu Trình tạo biểu mẫu, việc thay đổi trở nên đơn giản

Không có thương hiệu

biểu mẫu đặt hàng chuyên nghiệp sẽ không hiển thị bất kỳ nhãn hiệu MajesticForm nào trên biểu mẫu hoặc các email mà nó tạo ra

Hãy tạo một bố cục bảng HTML tùy chỉnh sẽ sử dụng các trình giữ chỗ trường để định vị các trường dữ liệu

Dưới đây là phiên bản mới, dài hơn của mẫu. Phần tử style xác định các quy tắc CSS. Nhãn trường và. RightAlignedInputs. Một số phần tử div và bảng sắp xếp các tham chiếu trường được bao quanh bởi dấu ngoặc nhọn thành một bố cục phức tạp

Mẫu cho ~/Controls/OrderFormTemplate. ascx

<%@ Control AutoEventWireup="true" %>

Customer:

{CustomerID}

Employee:

{EmployeeID}

Order Date:

{OrderDate}

Required Date:

{RequiredDate}

Shipped Date:

{ShippedDate}

Address:

{ShipAddress}

City:

{ShipCity}

Region:

{ShipRegion}

Postal Code:

{ShipPostalCode}

Ship Country:

{ShipCountry}

{view2Extender} Ship Name:

{ShipName}

Ship Via:

{ShipVia}

Subtotal:

{Subtotal}

Freight:

{Freight}

Total:

{Total}

Nếu bạn loại bỏ màn hình. none thuộc tính từ div chính và nhấp vào nút Thiết kế ở góc dưới bên trái của Visual Studio, bạn sẽ thấy hình ảnh đại diện của mẫu. Bạn có thể thấy rằng có một nhãn văn bản bên cạnh mỗi trình giữ chỗ trường. Các công cụ trực quan có thể được sử dụng để sắp xếp lại các trường theo thứ tự ưu tiên của bạn

Một yếu tố quan trọng là {view2Extender}, nằm ở trung tâm của bố cục. Trình giữ chỗ này đề cập đến chế độ xem dữ liệu có ID là “view2”, hiển thị Chi tiết đơn hàng

Lưu tệp mẫu và làm mới ứng dụng web. Chọn một đơn đặt hàng, và bạn sẽ thấy bố cục mới

Các trường Khách hàng, Nhân viên và Ngày được trình bày ở phía bên trái. Thông tin vận chuyển được hiển thị ở phía bên phải

Lưới chi tiết đơn hàng được tự động chèn vào hàng tiếp theo của mẫu

Ship Name và Ship Via được hiển thị ở dưới cùng bên trái

Tổng phụ, Phí vận chuyển và Tổng cộng nằm ở dưới cùng bên phải, bên dưới hàng Giá mở rộng của Chi tiết đơn hàng

Nếu bạn chỉnh sửa bản ghi, bạn có thể thấy rằng các trường đang sử dụng độ dài đã chỉ định trước đó. Nếu bạn sử dụng mũi tên lên và xuống để di chuyển qua Đơn hàng, bạn có thể thấy bản ghi đơn hàng và chi tiết đơn hàng thay đổi

Nếu bạn có nhiều bản ghi Chi tiết đơn hàng, bạn có thể sắp xếp và lọc bằng các cột. Bạn cũng có thể tìm kiếm các sản phẩm cụ thể với Tìm nhanh. Đối với các tìm kiếm phức tạp hơn, bạn có thể sử dụng thanh tìm kiếm nâng cao. Tổng hợp Tổng trong cột Giá mở rộng dưới cùng hiển thị tổng của các hàng đã lọc, trong khi Tổng phụ sẽ được tính cho tất cả các hàng thuộc Đơn hàng bất kể bộ lọc là gì