2012-04-28 22 views
56

Tôi đã tự hỏi làm thế nào những người khác đang tổ chức tài sản của họ cho từng bài đăng khi sử dụng Jekyll. Ví dụ, nếu một bài viết có một hình ảnh, bạn chỉ cần đổ nó vào một thư mục hình ảnh được chia sẻ? Tôi không thực sự thích ý tưởng làm điều này - nó có nghĩa là một hình ảnh hoàn toàn tách rời khỏi một bài viết, khi tôi nghĩ rằng họ nên được ghép nối.Nội dung bài đăng địa phương với Jekyll

Trả lời

21

Tôi thích nghĩ về hình ảnh hơn là các nội dung độc lập được bao gồm trong không hoặc nhiều trang. Hầu hết thời gian, hình ảnh của tôi hiển thị trong một trang duy nhất. Có những lúc tôi muốn có chúng trong nhiều trang và trong các trường hợp khác, tôi không liên kết một hình ảnh nào cả. Nếu quy trình làm việc của bạn là đặt từng hình ảnh vào một thư mục với một bài đăng, việc tìm kiếm chúng bắt đầu yêu cầu một lượng đáng kể tìm kiếm và bạn phải tìm ra một thứ gì đó khác với hình ảnh không thuộc về một bài đăng cụ thể.

Cách tiếp cận tôi sử dụng nằm ở phía đối diện của quang phổ. Tôi có một thư mục hình ảnh (phục vụ từ "/ hình ảnh") và 100% hình ảnh của tôi được đặt ở đó. Lợi ích của việc này là:

  1. Khi tôi thêm hình ảnh vào bài đăng, thật dễ dàng để biết nên sử dụng đường dẫn nào. Nó luôn:

    /images/{image-name} 
    

    Ví dụ: http://alanwsmith.com/i/aws-20111017--0906-02. Điều này làm cho nó có thể viết một plug-in vì vậy tất cả các bạn phải nhập là tên hình ảnh và phần còn lại của con đường đã biết được điền tự động.

  2. Với ứng dụng như Photo Mechanic, thật dễ dàng để duyệt thư mục đơn cục bộ và xem mọi hình ảnh. Nếu tôi muốn bao gồm một hình ảnh trên một trang khác, điều này làm giảm đáng kể thời gian để tìm thấy nó.

  3. Không có vị trí/quy trình riêng nếu tôi muốn gửi hình ảnh cho ai đó mà không thực sự đưa hình ảnh vào một trang (tức là gửi cho họ liên kết trực tiếp tới tệp hình ảnh). Tôi chỉ cần ném hình ảnh trong thư mục chuẩn và gửi liên kết trực tiếp.

Nếu bạn muốn nâng cao hơn một chút, hãy giữ tất cả hình ảnh trong một thư mục duy nhất cũng có thể thực hiện một số chỉnh sửa tốt đẹp. Ví dụ: mặc dù URL cho hình ảnh của tôi bắt đầu bằng "/ hình ảnh", những hình ảnh này thực sự được lưu trữ trong một thư mục nằm ngoài những jekyll sử dụng. Trong trường hợp của tôi, phần trên cùng của cây nguồn của tôi trông giống như sau:

./html 
./source-files 
./image-files 

Tất cả hình ảnh của tôi được lưu trữ trong thư mục "./image-files". Trong cấu hình apache của tôi, tôi đã thiết lập một bí danh sao cho URL "/ images" trỏ tới thư mục "./image-files". Ví dụ:

Alias /images /webroot/image-files 

Khi tôi chạy Jekyll, nó xử lý tất cả mọi thứ trong "./source-files" và giọt nó trong "./html". Bởi vì tất cả các hình ảnh bên ngoài hai thư mục đó, jekyll không bao giờ nhìn thấy/chạm vào chúng. Khi thư viện hình ảnh của bạn phát triển điều này sẽ giúp tăng tốc độ mọi thứ và sẽ ngăn chặn một số lượng lớn các tệp sao chép không cần thiết.

Một tinh chỉnh tôi thích trong Apache được bật:

Options +MultiViews 

này cho phép bạn gọi hình ảnh của bạn mà không cần phải sử dụng phần mở rộng tập tin (ví dụ như không '.jpg', 'png', vv .. .). Bạn có thể thấy điều đó trong liên kết ví dụ tôi đã cung cấp ở trên. Nó không thực sự quan trọng cho hiệu suất. Tôi giống như cách nó trông và nó tiết kiệm cho tôi từ việc phải gõ phần mở rộng mỗi khi tôi gọi một hình ảnh.

MultiViews cũng có thể thay thế hình ảnh của một định dạng này sang định dạng khác mà không phải mã hóa lại bất kỳ thứ gì khác. Ví dụ: nếu bạn xóa "some-image.gif" và thay thế bằng "some-image.png", bạn sẽ không phải chạm vào bất kỳ HTML nào. Nó vẫn sẽ được phục vụ dưới dạng "/ images/some-image". Cần phải thực hiện những thay đổi như thế có lẽ là cực kỳ hiếm. Tôi chỉ nghĩ rằng đó là một điều thú vị để có thể làm được.

