2008-11-04 65 views
107

Tôi đang tạo ứng dụng của mình bằng cách sử dụng Django và tôi tự hỏi làm thế nào tôi có thể làm cho Django sử dụng tệp CSS của tôi? Tôi cần phải cài đặt những gì để làm cho Django thấy tệp css?Tôi làm cách nào để sử dụng CSS ở Django?

NB: Trên một máy tính cục bộ

Trả lời

48

Nếu bạn đang sử dụng máy chủ phát triển, hãy theo dõi django project's how-to guide for managing static files để thiết lập URL của bạn, sau đó tham chiếu tệp phương tiện trong mẫu - ví dụ: hình ảnh bên trong thư mục hình ảnh từ /site_media/images/foo.gif.

+24

Chỉ cần lưu ý nhanh về các tài liệu Django đó - hãy đảm bảo bạn chọn tài liệu cho phiên bản Django bạn đang sử dụng. Mọi thứ dường như đã thay đổi rất nhiều giữa các phiên bản liên quan đến các tệp tĩnh. –

+3

@Sam có một điểm tuyệt vời. tôi không thể tìm ra các tệp tĩnh cho cuộc đời của tôi. sau đó, thay đổi phiên bản django cài đặt, và thì đấy. đó là nghĩa đen tất cả những gì tôi phải làm vì dường như tôi đang xem tài liệu cho phiên bản sai. –

12

cài đặt gì tôi cần phải làm gì để làm cho Django thấy file css?

Không có.

Đảm bảo mẫu của bạn bao gồm tệp CSS (dưới dạng HTML chuẩn) và đặt tệp CSS trên máy chủ phương tiện.

Để làm rõ: Với Django, bạn nên phục vụ tất cả phương tiện của mình (mọi thứ không phải là html động) từ một phiên bản máy chủ khác. Cách bạn triển khai hoàn toàn tùy thuộc vào bạn nhưng hầu hết mọi người đều tạo tên miền phụ.

+2

Xin chào, Oli. Tôi biết bài đăng này là gần 3 tuổi, nhưng đây vẫn là cách tốt nhất để liên kết css để django mẫu? Điều này có vẻ như nó sẽ là dễ nhất chỉ liên kết css với một URL abs như static.example.com và chỉ lưu trữ tất cả các tệp tĩnh tại url đó. – cp3

36

Thông thường, bạn đang hỏi cách phân phát tệp tĩnh từ Django. Nếu bạn đang chạy dưới Apache, bạn nên đọc http://docs.djangoproject.com/en/dev/howto/deployment/modpython/

Nếu bạn đang chạy máy chủ phát triển (ví dụ, trên máy tính xách tay của bạn), đọc http://docs.djangoproject.com/en/dev/howto/static-files/

Đừng chú ý lớn, chất béo từ chối trách nhiệm liên quan đến máy chủ phát triển Django :

  • Sử dụng máy chủ này không hiệu quả và không an toàn.
  • Không sử dụng tính năng này trong cài đặt sản xuất.
  • Chỉ sử dụng tính năng này để phát triển.
+0

"Không sử dụng tính năng này trong cài đặt sản xuất". Bạn có nhớ mở rộng về điều này? – Chris

+0

@ Chris: Bạn nói đúng, tuyên bố hơi mơ hồ. Tôi đã đề cập đến máy chủ phát triển Django. Mặc dù tôi đã chạy nó một vài lần trên trang web sản xuất của chúng tôi, nó chỉ là trong thời gian ngắn trong khi gỡ lỗi vấn đề gnarly. –

+0

Cảm ơn bạn đã làm rõ, tôi đã nhìn vào triển khai django của tôi chạy trên apache tự hỏi những gì tôi đã làm sai. :) – Chris

0

Vâng cách dễ nhất để sử dụng css với django, là thêm nó vào mẫu của bạn dưới dạng tệp tĩnh.

Nhưng nó hơi giống ajax, tôi không tìm thấy bất kỳ thứ gì cho biết cách đưa nó theo cách tiêu chuẩn.

Có mô-đun css-compressor cho django nếu bạn muốn tối ưu hóa kích thước của nó.

13

Điều này khiến tôi gặp sự cố một lúc (404 lỗi không tìm thấy). Bit thiếu đối với tôi là để chỉnh sửa STATICFILES_DIRS tuple trong settings.py để cho tôi này:

STATICFILES_DIRS = (
    # Put strings here, like "/home/html/static" or "C:/www/django/static". 
    # Always use forward slashes, even on Windows. 
    # Don't forget to use absolute paths, not relative paths. 
    os.path.join(os.path.dirname(__file__),'media').replace('\\','/'), 
) 

này sau đó nhặt file CSS của tôi trong một thư mục có tên 'phương tiện truyền thông' đó là ở cấp cao nhất của django của tôi dự án.

Tôi cũng đã có:

MEDIA_ROOT = '' 
MEDIA_URL = '' 
STATIC_ROOT = '' 
STATIC_URL = '/media/' 

(chắc chắn rằng bạn đã dẫn đầu / trên trong STATIC_URL)

Tất nhiên, như đã nói ở trên, bạn cần phải có các tập tin CSS đúng cách bao gồm từ html của bạn các tập tin. Tôi đã có:

<link href="{{ STATIC_URL }}css/ea_base.css" rel="stylesheet" type="text/css" media="screen" /> 
+0

Cuối cùng, một giải pháp rõ ràng, đơn giản và thanh lịch. Hoạt động tốt với django 1.5. –

+0

# Luôn sử dụng dấu gạch chéo về phía trước, ngay cả trên Windows. '.replace ('\\', '/')' là không cần thiết. – mak

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