# 123: Xây dựng Kho lưu trữ Video, Phần 2 (Điều hướng) - Thủ thuật CSS

Anonim

Chúng tôi vừa hoàn thành một phần thú vị của thiết kế lại này, nơi chúng tôi phải loại bỏ một loạt đánh dấu thô trong trang lưu trữ video và thay thế nó bằng đánh dấu mới, thông minh, sạch sẽ, được tạo tự động. Nhưng chúng tôi còn nhiều việc phải làm trên các trang lưu trữ này. Bởi vì các kho lưu trữ sẽ được tạo tự động thành các nhóm, chúng tôi cần điều hướng (thực sự là phân trang) để đến các nhóm màn hình cũ hơn.

Trước đây, vì chúng tôi viết tất cả các đánh dấu theo cách thủ công, chúng tôi có thể biến phân trang đó thành một phần tĩnh của trang. Tôi không bận tâm về điều đó nói chung, nhưng điều đó đơn giản là không thể nữa. Khi chúng tôi xuất bản một video truyền hình mới ngay bây giờ, nó sẽ đẩy một video truyền hình ra khỏi cuối trang đầu tiên và sang trang thứ hai. Vì vậy, nói một cái gì đó như “# 115 - # 95” trong mã tĩnh sẽ chỉ chính xác trong một khoảng thời gian rất ngắn.

Đầu tiên, chúng tôi tạo kiểu chính xác bằng cách sử dụng một số lớp điều hướng thanh màu đen mà chúng tôi đã sử dụng ở những nơi khác (như trên các trang đoạn trích riêng lẻ).

Sau đó, chúng tôi bắt đầu làm cho việc phân trang thực sự hoạt động. Trong WordPress, bạn có thể thêm vào URL một cái gì đó như “/ page / 2” và nó sẽ vẫn hiển thị cùng một trang mà nó đã hiển thị trước đó, chỉ nó sẽ cấp cho bạn quyền truy cập vào một biến toàn cục có tên là $ paged sẽ được đặt thành “2 ”. Chúng tôi có thể sử dụng số đó trong truy vấn của mình để điều chỉnh video nào chúng tôi đang hiển thị. Nhưng thay vì làm theo cách đó, WordPress có một cách thậm chí còn thông minh hơn để đối phó với nó và đó là thêm 'paged' => $pagedvào truy vấn. Điều đó giải thích cho một số phép toán thú vị xảy ra khi chúng ta cố gắng xử lý phần bù của chính mình.

Chúng tôi điều chỉnh URL trong điều hướng tĩnh để phản ánh các liên kết kiểu phân trang mới này. Vấn đề bây giờ là các con số trong các liên kết không còn chính xác nữa. Trước tiên, chúng tôi thử một cái gì đó đơn giản như "5, 4, 3, 2, 1". Nhưng điều đó cảm thấy hơi khập khiễng và nhàm chán, cũng như khó hiểu vì những con số đó sẽ không khớp với số phân trang thực tế.

Chúng tôi khám phá ra một số thứ tự kỳ lạ của các video có một chút liên quan. Chúng tôi điều chỉnh truy vấn theo cách nó sắp xếp chúng, nhưng vẫn còn một số vấn đề. Cuối cùng, chúng tôi quyết định sẽ phải sắp xếp chúng theo ngày và một số điều chỉnh đối với ngày xuất bản của các video truyền hình màn hình sẽ phải được thực hiện sau khi trang web hoạt động. Gruntwork, nhưng tốt cho lâu dài.

Cuối cùng (tắt video, tôi tin là vậy), chúng tôi kết thúc bằng cách sử dụng phân trang kiểu Hy Lạp (Alpha, Beta, Gamma) hoạt động với tính tùy tiện (giống như cách đặt tên ba gấu tùy ý của chúng tôi cho các truy vấn phương tiện). Như trong, “Zeta” nghe muộn hơn và nó có màu xám đậm hơn, vì vậy phép ẩn dụ cho “cũ hơn” đã hoàn thành.