私のdjango管理サイトにcssスタイルがない理由


85

Django開発バージョンを使用してDjango管理サイトを作成します

しかし、CSSスタイルはありません:

代替テキスト

私に何ができる?

ありがとう


2
ロードされない参照されたスタイルはありますか?
ペッカ2010

1
静的ファイルを提供するように開発
Adam Vandenberg

1
@Pekka、はい、これはdjangoのデフォルトスタイルです。D:\ Python25 \ Lib \ site-packages \ django \ contrib \ admin \ media
zjm1126 2010

1
管理者の静的コンテンツが表示されないという同じ問題がありましたが、(開発環境ではなく)nginxを使用していました。基本的に、nginx構成ファイルをチェックして、それが「collectstatic」の場所であることを確認します。詳細はこちら:serverfault.com/questions/403264/...
ウィル

回答:


14

Djangoはそれ自体では静的ファイルを提供しません。ファイルがどこにあるかを伝える必要があります。

settings.pyADMIN_MEDIA_PREFIXは、 Djangoを正しい場所に向けます。

開発バージョンを使用しているので、静的ファイルのハウツーに関する開発者固有のドキュメントが必要になります。Adamのリンクから1.2バージョンにアクセスできます。


11
良い答えですが、現在は非推奨で、settings.pyにはありません。最新のソリューションについては、以下をお読みください。
RussellStewart 2013年

同じエラーが発生しますが、Flaskでは、cssを静的フォルダー内に配置します。そして、jinj2 2 suntax ie {{url_for( 'static'、filename = 'css / style.css')}}を使用しますが、それでも私のラップトップではこのエラーが発生します。ページを強制的に更新しましたが、まだ問題があります。助けてください
Salman Mushtaq

67

設定後、あなたSTATIC_ROOTSTATIC_URL、あなたが実行する必要があり

python manage.py collectstatic

1
これは1.5.2でも機能します。ファイルやコードを変更または追加する必要はありませんでした
lukik 2013

1
誰かのために多分便利:あなたが使用する必要があり、同じ名前のためにSTATIC_ROOTSTATIC_URL、例:私は組み合わせて「staticfiles」「静」を、使用STATIC_ROOT=os.path.join(BASE_DIR, "staticfiles")"してSTATIC_URL="/static/"。私のアプリは正常に動作しましたが、管理ファイルが見つかりませんでした。したがって、両方を「staticfiles」または「static」に変更します
elano7

17

ADMIN_MEDIA_PREFIX現在は非推奨ですSTATIC_URL。代わりに使用してください。設定STATIC_URL = '/static/'settings.pyにして仕事をする必要があります。試してください:

import os.path  import sys

PROJECT_ROOT = os.path.normpath(os.path.dirname(__file__))

その後:

STATIC_ROOT = os.path.join(PROJECT_ROOT, 'static')
STATIC_URL = '/static/'

Django1.4プレアルファSVN-16920で動作します。


1
これは私にとってもうまくいきません。static/admin内部のフォルダを(手動で)移動static/css/すると、cssファイルにアクセスできることに気付きました。したがって、cssファイルが内部にある場合でもアクセスできるようですstatic/filesが、collectstaticはそれらをそこに配置しません。もちろん、テンプレートがを指し続けているため、フォルダを手動で移動することはできませんstatic/admin
toto_tico 2012年

Django v1.2で作成され、1.3でテストされ、v1.4で再デプロイされた管理インターフェイスを実行しようとしたときに機能しました。Ubuntu 12.04 LTEの実行
Adam Lewis

9

