Trong video màn hình này, chúng ta sẽ làm việc trên khu vực "Demos" của CSS-Tricks. Đó là một khu vực khá phổ biến của trang web, mặc dù thực tế là tôi không dành nhiều thời gian cho nó. Điểm đặc biệt của nó là một nơi trên trang web có rất nhiều bản trình diễn có thể tải xuống và có thể xem được, tất cả đều ở cùng một nơi - vì vậy, rất dễ dàng để cuộn và duyệt qua cũng như tìm các bit có thể bạn và các dự án của bạn quan tâm.
Về cấu trúc, nó rất giống với khu vực video. Mỗi bản trình diễn có một tiêu đề và mô tả ngắn và một vài nút, giống như mỗi video. Vì vậy, chúng tôi sẽ lập mô hình bố cục giống như chúng tôi đã làm với khu vực video. Tuy nhiên, không giống như khu vực video, chúng tôi không thể xóa HTML thủ công và thay thế nó bằng một vòng lặp WordPress. Đó là bởi vì mỗi bản demo không nằm trong WordPress, chúng độc lập. Tuy nhiên, điều đó không sao cả, chúng tôi không sợ một chút đánh dấu. Chúng tôi sẽ chỉ viết lại một chút để làm cho nó hoàn hảo nhất có thể.
Bây giờ chúng tôi có tất cả các bit tại chỗ khi chúng tôi cần. Chúng tôi kiểm soát việc đánh dấu. Chúng tôi kiểm soát CSS chỉ cho khu vực cụ thể này. Chỉ cần mày mò một vài điều đó và phần nội dung chính của khu vực này là xong.
Ở phần cuối, chúng tôi xem xét các trang demo riêng lẻ và xem cách thương hiệu của CSS-Tricks cũng áp dụng cho các trang đó.