Django Medien URLs in CSS-Dateien

StackOverflow https://stackoverflow.com/questions/1023888

  •  06-07-2019
  •  | 
  •  

Frage

In django Vorlagen, ist es üblich, die Folgendes zu tun: 

<img src="{{ MEDIA_URL }}/img/someImage.jpg">

Wie würden Sie dies in einer CSS-Datei auszuführen, die nicht als Vorlage gedient wird? 

.someClass {
    /* can't do this this */
    background: url("{{ MEDIA_URL }}/img/someImage.jpg");        
    /* either this */
    background: url("http://media.domain.com/img/someImage.jpg");
    /* or this */
    background: url("/django_static_media/img/someImage.jpg");
    /* can't do both... what to do? */
}

Ich brauche die Fähigkeit, meine Dateien entweder aus den Medien Sub-Domain zu dienen, oder während der Offline-Arbeit und dienen sie direkt als django statische Sicht. Aber CSS-Dateien sind ein Problem, da sie nicht als Vorlagen verarbeitet werden, und ich kann nicht die MEDIA_URL Kontextvariable verwendet werden.

Was ist die Lösung?

Edit:. Ich sollte anmerken, dass das Problem entsteht, da meine statische Mediendateien in der Tat auf einer separaten Medienunterdomäne befinden, somit die Verwendung von relativen Pfaden zu negieren Haben sie es, dank!

War es hilfreich?

Lösung

Wo ist Ihre CSS-Datei serviert aus? Dieser ist in der Regel kein Problem, da eine gemeinsame Medienstruktur wie zum Beispiel: 

media/
    images/
    css/
    js/

(oder ähnlich) ermöglicht relative Dateipfade für Bilder, zum Beispiel: 

background: url('../images/foo.png');

Wenn Sie nicht bereit sind, Ihre Medienordnerstruktur zu ändern relative Dateipfade gerecht zu werden, können Sie keine andere Wahl haben, aber CSS-Deklarationen aus der Vorlage zu überschreiben, eine sekundäre CSS-Datei zu verwenden, wenn offline: 

{% if DEBUG %}
    <link rel="stylesheet" href="{{ MEDIA_URL }}css/offline-mode.css" />
{% endif %}

Natürlich ist die erste Option ist viel aufgeräumter.

Andere Tipps

Sorry, Sie werden nicht wie die Antwort.

Ich habe das gleiche Problem bekommen:

Es gibt keine einfache Möglichkeit, dies mit statischen-served CSS-Dateien zu tun.

Was ich mache:

  • Debug-Server, lokal arbeiten, Medien bedient lokal
  • Produktions-Server irgendwo gehostet aus kommerziellem w / Medien auf Amazon S3
  • settings.py Datei auto MEDIA_URL (DEBUG, etc.) setzt über den Hostnamen Scheck
    • (Herstellung vs. lokalen / home / debug zu unterscheiden)
  • HTML-Dateien haben alle CSS-Links mit {{MEDIA_URL}} (+ Request Kontexte für Ansichten)
  • Ich mag absolute Pfadnamen, so dass eine „update_s3“ Skript: (1) Abspaltungen jede CSS-Datei vorübergehend zu beheben 'Url ( "/ media' auf 'url (" s3.mydomain.com/media' und (2) Updates / uploads mein Verzeichnis / media zu Amazon S3

ich dann in Produktion gehen und ein svn update tun und die WSGI Datei berühren und validieren

Wird mit relativen Pfaden (für Image-Dateien) in Ihrer CSS-Dateien keine praktikable Option für Sie?

Wenn Sie Template-Richtlinien in einer Datei verwenden möchten, warum ist es nicht über eine Vorlage diente?

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top