Django Bookチュートリアルに従って、この問題にも遭遇しました。第5章|モデルのインストールで、この本は、デフォルトのINSTALLED_APPSを参照するときに、「これらの文字列の前にハッシュ文字(#)を付けて、6つすべてを一時的にコメントアウトする」と述べています。 http://www.djangobook.com/en/2.0/chapter05.html

次に、第6章で、本は読者にこれらの6行のうち4行のコメントを解除するように指示します-「第5章でこれらの4つのINSTALLED_APPSエントリをコメントアウトしたことに注意してください。今すぐコメントを解除してください。」

ただし、statcifiles行は、CSSを管理ページに復元するために必要なものなので、「django.contrib.staticfiles」のコメントを外します。


上で提案したように、settings.pyファイルの「django.contrib.staticfiles」のコメントを外すことも私にとってはうまくいきました。'django.contrib.staticfiles'は、INSTALLED_APPSの下のsettings.pyファイルにデフォルトで存在する必要があります。あなたの提案をクリスに感謝します。
user2471242 2013年

DjangoBookからもここにあります。その1文字の削除がそれを行います。
pbarill 2013

8

私はこれを修正しようとしている他のいくつかのスレッドを読みました...他のスレッドのようにエイリアスに分類されました。これは、独自のカスタムアプリが静的ファイルを正しく提供していることを前提としています。これは、STATIC_ROOTとSTATIC_URLが適切に設定されていることを示しています。

STATIC_ROOT = ''
STATIC_URL = '/static/'

次に(静的ディレクトリから):

ubuntu@ip-1-2-3-4:/srv/www/mysite.com/app_folder/static$ sudo ln -s /usr/local/lib/python2.7/dist-packages/django/contrib/admin/static/admin/ admin

これが誰かに役立つことを願っています...このトピックにはたくさんのスレッドがあります。:(


これは、チャームのように機能する答えです。ありがとうtaylor.well done
Spikie 2017

3

では/project_name/project_name/settings.py、あなたのセットに必要なSTATIC_URL静的ファイルの場合に使用するURLをあなたのサイトに伝えます。

次にSTATIC_ROOTSTATICFILES_DIRSリストにリストされているディレクトリのいずれとも同じではないファイルシステム上のフォルダに設定します。

いったんSTATICFILES_ROOT設定されている、あなたが実行しますpython manage.py collectstaticプロジェクトディレクトリから。

これにより、すべての管理静的ファイルと、STATICFILES_DIRSリストにリストされている他のフォルダー内のすべてのファイルがコピーされます。基本的に、これによりすべての静的ファイルが1つの場所に配置されるため、サイトを展開するときにそれらをCDNに移動できます。あなたが私のようで、CDNを持っていない場合は、2つのオプションがあります。

  1. あなたのように設定したフォルダに追加STATIC_ROOTするSTATICFILES_DIRSリストを。これにより、djangoのstaticfilesファインダーがすべての静的ファイルを見つけることができます。
  2. 静的ファイルのフォルダー全体をファイルシステム上の別の場所に移動STATICFILES_DIRSし、その新しい場所を含めるように指示します。

私はこの答えでセキュリティについてコメントしません、それは私が小さなプロジェクトのために私のウェブサーバーで開発することができた方法です。より大規模なことをしている場合は、djangoが提案するようにCDNが必要になると思います。

更新:私はちょうどこの問題に遭遇しました、そしてこの方法はあなたが望むと思うことを完全にはしませんでした。実行した後、自分の静的ファイルに使用していたディレクトリにcollectstatic、管理用の静的ファイルをコピーしただけでうまくいきSTATICFILES_ROOTました。それは私にとって問題を解決しました。


3

他の多くの回答が役立つことに加えて、私はまだ注目されていない問題を抱えていました。Django 1.3から1.6にアップグレードした後、静的ファイルディレクトリにdjangoadmin静的ファイルへのシンボリックリンクが壊れていました。

私のsettings.pyは次のように構成されました:

STATICFILES_DIRS = (
    '/var/www/static/my-dev',
)

この答えによると、

Djangoは、URL / admin /の下にadmin静的ファイルを見つけることを期待します。

次のように/var/www/static/my-dev/admin設定されたシンボリックリンクがありました。

admin -> /usr/local/lib/python2.7/dist-packages/django/contrib/admin/media/

その場所はdjango1.6には存在しないため、リンクを次のように更新しました。

admin -> /usr/local/lib/python2.7/dist-packages/django/contrib/admin/static/admin/

そして今、私の管理サイトは正しく機能しています。


2

Apacheサーバーを使用してdjangoサイトをホストしている場合は、静的エイリアスが/ directoryからsite / site_media / static /を指していることを確認する必要があります。静的ファイルが/ directory to site / site / site_media / static /にある場合、以前のApacheエイリアス構成は機能しません。


2

Djangoチュートリアルを実行しているときに、同様の問題が発生しました。私の場合、問題はcssファイルを提供するときに開発サーバーで使用されるmimetypeでした。

提供されたmimetypeは「application / x-css」であり、Chromeで(開発者ツールの「ネットワーク」タブに)次の警告メッセージが表示されました。

リソースはスタイルシートとして解釈されますが、MIMEタイプapplication / x-cssで転送されます: " http://127.0.0.1:8000/static/admin/css/base.css "

私が見つけた回避策:django webappのmanage.pyファイルに次の行を追加して、提供されるmimetypeを変更します。

import mimetypes
mimetypes.init()
mimetypes.types_map['.css'] = 'text/css'

注:Python2.7およびChrome40.0のDjango1.7.4で動作しました


Django 2.2.1でこれを試しましたが、機能しません。私の管理パネルの静的.cssファイルはHTTPコード200のnginxによって提供されていますが、Chromeはそれらがとして入ってくると言っておりContent-Type: text/plain、ページにレンダリングされていません。
user53595 3119年

2

django-1.10.5とpython-2.7.13でサイトを開発しているときに遭遇したのと同じ種類の問題。しかし、私のfirefox-51とchromeでは、ログインページはcssを取得できましたが、それでもスタイリングはありませんでした。しかし、奇妙なことに、IE-8で動作していました。

私はここで言及され、swバージョンのセットに適したすべての可能なことを実行しようとしました。何も機能しませんでした。

しかし、python-2.7.8を搭載した他のシステムで同じサイトを試したところ、機能しました。

それが誰かを助けるかもしれないならちょうど投稿されました...

編集:後で私はpython-2.7.13で、settings.pyに次の2行を書く(そしてブラウザのキャッシュをクリアする)ことでトリックが行われたことを発見しました

import mimetypes
mimetypes.add_type("text/css", ".css", True)


1

それ'django.contrib.staticfiles'INSTALLED_APPSあなたのsettings.pyにあることを確認してください


1

実行: python manage.py collectstatic

/etc/apache2/sites-available/000-default.confにあるVhostにこの行を追加します

エイリアス/ static / admin / /var/www/html/example.com/static/admin

これがdjangoセットアップのVhost設定全体です

<VirtualHost *:80>
        ServerName gautam.tech
        ServerAlias www.gautam.tech

        WSGIDaemonProcess gautam.tech python-path=/var/www/html/gautam.tech python-home=/var/www/html/gautam.tech/venv
        WSGIProcessGroup gautam.tech
        #Your static files location
        Alias /static /var/www/html/gautam.tech/static
        Alias /media/ /var/www/html/gautam.tech/media
        Alias /static/admin/ /var/www/html/gautam.tech/static/admin

        <Directory /var/www/html/gautam.tech/static>
                Require all granted
        </Directory>

        <Directory /var/www/html/gautam.tech/media>
                       Require all granted
        </Directory>

        WSGIScriptAlias / /var/www/html/gautam.tech/myproject/wsgi.py

        DocumentRoot /var/www/html/gautam.tech
        <Directory /var/www/html/gautam.tech>
                <Files wsgi.py>
                        Require all granted
                </Files>
        </Directory>

        CustomLog /var/www/html/gautam.tech/access.log combined
        ErrorLog /var/www/html/gautam.tech/error.log
</VirtualHost>

これは確かに機能します!


とても良い答えです。collectstaticコマンドを実行するだけで済みました。
PowerAktar

0

STATICFILES_DIRSのsettings.pyに値が設定されていて、宣言されたフォルダーが存在しないか、間違った場所にある場合、たとえばSTATICFILES_DIRS =(os.path.join(BASE_DIR、 "static" ))静的フォルダが存在しません


0

何千もの提案を試した後失敗しましたが、私はついに役立つ解決策を見つけました。これが私が試したものと私が使っていたものです。django-1.11とnginxWebサーバーを使用しています。まず、CSS / jsファイルがブラウザのコンソールで404を取得していないことを確認しました。その後、警告が表示されました

リソースはスタイルシートとして解釈されますが、mimeタイプのテキスト/プレーンで転送されます

管理テンプレートでbase.htmlを見つけて、削除しました

type="text/css"

そして今、行は次のようになります:

<link rel="stylesheet"  href="{% block stylesheet %}{% static "admin/css/base.css" %}{% endblock %}" /> 

これで問題が解決しました。


0

問題はdev / test / prodサーバーにあり、Nginxを使用している場合は、以下の手順に従ってください。

  • settings.pyの設定を以下のように設定します

    STATIC_URL = '/static/'
    
    BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
    STATIC_ROOT = os.path.join(BASE_DIR, 'static')
    
  • 以下のコマンドを実行して、静的フォルダーにcssファイルとjsファイルを作成します

    $ python manage.py collectstatic
    
  • 静的ファイルを提供するための/ etc / nginx / sites-enabled / example(Nginx)の構成

    location /static/ {
            alias /project/root/folder/static/;
    }
    

0

これは問題なく簡単に機能します。フォルダを(手動で)移動しました。ターミナルで次のコマンドを実行する必要がある静的フォルダーがない場合static/adminは、メインプロジェクトのディレクトリからコピーしてpublic_htmlに 貼り付ける static/だけです。

python manage.py collectstatic

ここでは、Django管理者のCSS作業を行います


0

静的ファイルの構成 それdjango.contrib.staticfilesINSTALLED_APPSに含まれていることを確認してください。

settings.pyファイルで、STATIC_URLを定義します。次に例を示します。

STATIC_URL = '/static/'

詳細については 静的ファイル

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.