تنظیمات فایل‌های استاتیک

جنگو

سلام

به فایل‌هایی، استاتیک می‌گوییم که که برای ساخت UI یا همان User Interface استفاده می‌شوند. مثلCSS, JavaScripts, Fonts, Images و…

جنگو با این فایل‌ها در زمان توسعۀ نرم افزار کاری ندارد اما برای مدیریت آن‌ها برنامه‌ای به نام contrib.staticfiles را ساخته که در تنظیمات INSTALLED_APPS قابل مشاهده است. ضمناً به راحتی می‌توان ابزارهایی نظیر Bootstrap را روی آن سوار کرد. برای این کار در فولدر لیبوگرام و در کنار فولدرهای بورد و تمپلیت، فولدر جدیدی به نام static و درون آن هم فولدر دیگری با نام‌های css و js می‌سازیم.

به آدرس getbootstrap.com رفته و آخرین نسخۀ آن را دانلود می‌کنیم. از بین نسخه‌های مختلف باید نسخۀ Compiled CSS and JS دانلود شود. فایل‌های CSS را درون فولدر خود و فایل‌های Javascripts را هم درون فولدر خود می ریزیم. در این قسمت از آموزش صرفاً به فایل css/bootstrap.min.css احتیاج است.

در قدم بعدی باید به جنگو این آدرس را اعلام کنیم. به فایل settings.py رفته و در قسمت STATIC_URL تنظیمات زیر را اعمال می کنیم:

حالا باید از آن در فایل مربوط به قالب برنامه استفاده شود. به فایل templates/home.html رفته و تغییرات زیر را انجام می دهیم.

در ابتدا با استفاده از تگ {% load static %} ، فایل‌های استاتیک را به قالب برنامه اضافه می کنیم.

از تگ {% static %} برای اعلام محل قرارگیری فایل‌های استاتیک استفاده می‌شود.

در این مثال از تگ {% static ‘css/bootstrap.min.css’ %} استفاده شده و آدرس /static/css/bootstrap.min.css را باز می‌گرداند که از بیرون با آدرس زیر قابل دسترسی است:

 http://127.0.0.1:8000/static/css/bootstrap.min.css

به تعبیر دیگر تگ {% static %} از تنظیمات STATIC_URL  در settings.py برای تولید آدرس نهایی استفاده می‌کند. برای مثال اگر فایل‌های استاتیک در زیردامنۀ https://static.libogram.com/ قرار داشته باشد باید STATIC_URL=https://static.example.com/ باشد و سپس در فایل مربوط به قالب عبارت مقدار آدرس خارجیِ زیر را باز می‌گرداند.

https://static.libogram.com/css/bootstrap.min.css

همانطور که مشاهده می‌شود، صفحه اندکی تفاوت دارد:

حالا برای بهره‌گیری بیشتر از bootstrap فایل مربوط به قالب را به شکل زیر تغییر می‌دهیم:

و خروجی به شکل زیر تغییر می‌یابد:

 

ترجمۀ اختصاصی توسط تمدن

 

مطلب بعدی: معرفی Django Admin 

مطلب قبلی: تست صفحۀ اصلی

بدون دیدگاه

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

جنگو
تنظیمات دیتابیس PostgreSQL

سلام ابتدا به کاربر Postgres سوییچ می کنیم. sudo su – postgres یک حساب کاربری برای دیتابیس می سازیم. createuser u_boards یک دیتابیس جدید ساخته و نام کاربری بالا را برای آن تنظیم می کنیم. createdb django_boards –owner u_boards یک پسورد قوی برای کاربر انتخاب می کنیم. psql -c “ALTER …

جنگو
ساخت کاربر برای برنامه

ساخت کاربر برای برنامه با دستور زیر کاربر جدید را می سازیم. adduser boards من معمولاً نام برنامه را برای نام کاربری انتخاب می کنم. پسورد و سایر اطلاعات اضافی که از شما می خواهد را وارد کنید. حالا نام کاربری را به لیست sudoer ها (حساب های کاربری با …

جنگو
توسعه و پیکربندی VPS در دیجیتال اوشن

سلام شما ممکن است قصد استفاده از هر نوع VPSای را داشته باشی و این هیچ عیبی ندارد. نکتۀ مهم آن است که تنظیمات را مشابه من انجام دهید. سیستم عامل روی سرور، اوبونتوی ۱۶.۰۴ است. در مرحلۀ اول یک سرور جدید (در دیجیتال اوشن به آن Droplet می گویند.) …

هرگونه استفادۀ از این آموزش به صورت رایگان و با ارجاع به تمدن جایز است.