I am using WebOptizimer in a C#.NET 6 core razor webapp. The css links I am using need absolute URLs (before you ask: there might be cross site requests).
In razor - within Layout.cshtml - it looks like this:
<link rel="stylesheet" href=#string.Format("{0}://{1}/css/layout.css", scheme, host) type="text/css" />
The generated html looks like this:
<link rel="stylesheet" href="https://localhost:5001/css/layout.css" type="text/css" />
There is no version fingerprint, nor is it minified.
How to make these minified and fingerprinted?
Please note: if I just use "/css/layout.css" everything works fine.
Related
My project is here
(Look for "Laptop" branch, and "IsolatorUI" internal project)
I need to work with external css file I just saved in wwwroot/css.
I have a schtml Home view file and I would like to use it there.
So far, everything I tried did not work. Even using the site.css which was already there was unsuccessful.
Please ignore the different languague on cshtml HomeView file.
How can I establish a css file link? There are many discussions and suggestions I found on the internet, but none of them worked for me.
It's really frustrating when such simple thing doesn`t work...
Basically there is a disturbing bug with css in .NET framework files, but eventually this code worked for me:
In my View:
#section Styles {
<link href="#Url.Content("~/css/Home.css")" rel="stylesheet" type="text/css" />
}
And in my Layout:
<head>
...
<link rel="stylesheet" type="text/css" href="~/css/site.css" />
#RenderSection("Styles", false)
</head>
I am using Visual Studio 2013. I created a website (ASP.NET Web Site Razor v3) which works just fine in the browser under debug (with Chrome). However - when I deploy the website (simple copy to IIS local), the paths for the stylesheets do not work even though they appear to be accurate in view-source.
I looked over a few threads and saw one talking about url-rewrite. But I don't see any re-writing going on. Maybe I am missing it.
Anyway... the styles:
<link rel="stylesheet" href="~/css/bootstrap.min.css" />
<link rel="stylesheet" href="../css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="../css/fullcalendar.css" />
You can see I tried a couple of options there. When I look at the source code, I see the following:
<link rel="stylesheet" href="/MyMeds/css/bootstrap.min.css" />
<link rel="stylesheet" href="../css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="../css/fullcalendar.css" />
My IIS Website is in the /MyMeds/ folder. So that would appear correct. It is almost like it IS re-writing it. But I do not see any re-write rules in the web.config file.
thanks.
You need to use #Url.Content(). LIke this:
<link href="#Url.Content("~/css/bootstrap.min.css")" rel="stylesheet" />
I have a folder in my web application where aspx page and content page both are there and master page is in root location. I am using the css path which is loading fine in firefox console for aspx page but the same path is not loading for content pages checked in firefox console. Due to that some of the boostrap functionality not working.
Below is the css path for aspx page
<link href="MySheet.css" rel="stylesheet" type="text/css" />
and same path is used for content page
<link href="MySheet.css" rel="stylesheet" type="text/css" />
Need help in this.
The browser resolves the href url in a relative manner. If it's located in the root, you can place "/" in the beginning of the path, like this:
<link href="/MySheet.css" rel="stylesheet" type="text/css" />
this will instruct the browser look for the stylesheet in the root, regardless of the current page's relative path. But if you use a server-side technology, like ASP.NET, there's another way of specifying the application's root - "~/", in this case, though in this case you'd have to add runat="server" to the tag, so it would look like this:
<link href="~/MySheet.css" rel="stylesheet" type="text/css" runat="server" />
I have an ASP.NET web app hosted in a windows dedicated server.
In my app there are many folders. To simplify my problem let's say I have this scenario:
folder
default.aspx
css
js
I would like to setup default.aspx as my default page, meaning, when a user types domain.com, default.aspx is shown.
In order to do this, I edited my web.config file and it works.
The problem is styles and javascripts.
My default.aspx contains this:
<script type="text/javascript" src="js/xxxx.js"></script>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
So the styles and javascripts aren't found.
I really don't want to remove the folder and put everything in the root, and just moving the default.aspx page is not really an option, as I have a MasterPage.
use resolveUrl or a path from root to resolve locations of js and css
<script src='<%= this.ResolveUrl("~/js/xxxx.js") %>' type="text/javascript"></script>
<link href="~/css/styles.css" rel="stylesheet" type="text/css" />
If you're wanting to link to items, you can use the path from the website root. Just place a slash in front of the path.. like this:
<link rel="stylesheet" href="/css/webedit.css" type="text/css" />
You could use Page.ResolveUrl method to get correct paths:
<script type="text/javascript" src='<%= Page.ResolveUrl("~/js/xxxx.js") %>'></script>
<link href='<%= Page.ResolveUrl("~/css/styles.css")' rel="stylesheet" type="text/css" />
For more info see Specifying Paths for Resources.
EDIT: it's mentioned in the comment that this is not working for stylesheets. It's partially true. It won't work for server-side, but will for client-side elements.
It seems your <link> element is located inside a server-side <head> tag, this means ASP.NET treats <link> inside <head> as a server-side controls even if you didn't specify runat="server" attribute there. So you don't need to use a server-side construct in that case:
<link href="~/css/styles.css" rel="stylesheet" type="text/css" />
For ASP.NET WebForms and MVC projects I strongly reccomend moving to Client Dependency framework and let it handle your page dependencies.
For your two dependencies you simply add these declarations to the page:
<CD:CssInclude ID="CssIncludeStyles" runat="server" FilePath="~/css/styles.css" />
<CD:JsInclude ID="JsIncludeXXXX" runat="server" FilePath="~/js/xxx.js" />
This is already cleaner then calling this.ResolveUrl on each dep. declaration.
You can furthermore facilitate the declaration of dependencies by introducing mapped paths in the dependency framework (see documentation for how-to).
An easiest way to start with client dependency is to add it via NuGet to your ASP.NET web site project.
It ensures you never have duplicate dependencies on one page and gives you a control over how dependencies are ordered.
In my .net application i have Styleshet.css in CSS folder.
Now i want to link this css in Sample.aspx.
What would be the best approach
1.
<link href="CSS/StyleSheet.css" rel="Stylesheet" type="text/css" />
OR
2.
<link href="<%=ConfigurationManager.AppSettings["ApplicationUrl"].ToString()%>/CSS/StyleSheet.css" rel="Stylesheet" type="text/css" />
In Web.Config
<appSettings>
<add key="ApplicationUrl" value="http://localhost/myapp/" />
</appSettings>
The best way in asp.net is option 3:
<link href="~/CSS/StyleSheet.css" rel="Stylesheet" type="text/css" />
The ~/ resolves to the site path root. The difference between this and just "css/... is that it will work no matter what subfolder you're in. For example if your code was in
/subsection/default.aspx
and your styles were in folder /css
using a link to "css/stylesheet.css" would resolve (incorrectly) to "/subsection/css/stylesheet.css" whereas using "~/css/stylesheet.css" would resolve (correctly) to "/css/stylesheet.css"
This also differs from a hard path root "/css/stylesheet.css" in that it will work correctly regardless of the virtual directory configuration of the site.
<link href="CSS/StyleSheet.css" rel="Stylesheet" type="text/css" />
Dont go for second approach as when you deploy your site to a server the /localhost/ reference wont work.
Well, always use relative paths so that you don't have to change your files after the deployment.
You can also use resolved app relative path such as
<link href="<%= ResolveUrl("~/CSS/StyleSheet.css") %> rel="Stylesheet" type="text/css" />
Reletive path approch is much better (your first approch), Absolute paths are not portable between applications. If you move the application that the absolute path points to, the links will break.
You can find more information on below mentioned link
Specifying Paths for Resources