How to Setup Django Static files in Django Project and Application

Setup Django Static files copy
Django Django Tutorials

How to Setup Django Static files in Django Project and Application

How to Setup Django Static files in Django Project and Application

Django is the Python-based web framework that is widely used to develop powerful web applications/websites. We discussed different Django-related topics to learn Django from basic level to advance. In this Django tutorial, we have to discuss the topic ‘Setup Django Static files’. To learn under discussion topic, you have to clear what is the static file in Django. There are different recourses on the internet you can learn easily but JafriCode is also the best platform to learn web development from beginners level to advance.
As you have read, which topic we have to discuss today, we will move around Static files in Django that what are these files, how to manage them, and their importance. Let’s start to learn!
Basically, when you create a web application, you need different kinds of document files, images, etc. In that document files, there may be HTML files, Python files, js, jquery, CSS, etc included in your Django projects.
Question is that what are static files? The files other than HTML document files like Javascript, Jquery, CSS, or images are known as static files.

Why need Django Static Files

What needs to learn such a topic? It is necessary to learn because you have to setup such files in your Django project, without installing or setup you cannot use that files in your project to utilize them properly.
Actually, your project may need some functionality, that is archived using a scripting language like javascript. So, you will use javascript for specific functionally, but problem is that how you can render or Setup JS files. To do this, you have to keep such files in static files. To include your JS file in static you have to Setup Django Static files in your Django project.

Setup Django Static files in Settings.py file

To Setup Django Static files are very important because without static files you cannot archive targets in the project. So you have to manage static files in the Django project. There are some configurations settings you have to follow:

In INSTALLED_APPS, you have to mention django.contrib.staticfiles, but you don’t know it will be included by default, if you don’t find then you have to add.

In your settings.py file, define STATIC_URL as;

STATIC_URL = ‘/static/’

After doing this you have to create a folder named ‘static’ in which all the files JS, JQ, CSS, Images will be stored there. When you create a folder you have to give a path in your Django settings.py file. For example

STATIC_DIR = os.path.join(BASE_DIR, ‘static’)

STATICFILES_DIRS = [ STATIC_DIR ]

Above two lines of code, you have to mention in your setting file to use a static folder as you created in the root folder.

Use of {% load static %} tag in Django template

If you want to use static files like CSS, Images, etc you have to load static first at the top of the Django HTML  Template. Without loading static you cannot use any static files on your web page you will get an error. If you want to insert an image then you have to load the static file at the top and also mention with image path as shown in the example:

{% load static %}
<img src=”{% static ‘appName/imageName.jpg’ %}” alt=”Image Name”>

You have to follow this pattern {% static ” %}, in the single quotes you have to give a file path so it will proper

Conclusion

As you have read an article related to Setup Django Static files, after that you can manage all static files that are related to your Django Project.

If you have any questions in your mind while reading out the tutorial, then must share them with us. We will provide you the best solution possible.

If you use Facebook, Twitter, Pinterest, LinkedIn, or other social media platforms, then share this Django tutorial, if you share, more students will take the chance to learn.

Recommended Django Tutorial for Beginners

Django Template Inheritance with Examples | Explanation

How to Add Django Website Templates in Django Project and Application

Ultimate Guide | Creating Application in Django | Django commands

Django Form Validation | Complete Django Tutorials

Django Forms Widget | Complete Discussion | Django Tutorials

Leave your thought here

Your email address will not be published. Required fields are marked *

Select the fields to be shown. Others will be hidden. Drag and drop to rearrange the order.
  • Image
  • SKU
  • Rating
  • Price
  • Stock
  • Availability
  • Add to cart
  • Description
  • Content
  • Weight
  • Dimensions
  • Additional information
Click outside to hide the comparison bar
Compare

Get your Enrollment

50%OFF

Leave your details below and receive a discount coupon in your inbox