Thêm css tùy chỉnh vào Jekyll

Aug 24 2020

Tôi mới sử dụng Jekyll và tôi đang tạo một trang web với html và css tùy chỉnh theo thứ tự. Jekyll tải xuống chủ đề minima theo mặc định, vì vậy tôi đã ghi đè trang chủ bằng html sau:

<!DOCTYPE html>
<html>

<head>
    <title>testsite</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

<body>

    all my html

    <script>
           $.ajax(an ajax call);        
    </script>

</body>
</html>

Tôi đang tìm cách thêm một biểu định kiểu tùy chỉnh, nhưng tôi đang gặp sự cố khi liên kết chính xác với bên trong chủ đề. Tôi đã kiểm tra trực tuyến nhưng nhiều diễn đàn dường như không chính xác về cấu trúc thư mục.

Đây là cấu trúc hiện tại.

--layouts
  -home.html
--posts
--site
  --assets
    -main.css
    -main.css.map
  --jekyll
    --update
  --privacy
  -index.html
--jekyll-cache
-config.yml
-Gemfile
-Gemfile.lock
-index.markdown

Câu hỏi của tôi là, có cách nào đơn giản để thêm một biểu định kiểu sẽ hoạt động trên tất cả các trang khi hoạt động không? Tôi có thể liên kết một biểu định kiểu theo cách bình thường mà id thực hiện, tuy nhiên điều đó không hoạt động khi được tải lên github. Sẽ tốt hơn nếu bắt đầu từ một bản dựng không có chủ đề? Nếu vậy, làm cách nào để thiết lập gemfile?

Cảm ơn!

Trả lời

1 JoostS Aug 25 2020 at 13:37

Cách tiếp cận đơn giản tuyệt vời. Tôi thích nó. Đây là cách tiến hành:

  1. Xóa Minima khỏi tệp / dự án cấu hình của bạn
  2. Tạo một thư mục _includes
  3. Di chuyển đầu đến header.html trong _includes
  4. Gọi tiêu đề trong tệp home.html (và bất kỳ bố cục nào khác) bằng cách sử dụng {% include header.html%}
  5. Liên kết CSS mới trong tệp header.html

Jekyll không có chủ đề (và plugin) tốt hơn nhiều. Tìm kiếm thêm?https://www.jekyllcodex.org