آموزش جنگو (Basic) : جلسه سیزده | فایل های استاتیک

در این جلسه به بررسی استاتیک فایل ها در جنگو خواهیم پرداخت . با ما همراه باشید !آموزش جنگو : جلسه سیزده | فایل های استاتیک فایل های استاتیک (static files)در حال حاضر ,ما یک اپ تست شده و آماده به کار داریم . اما قبل از شروع به کار آن , می خواهیم یک عکس و سری فایل های css یا همان فایل های stylesheet را به جنگو اضافه کنیم . می خواهیم آنها را در صفحه index و صفحات دیگر وبسایت نمایش بدهیم . جنگو به این نوع فایل ها که شامل جاوا اسکریپت , css , عکس ها و یا ویدیو ها میشود , استاتیک فایل میگوید . در پروژه های کوچک ممکن است برای استاتیک فایل ها مشکلی نداشته باشید و فقط آنها را در بخشی قرار بدهید تا به سادگی به آن دسترسی پیدا کنید . اما برای پروژه هایی که شامل چندین اپ میشوند ,شما نیاز به مدیریت فضا و مدیریت چینش فایل ها دارید .این کاری است که Django.contrib.staticfiles انجام می دهد . این کلاس , استاتیک فایل های تک تک اپ های شما را پیدا میکند و همه ی آنها را به ترتیبی در مکانی جمع میکند تا شما بتوانید به سادگی به آنها دسترسی پیدا کنید .نکته :ممکن است در طول این بخش کمی به مشکل بخورید . زیرا استاتیک فایل ها در جنگو معمولا دردسر های زیادی را برای شما به ارمغان می آورند . بهترین پیشنهاد ما این است که مشکل خود را در گوگل سرچ کنید (معمولا گوگل بیشتر جواب میده از توضیحات من :) ).تغییر دادن ظاهر وبسایت را شروع کنیم...در دایرکتوری (فولدر) اپ خود یعنی , polls فولدر یا دایرکتوری با نام static ایجاد کنید . جنگو در این فولدر به دنبال فایل های استاتیک شما خواهد گشت . تقریبا شبیه همان روشی است که جنگو برای پیدا کردن تمپلیت ها به کار می برد.جنگو در تنظیمات خود متغییری با نام STATICFILES_FINDER دارد . این متغییر وظیفه مدیریت چگونگی پیدا شدن استاتیک فایل های شما را بر عهده دارد . یکی از گزینه هایی که در آن وجود دارد , AppDirectoriesFinder است . این نوع از مدیریت فایل استاتیک ,در هر اپ به دنبال فولدری با نام static میگردد . بعد از یافتن آن فایل های آن را در مکانی جمع میکند و در اختیار شما قرار می دهد . (منظور از هر اپ ,هر برنامه ای است که در INSTALLED_APPS معرفی شده باشد . جنگو در آنجا به دنبال اپ های نصب شده خواهد گشت .)در مرحله بعدی در همان فولدر و دایرکتوری جدیدی که ایجاد کردید ,فولدر دیگری با نام polls و درون آن فایلی با نام style.css ایجاد کنید . این همان فایل css تمپلیت شما است . به زبانی دیگر شما باید استایل دهی تمپلیت ها و نوع های دیگر استاتیک فایل ها را درون مسیر /polls/static/polls قرار دهید . این بسیار شبیه سیستمی است که جنگو از آن برای ایجاد تمپلیت ها استفاده می کرد . اکنون فقط به مسیر polls/static/polls/style.css بروید و کد زیر را درون آن بنویسید .li a { color: green; }بعد از آن در فایل polls/templates/polls/index.html کد های زیر را بنویسید :{% load static %} <link rel=&quotstylesheet&quot href=&quot{% static 'polls/style.css' %}&quot>توجه داشته باشید که تگ های {% static %} برای شما آدرسی در سرور را تولید میکنند که فایل های استاتیک شما در آنجا قرار دارند . ابتدا ما آنها را لود کردیم و سپس به وسیله سیستم آدرس دهی که قبلا در تمپلیت ها استفاده کردیم , به آنها دسترسی پیدا کردیم .این تمام چیزی است که شما برای ایجاد استاتیک فایل ها نیاز دارید . حال فقط سرور را روشن کنید (یا اگر روشن است آن را ریستارت کنید) . کد زیر را در ترمینال وارد کنید :$ python manage.py runserverحال اگر به آدرس http://127.0.0.1:8000/polls بروید باید ببینید که سوالات به رنگ سبز در امده است . این به معنای آن است که استایل های شما با موفقیت لود شده است .استاتیک فایل ها در حالت Debugاگر در حالت debug=True قرار دارید , ممکن است به مشکلاتی برخورد کنید . در این حالت , باید در فایل تنظیمات خود موارد زیر را مقداردهی کنید :STATIC_URL = &quotstatic/&quot STATIC_ROOT = &quot/static/&quotسپس به فایل urls.py در روت پروژه خود بروید و مسیر های زیر را اضافه کنید :from django.conf import settings from django.conf.urls.static import static urlpatterns = [ # ... the rest of your URLconf goes here ... ] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)بعد از این کار اصولا باید استاتیک فایل ها بدون مشکل برای شما لود شوند . اضافه کردن عکسبرای اضافه کردن عکس یا مدیا به جنگو باید فولدر یا همان دایرکتوری ای با نام images در مسیر polls/static/polls ایجاد کنید . درون این فولدر یک عکس دلخواه با پسوند png که می خواهید آن را به عنوان پس زمینه تنظیم کنید ,قرار بدهید . پس در حال حاضر درون مسیر polls/static/polls/images/background.png عکسی قرار دارد که می خواهیم آن را به عنوان پس زمینه وبسایت تنظیم کنیم .سپس در کد های css که برای فایل index.html استفاده کردید ,کد زیر را برای ایجاد پس زمینه بنویسید . (مسیر polls/static/polls/style.css) :body { background: white url (&quotimages/background.png&quot) no-repeat; }حال کافی است تا به آدرس http://127.0.0.1:8000/polls بروید . خواهید دید که تصویر شما در سمت چپ بالای وبسایت قرار گرفته است .نکته :تگ {% static %} برای فایل های استاتیکی که توسط جنگو تولید نشده اند ,کار نمی کند . برای مثال اکنون ما در فایل style.css برای آدرس دهی عکسی که در پس زمینه قرار داشت از آدرس دهی داخلی و دستی استفاده کردیم و نه از تگ های تمپلیت ها ! این به این دلیل است که اگر بعدا نیاز داشتید تا عکس موردنظر را تغییر بدهید , لازم به عوض کردن تعداد زیادی از آدرس ها که در همه ی صفحات ممکن است قرار داشته باشند ,نباشد .در این جلسه به صورت کلی به بررسی استاتیک فایل ها در جنگو پرداختیم . گرچه بعدا در پیاده سازی جنگو در سرور واقعی مشکلات بیشتری در مورد استاتیک فایل ها ممکن است داشته باشید . در جلسه بعدی به نحوه شخصی سازی ادمین پنل خواهیم پرداخت .