Utilize the Static Path in Django with Template Filters

To easily version my css file using a simple template variable, I update the version in my settings and it automatically applies to all files. Here's how I accomplish this:

Template Filter

@register.filter
def settings_value(name):
    return getattr(settings, name, "")

Template

{% with "APP_VERSION"|settings_value  as v %}
<link rel="stylesheet" href="css/style.css?v={{ V }}"/>
{%endwith%}

This method works perfectly fine. However, my current css path is set like this:

<link rel="stylesheet" href="{% static 'css/style.css?v=' %}"/>

I am looking for a way to apply the version number in this format.

What I've Tried

<link rel="stylesheet" href="{% static 'css/style.css?v=' %}{{ v }}"/>

Unfortunately, this approach does not work. Any suggestions? Thank you.

Answer №1

After some experimentation and trial, I was able to discover the answer.

{% set "APP_VERSION"|get_setting_value as version %}
<link rel="stylesheet" href="{% static 'css/style.css' %}?v={{ version }}"/>
{% endset %}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Having difficulty generating a footer for a page that includes a Material-UI Drawer component

Looking to create a standard full-width footer at the bottom of my page, I need help with the implementation. Utilizing the "Permanent drawer" from Material-UI Drawer for reference here. If you're interested in experimenting with it, CodeSandbox link ...

What is the significance of using em units in web design?

As I delve into an older project that heavily relies on em's for all design elements, including font sizes and layouts, I can't help but question the benefits of using em's in this way. Do they truly offer any advantages when it comes to lay ...

Programmatically simulate a text cursor activation as if the user has physically clicked on the input

I have been attempting to input a value into a text field using JavaScript, similar to the Gmail email input tag. However, I encountered an issue with some fancy animations that are tied to certain events which I am unsure how to trigger, illustrated in th ...

Targeting HTML tags, styling names, and class names using CSS

In the markup below, I am trying to target three specific points using CSS. img style*=right class=media-element I attempted to use the code below, which did not work: img[style*="right"][class="media-element"] {margin-left:10px;} However, selecting t ...

Why does the <div> element still have an offset even though its width and height are set to 100px and padding, margin, and border are set to 0px?

After styling my div element with specific CSS rules, I'm encountering an issue. The div has a set width and height of 100px along with padding, border, and margin all set to 0px. However, the elements are not being offset from the edges of the browse ...

Is it possible to switch the placement of my sidebar and content?

For some reason unbeknownst to me, I have created two distinct CSS classes called content and sidebar1. My original intention was to position the sidebar on the right side of the page. However, no matter what adjustments I make, the sidebar stubbornly rema ...

Stop jQuery from resetting the background image when using fadeOut()

Currently, I am using fadeIn and fadeOut functions with jQuery to create a fading effect. However, when the final fade out occurs, the entire CSS table fades out and the background image of the CSS body comes into view. Despite setting the background-posit ...

Switch the orientation of the unordered list from horizontal to vertical in a dynamic way

Perhaps a repeated inquiry, yet I have been unable to discover a solution for this issue... I am dealing with a div element (referred to as master) that I do not have the ability to adjust in terms of width or height. Contained within the master is anoth ...

The mobile menu toggle functionality is malfunctioning on actual mobile devices, however, it is operational when tested on various mobile sim

Recently, I noticed that on , the menu collapses into a hamburger icon for mobile. However, when tapping on it on my phone and other devices, nothing happens. Surprisingly, it works perfectly fine when clicking on it in mobile simulators within Google Chro ...

What is the best way to send props to a styled component without needing to convert them to transient props beforehand

Recently, I designed a custom Text component that accepts several props. These props are then forwarded to the styled component where specific styles are applied. However, I am facing an issue where I do not want these props to be passed down to the DOM, b ...

Creating formatted code blocks within my HTML document

I'm currently working on achieving this layout in my HTML: https://i.stack.imgur.com/2LEQO.png Here is the JSFiddle link: https://jsfiddle.net/cr9vkc7f/4/ I attempted to add a border to the left of my code snippet as shown below: border-left: 1px ...

What are the steps to apply material-ui's error-themed style (color) to non-form text?

When it comes to using error styles for form inputs like text fields, the documentation is straightforward. But what about applying the same style to a custom element, such as a text label for a file upload button or another unique component that doesn&apo ...

Choosing the subsequent element that comes before

<tr class="main"></tr> <tr class="emails-details"> <button>some button</button> </tr> <tr class="main"></tr> <tr class="emails-details"> <button>some button</button> </tr> &l ...

Problem regarding the widths of HTML <table> elements

I am working with a <table> that has 3 columns structured as follows: table { border: 1px dashed goldenrod; } td { border: 1px solid gray; } <table> <tr> <td width="120">Some content</td> <td width="150"> ...

What is the best way to showcase information from a database in Django once numerous conditions have been met?

I am seeking advice on my Model Recommenders: class Recommenders(models.Model): objects = None Subject = models.ForeignKey(SendApproval, on_delete=models.CASCADE, null=True) Recommender = models.CharField(max_length=20, null=True) Status = ...

The AutoSchema being used by drf-spectacular is incorrect and is not generating the correct Swagger documentation

Before, I relied on drf-yasg, but now I want to update to use OpenAPI 3. I am in the process of transitioning to drf-spectacular. Following the steps provided in the documentation, I executed pip install drf-spectacular, removed all instances of the drf-ya ...

The chat application functions as an independent endpoint

I am exploring options to develop a chat (web socket) application for my eCommerce Django REST application. What design approach would work best? Embed the chat functionality within the same Django REST server as the application. Set up the chat as a s ...

Issue with CSS causing elements to display improperly within nested grids

I am facing an issue where I want to nest a grid within another grid, but the elements in the nested grid are not appearing in the order I desire. Specifically, I would like the "#classes" section to be at the bottom of the nested grid, but it remains stuc ...

step-by-step guide to disabling grayscale mode automatically

In recent times, a trend has emerged in Thailand where many websites are appearing in grayscale. This is achieved through the use of -webkit-filter: grayscale(100%), filter: grayscale(100%) and similar filters. Although it is possible to revert these webs ...

Using Django with Ajax without the need for the JQuery library

Exploring the world of Ajax without jQuery Library has been quite a journey. I recently created a basic view that displays a random number on the screen. After adding a button and invoking the ajax function, I encountered an issue where clicking the button ...