Django Get the Static Files URL in View

Last Updated : 27 Aug, 2024

In Django, static files such as CSS, JavaScript, and images are essential for building interactive and visually appealing web applications. While Django provides robust mechanisms to manage static files, we might need to access the URLs of these static files directly within our views, especially when we need to manipulate or dynamically generate content based on static files. In this article, we'll explore how to retrieve static file URLs in a Django view, and we'll demonstrate this with a simple project.

Django Get the Static Files URL in View

Create a New Django Project and Application

Begin by creating a new Django project and an application:

django-admin startproject static_example
cd static_example
python manage.py startapp myapp

Add the Application to Settings

Open settings.py and add 'myapp' to the INSTALLED_APPS list:

Python

# ...
INSTALLED_APPS = [
    # ... other apps
    'myapp',
]
# ...

Configure Static Files

Ensure the static file settings in static_example/settings.py:

Python

import os 

# ...

STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]

# ...

Add Static Files

Create a directory named static in the myapp of the project and add a CSS file and an image for demonstration. The project structure should look like this:

static_example/
     static_example/
     myapp/
          static/
     manage.py

styles.css

CSS

body {
    background-color: lightblue;
}

images.png: Add an image in the static/images/ directory.

Create a View to Get Static File URLs

To retrieve the URL of a static files in the view, we can use the 'static' function form django.templatetags.static. The static function returns the url like this: STATIC_URL/<file_path>.

We can also add the host/domain name using the get_current_site method.

In myapp/views.py, create a view that retrieves the URL of a static file.

Python

from django.shortcuts import render
from django.templatetags.static import static

def static_url_view(request):
    css_url = static('css/styles.css')
    image_url = static('images/images.png')
    return render(request, 'myapp/static_urls.html', {'css_url': css_url, 'image_url': image_url})

Create a Template to Display Static File URLs

Create a template named static_urls.html in myapp/templates/myapp/ to display the URLs:

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Static Files URLs</title>
    <link rel="stylesheet" type="text/css" href="{{ css_url }}">
</head>
<body>
    <h1>Static Files URLs</h1>
    <p>CSS URL: <a href="{{ css_url }}">{{ css_url }}</a></p>
    <p>Image URL: <a href="{{ image_url }}">{{ image_url }}</a></p>

</body>
</html>

Set Up URL Patterns

In myapp/urls.py, add a URL pattern for the static file URL view:

Python

from django.urls import path
from .views import static_url_view

urlpatterns = [
    path('static-urls/', static_url_view, name='static_urls'),
]

Include this URL configuration in the project's static_example/urls.py:

Python

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('myapp.urls')),
]

Start the Development Server

Run the Django development server:

python manage.py runserver

Access the View

Navigate to http://127.0.0.1:8000/static-urls/ in the browser. We can see the static file URLs displayed, and the CSS should be applied to the page, with the image rendered.

Conclusion

Retrieving static file URLs directly in Django views can be useful for various scenarios, such as dynamically generating content or providing URLs to be used in scripts. By following the steps outlined in this article, you have learned how to set up a Django project to handle static files, access their URLs in views, and display them in templates. This capability enhances the flexibility and interactivity of your web applications, allowing you to manage static content effectively.

Django - Upload files with FileSystemStorage

prathamsahani0368

Improve

Article Tags :

Practice Tags :

python

Django Get the Static Files URL in View