Include a URL parameter in the CSS file within the ASP themes directory

I recently developed a code snippet for versioning JavaScript files by appending the file path with an md5 hash. Here's an example:

<script src="../Javascript/Navigation.js" type="text/javascript"></script>

which transforms into:

<script src="../Javascript/Navigation.js?md5=70D2B4D1F236C7E340D9152B9E4102C3" type="text/javascript"></script>

While this method is quite standard, I am facing challenges in implementing it for CSS files located in the app_themes folder. How can I modify the CSS links in a similar manner?

asp.netcssapp-themes

Answer №1

You have the option to incorporate this behavior into your page using a control adapter in a clean manner:

public class PageAdapter : System.Web.UI.Adapters.PageAdapter
{
    protected override void OnPreRender(System.EventArgs e)
    {
        foreach (var link in Page.Header.Controls.OfType<HtmlLink>().ToList())
            if (link.Attributes["type"].Equals("text/css", StringComparison.OrdinalIgnoreCase))
                if (link.Attributes["href"].Contains("/App_Themes/{0}/".Fill(Page.Theme), StringComparison.OrdinalIgnoreCase))
                   /* process link */

        base.OnPreRender(e);
    }
}

To implement it, save the following code as a *.browser file within the App_Browsers directory:

<browsers>
  <browser refID="Default">
    <controlAdapters>
      <adapter controlType="System.Web.UI.Page"
               adapterType="PageAdapter" />
    </controlAdapters>
  </browser>
</browsers>

In general, my perspective is that Control Adapters serve as a potent AOP-like mechanism for embedding behavior into control/page life-cycles, yet they tend to be overlooked in favor of traditional sub-classing.

Answer №2

One recurring issue I'm encountering is the repetition of CSS entries in the HTML markup every time there's a postback. For instance, if I have newabc.css, the code will transform it into newabc.css?v=1. If I inspect the HTML source after 5 postbacks, I'll find 5 instances of "newabc.css?v=1". To address this, I set link.EnableViewState = False, which resolves the problem. However, I'm wondering if this step is truly necessary?

Dim link As HtmlLink = Nothing

For Each c As Control In Page.Header.Controls
    If TypeOf c Is HtmlLink Then
        link = TryCast(c, HtmlLink)

        If link.Href.IndexOf("App_Themes/", StringComparison.InvariantCultureIgnoreCase) >= 0 AndAlso link.Href.EndsWith(".css", StringComparison.InvariantCultureIgnoreCase) Then
            link.Href &= "?v=" & VER_CSS
            'link.EnableViewState = False
        End If
    End If
Next

Answer №3

Save yourself time and effort by utilizing Combres instead of reinventing the wheel. It fulfills all your needs and then some!

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

Styling the Container Component in ReactJS

I need to apply some styling to the "Forms_formline__3DRaL" div (shown below). This div is generated by a component, but it seems that the style I want to add is being applied to the input instead of its parent div. How can I use ReactJS to set the style " ...

cssreactjsnext.js

Why are all links broken and the mobile menu disappeared after installing featherbox gallery?

If you want to see for yourself, here is the link. I can't figure out why my website has suddenly lost functionality on this specific page. None of the links work, except for the home and contact (the non-expandable ones). The navigation menu seems ...

jqueryhtmlcsslightbox

Using various colors to highlight specific sections of a letter or number

I am striving to recreate the unique image shown below, particularly interested in achieving the multi-colored effect on the numbers. This aspect of having different colors for parts of the number is intriguing and I would love to learn how it's done. ...

javascripthtmlcss

Concealed Sub Menus Within a Vertical Navigation Bar

I've successfully created a Vertical Menu with hidden submenus, but I'm struggling to make the submenu appear on hover. Any suggestions on how to achieve this? Also, I'd like to align the text all the way to the left and remove the bullets f ...

htmlcsswordpressmenunavigation

Issue with exporting GridView within an update panel to Excel and refreshing the grid

I am facing an issue with refreshing a gridview after exporting it to Excel using HTTP response. The export functionality is working fine and opens the file in a pop-up, but the gridview is not updating to reflect the exported data. Despite verifying the ...

c#asp.netgridviewupdatepanelexport-to-excel

What is the best way to integrate a non-WCF rest service in asp.net mvc 3?

I have developed a basic web service with Webmatrix that sends data in json format. I would like to utilize this service in ASP.NET MVC 3. While I am familiar with integrating services using WCF, we have decided not to use WCF for this specific project. Is ...