Cuối cùng, bạn có thể đưa ra quyết định duy nhất về việc cho phép hoặc không cho phép thư mục hình ảnh của bạn được duyệt. Cá nhân, tôi chỉ muốn hình ảnh của tôi hiển thị nơi tôi đặt chúng. Vì vậy, tôi đã thiết lập các tập tin .htaccess trong thư mục hình ảnh của tôi để:

Options -Indexes 

Nếu bạn đang đi để được làm việc trên một trang web với hàng ngàn hoặc hàng chục ngàn trang và hình ảnh, điều này có thể không quy mô. Đối với một trang web cá nhân có kích thước bình thường, tôi thấy rằng phương pháp này giúp việc duy trì hình ảnh dễ dàng hơn.

+0

tại sao điều này là câu trả lời được chấp nhận? điều này không cung cấp hướng dẫn kỹ thuật về cách đồng định vị. Tôi đồng ý với trường hợp sử dụng cho câu trả lời này, nhưng cũng có những hình ảnh mà tôi không có ý định chia sẻ chung bên ngoài một bài đăng trên blog — và trong những trường hợp đó, tôi không muốn xáo trộn thư mục hình ảnh của mình với họ. – ianstarz

+1

@ianstarz - Tôi chỉ đơn giản là trả lời phần đầu tiên của câu hỏi hỏi cách mọi người xử lý hình ảnh. Trong khi người hỏi câu hỏi ban đầu nói rằng họ không thích ý tưởng đưa hình ảnh vào một thư mục duy nhất, họ dường như đã thay đổi ý định của họ. Tôi đã tìm thấy sự tách biệt các mối quan tâm bằng cách duy trì hình ảnh trong cây thư mục riêng của họ (ví dụ: bạn cũng có thể có các thư mục con) và biết rằng chỉ có một hình ảnh địa điểm được lưu trữ là hữu ích. Nhưng đó là tất cả các sở thích cá nhân và các tùy chọn như https://stackoverflow.com/a/19635916/102401 câu trả lời của SamRayner là hoàn toàn hợp pháp. –

0

Đối với JavaScript và CSS, bạn có thể muốn xem xét đường dẫn nội dung. Bạn có thể cải thiện hiệu suất tốt thông qua tính năng nén và nén. Tôi cũng sử dụng CoffeeScript và Sass, vì vậy tôi cần một bộ tiền xử lý để chuyển đổi tài sản của mình. Tôi sử dụng Jekyll Asset Pipeline để quản lý toàn bộ quá trình này tự động khi tôi chạy lệnh jekyll.

Đối với hình ảnh/video, tôi khuyên bạn nên xây dựng quy ước đặt tên thư mục trong dự án của bạn. Tôi thường có một "tài sản" thư mục sau đó thư mục con với ngày của mỗi bài giữ hình ảnh liên quan đến những bài viết. Nếu bạn có nhiều bài đăng mỗi ngày, bạn có thể xem xét bao gồm tên bài đăng.

21

tôi đã viết một plugin để cho tôi tổ chức tài sản trong các thư mục con một cách dễ dàng:
https://github.com/samrayner/jekyll-asset-path-plugin

{% asset_path my-image.png %} 

trong bài 2013-01-01-sau danh hiệu sẽ ra:

/assets/posts/post-title/my-image.png 

trong trang trang đầu tiên của tôi sẽ xuất:

/assets/my-first-page/my-image.png 
6

Cũng giống như bạn, tôi thực sự ghét có tất cả các hình ảnh trong một thư mục được chia sẻ duy nhất.

Hầu hết, nếu không phải tất cả, các hình ảnh của tôi là hữu ích trong một bài duy nhất, và giữ cho chúng cùng với các tập tin Markdown là thực sự tốt hơn cho bài viết quản lý:

  • tôi có thể thả một bài mới là một tiểu đơn -folder của /_posts/ trong một bước, mà không cần phải đặt Đánh dấu tại một nơi và (các) hình ảnh tại một số khác
  • Khi tôi muốn chỉnh sửa (các) hình ảnh của bài đăng hiện có, tôi không phải tìm hình ảnh bên phải trong một thư mục lớn /assets/, nó nằm ngay gần tệp Markdown
  • Trong Markdown của tôi, tôi có thể sử dụng t ông tên tập tin hình ảnh trực tiếp, mà không cần bất kỳ đường dẫn
  • Nếu tôi muốn sử dụng bất kỳ trình soạn Markdown với xem trước trực tiếp, nó hoạt động, không cần một cấu hình thư mục nội dung cụ thể

Tôi cố gắng để có điều này cho blog của tôi (example post here).

Đối với hình ảnh phản hồi, tôi đã sử dụng số Jekyll Picture Tag plugin, nhưng tôi đã phải chia nó, vì the Pull Request để xử lý các đường dẫn như vậy không được chấp nhận.

Bây giờ Jekyll 3 đã có, tôi ước nó có thể cho phép chúng tôi sử dụng hình ảnh cả trong thư mục bài VÀ trong /assets/ một, tìm kiếm một hình ảnh được đánh dấu bằng ![alt](image-file-without-path.jpg) ở cả hai, theo thứ tự đó.

Các vấn đề liên quan