Có những thời điểm nhất định trong cuộc sống khi bạn cần một trang web để làm điều gì đó hơn là chỉ ngồi đó xem một trang web. Bạn cần nó để kiếm tiền. Một cách để làm điều đó là áp dụng nó cho phù hợp với bạn, nhờ đó bạn sẽ không phải viết mã mỗi lần cập nhật hoặc sửa đổi trang. Cách dễ nhất để học cách làm một việc như thế này là thực sự làm nó, vì vậy trong phần còn lại của bài viết này, tôi sẽ chỉ cho bạn một cách triển khai một hệ thống sẽ xây dựng các trang web mới cho bạn chỉ bằng cách chạm vào một nut bâm.
Trong trường hợp này, chúng tôi giả sử khách hàng của bạn là một nhà hàng muốn cung cấp phiếu thưởng cho các dịp đặc biệt khác nhau trong suốt cả năm. Nhưng tất nhiên là họ không muốn trả tiền cho bạn để cập nhật nó cho họ, vì vậy tốt hơn hết bạn nên đảm bảo tính phí đầy đủ cho hệ thống tự động hóa này sẽ thực hiện cập nhật cho họ
1. Đầu tiên chúng ta cần tạo một mẫu trang web cơ bản.
Đây chỉ là một bộ xương trang web tiêu chuẩn. Bạn có thể đặt cho nó một cái tên như “pageBuilder.php” hoặc cái gì đó. Bạn không cần phải sử dụng PHP cho việc này. Bạn có thể sử dụng ngôn ngữ lập trình khác, nhưng với ví dụ này, chúng tôi sẽ giữ mọi thứ đơn giản và thực hiện tất cả bằng PHP.
2. Thêm Bootstrap
Điều này sẽ giúp làm cho biểu mẫu trông đẹp hơn mà không cần phải làm gì thêm. Tất nhiên bạn sẽ cần có Bootstrap để làm việc này.
3. Thiết lập vùng chứa
Để giúp giữ mọi thứ gọn gàng và ngăn nắp, chúng ta nên xác định một vùng chứa mà chúng ta sẽ lưu trữ nội dung trang vào đó.
4. Tạo biểu mẫu web
Xác định biểu mẫu web và chúng tôi cũng sẽ thêm tiêu đề ưa thích vào biểu mẫu, đây là tùy chọn nhưng là một ý tưởng hay.
5. Thêm các trường biểu mẫu
Điều này thực sự đơn giản. Chúng ta chỉ cần thu thập một vài chi tiết cơ bản mà robot sẽ sử dụng để tạo một trang web mới. Dữ liệu chúng ta cần biết bao gồm:
- Hình nền cho trang
- Tên sự kiện được tổ chức
- Headline
- Phát biểu khai mạc
- Một số trích dẫn sáo rỗng hoặc tuyên bố bổ sung
- Ghi công cho trích dẫn sáo rỗng
- Kiểu phông chữ sử dụng cho mỗi phần tử văn bản đóng khung (riêng lẻ).
- Phạm vi ngày mà các chứng từ sẽ có hiệu lực
- Ưu đãi 1 và Ưu đãi 2 sẽ được quảng cáo trên phiếu thưởng.
- Thông báo chứng từ bổ sung (ví dụ: điều khoản và điều kiện)
- Dữ liệu về mã QR chứng từ sẽ được tạo
Đây là giao diện của nó:
Và sau tất cả nỗ lực này, chúng ta sẽ có được một trang trông giống như thế này:
Tin tốt là đến nay công việc đã hoàn thành được một nửa và đó là nửa khó khăn và tốn thời gian nhất. Phần còn lại dễ dàng hơn nhiều.
6. Tạo file xử lý biểu mẫu
Sau khi tạo biểu mẫu, bạn cần một số phần mềm sẽ xử lý dữ liệu đã gửi và thực hiện điều gì đó với nó. Trong trường hợp này, chúng tôi sẽ sử dụng dữ liệu đã gửi để tạo một dữ liệu mới HTML .
Bây giờ, hãy nhớ rằng đây không giống với phản hồi PHP thông thường trong đó dữ liệu được sử dụng trong thời gian thực và được phản ánh động tới người dùng. Thay vào đó, chúng tôi đang tạo một trang tĩnh sẽ tồn tại vĩnh viễn cho đến khi chúng tôi ghi đè lên nó.
Tệp cần phải được đặt tên giống với tên hoạt động giá trị thuộc tính trong phần khai báo biểu mẫu, vì vậy trong ví dụ của chúng tôi, giá trị đó sẽ là voucherGen.phpvà vì chúng tôi không chỉ định đường dẫn nên nó cần được lưu trữ ở cùng vị trí với trangBuilder.php để nó hoạt động.
7. Khởi tạo biến
Dữ liệu được gửi từ trangBuilder.php được trả về dưới dạng một mảng kết hợp có tên $ _ POSTvà tất cả các giá trị dữ liệu trong mảng có thể được truy cập thông qua điều khiển biểu mẫu HTML của chúng tên thuộc tính. Do đó, việc khởi tạo các biến của chúng tôi thực sự khá dễ dàng. Nó cũng là tùy chọn, nhưng nó chỉ làm cho mã trông gọn gàng hơn và dễ đọc hơn một chút. Bạn chắc chắn có thể làm việc trực tiếp với $ _ POST giá trị nếu bạn thích.
8. Sử dụng điều kiện để thay đổi phông chữ về giá trị chính xác
Làm điều này sớm sẽ tiết kiệm thời gian và rắc rối sau này. Chúng tôi chỉ kiểm tra giá trị nào đã được chọn và sau đó thay thế chúng bằng tên phông chữ thực tế.
9. Bắt đầu xây dựng chuỗi trình tạo
Thực sự tất cả những gì chúng ta cần làm ở đây là tạo một chuỗi thực sự dài chứa mọi thứ cần thiết để tạo trang mới. Chúng tôi sẽ sử dụng nối chuỗi để giữ cho nó dễ đọc và giúp dễ dàng xem các giá trị dữ liệu đã được chèn vào đâu. Việc này bắt đầu với việc thiết lập trang HTML cơ bản:
Có lẽ bạn có thể thấy chúng ta sẽ đi đâu với điều này. Lưu ý dấu chấm phẩy ở cuối. Đó là quan trọng. Ngoài ra, bất kỳ dấu chấm phẩy nào xuất hiện trong văn bản (như một phần của khai báo CSS hoặc tập lệnh phía máy khách) đều phải được chứa bên trong dấu ngoặc kép.
10. Bắt đầu thêm nội dung trang vào chuỗi trình tạo
Có nhiều cách hiệu quả hơn để xây dựng chuỗi này, nhưng tôi thích làm mã gọn gàng để dễ đọc. Bạn có thể sử dụng các phương pháp viết tay để thực hiện việc này và bạn cũng không cần phải thực hiện nó như một quy trình riêng biệt cho bước 9. Tôi cảm thấy sẽ dễ hiểu hơn khi các phần khác nhau của trang được chia theo cách này.
11. Viết chuỗi trình tạo thành HTML
Trong trường hợp này, chúng tôi đang mã hóa cứng tên tệp, nhưng bạn có thể (và có lẽ nên) đặt trường này thành một trường trong biểu mẫu pageBuilder của mình.
12. Thêm liên kết kiểm tra
Khi bạn nhấp vào nút BUILD IT, vì nó không chuyển hướng đến một trang web như chương trình PHP thông thường, nên bạn cần thêm một liên kết hoặc thứ gì đó để xem kết quả là gì.
13. Tạo tệp CSS tùy chỉnh
Bạn có thể lưu trữ các hướng dẫn tạo kiểu bổ sung trong tệp này, nhưng bây giờ điều quan trọng duy nhất là hướng dẫn tạo kiểu cho chính div.
14. Tạo và tải lên Wrap.png
Để tính năng này hoạt động bình thường, bạn cần tạo một hình ảnh pixel mờ duy nhất và đặt tên cho nó bọc.png sau đó tải nó lên đường dẫn bạn đã chỉ định trong tùy chỉnh.css tập tin.
15. Tải lên một số hình nền phù hợp và kiểm tra pageBuilder của bạn
Bạn sẽ rất vui mừng khi biết rằng chúng tôi gần như đã hoàn tất và thực sự giờ đây chỉ còn là vấn đề kiểm tra và sửa bất kỳ lỗi nào xảy ra. Chọn một số hình ảnh đơn giản đẹp mắt, không quá rối mắt và phù hợp để liên quan đến các sự kiện hoặc dịp đặc biệt (trong ví dụ của chúng tôi, tôi chọn Ngày của Mẹ và Ngày của Cha). Tải hình ảnh lên đường dẫn nơi bạn lưu trữ hình ảnh cho trang web của mình. Sau đó điền vào biểu mẫu, nhấp vào nút và xem điều gì sẽ xảy ra. Đây là ví dụ về biểu mẫu có tất cả các trường dữ liệu được điền vào.
Điều này sẽ dẫn đến việc tạo ra một cái gì đó khá giống với điều này:
Chúng tôi đã đoán rằng bạn sẽ không muốn nhập tất cả những thứ đó từ đầu, vì vậy bạn có thể tải xuống mã nguồn cho pageBuilder.php và voucherGen.php trong phần này zip.
Bạn có thể áp dụng kỹ thuật tạo tệp HTML này dưới dạng chuỗi và sau đó ghi chúng ra tệp trong mọi tình huống. Chỉ cần cẩn thận đừng bao giờ đặt những thứ như thế này vào vòng lặp đệ quy, nếu không bạn sẽ làm đầy ổ cứng và làm hỏng máy chủ.
Très très instructif, j'ai tiểu luận et ça Marche à merveille, milles merci
Không có gì! 👍👍👍