asp.netasp.net-mvcweb-servicesasp.net-mvc-3

Transfer the sidebar widget to the right-hand sidebar

Check out my website: I'm currently featuring a sidebar widget that looks like this: <div class="col-md-4"> <!-- Blog Categories Well --> <div class="blogcta"> <h3 class="hidden-xs">If you're 20-30, ...

htmlcss

The initial call to AJAX GET may result in undefined, but it successfully retrieves data on the subsequent attempt

I am currently developing a real estate web application using ASP.NET MVC. The issue I am facing lies within the Reservations section. https://i.sstatic.net/zFgPs.png My approach involves utilizing AJAX to post data to a Controller which then returns a JS ...

javascriptphpjqueryasp.netajax

The progress indicator in Ajax's updateProgress feature fails to display the correct progress for the designated UpdatePanel

I am facing an issue with my Ajax panel, where I have a first panel nested inside another panel called second panel. Additionally, I have an updateProgress associated with the first panel. There are two main problems that I am encountering: The updatePr ...

asp.netajaxvb.netupdatepanelupdateprogress

Is it possible to have both an Admin panel and a user panel integrated into one solution using ASP

I'm currently in the process of building an online election website using ASP.NET. The user panel is already completed, and now I am working on creating the Admin panel. https://i.sstatic.net/dfOUH.png Both the admin panel and user panel have been d ...

c#asp.netvisual-studio-2015architecturesoftware-design

Arrange the bootstrap columns in a grid layout both vertically and horizontally adjacent to one another

I need help with displaying my columns in this specific layout https://i.stack.imgur.com/2hzju.jpg Code <div class="row"> <div id="id-orders-stats" class="col-md-6 col-sm-6"> </div> <div class="col-md-6 col-sm-6 stats-box"&g ...

csstwitter-bootstrap

Adjusting the size of the div both horizontally and vertically in Angular 5 using the mouse cursor

As a beginner in Angular 5, I am looking to achieve horizontal and vertical resizing of a div by dragging with the mouse pointer. Can someone assist me in implementing this feature? ...

cssangular

How to center align SVG with text in a unique way

Having trouble vertical aligning my inline SVG within a label. Any suggestions? This is how I've attempted it: <label for="menu-check-box">More<svg class="more-icon"><use xlink:href="#more-chevron"></use></svg></labe ...

htmlcsssvg

Considering a background image for your email form?

I'm trying to create an email form with a background image for the entire form. I've attempted using CSS background-image and HTML to set the background image, but so far no luck. Most tutorials only cover how to add an image inside a text box ( ...

phphtmlcssimagebackground

Customizing Bootstrap navbar classes - ineffective

Having trouble overriding some of Bootstrap's navbar classes. I've tried using !important, but would prefer to avoid it if possible. This is the HTML I'm working with: <nav class="navbar navbar-default" role="navigation"> <ul cl ...

htmlcssbootstrap-4

Another option for replacing <BR> tags with CSS styling

I am currently utilizing the br tag to insert line breaks in my website's faq section. Although the output is accurate, I'm exploring alternatives like implementing linebreak through CSS to enhance responsiveness. During my research, I came acros ...

htmlcss

The issue with rendering CSS styles from <style></style> tags in Visual Studio while debugging in VB is causing a problem

<style> #ctrtable{width:600px;margin-left:auto;margin-right:auto;} </style> For the purpose of centering a table on the viewport, the above style block is added to the web page.   While using Visual Studio 2013 Express in debug mode, t ...

cssvb.netdebuggingwebvisual-studio-2013

The randomness of a generated string is compromised if it is called multiple times

I'm having trouble generating a random string of words in a WebForms page using C# and ASP.NET. It works fine when called once, but when I call it multiple times in a row during a PostBack, it repeats the same random string each time. I suspect there ...

c#asp.net

Targeting an outer div based on checkbox status: a comprehensive guide

How can I target a div when a user checks a checkbox? Any advice on how to select an outer div when the checkbox is checked? ...

htmlcsscheckbox

Having trouble getting CSS animation to work on Mozilla using mozAnimationName?

<style> @keyframes shake { 0% { -moz-transform:scale(0);opacity:0; } 25% { -moz-transform:scale(1.3);opacity:1; } 50% { -moz-transform:scale(0.7);opacity:1; } 75% { -moz-transform:scale(2); ...

javascriptcsscss-animations