I'm trying to add two custom css stylesheets just before the closing </head> without breaking skin and/or hacking skin?
I built two css files to turn site into responsive design without actually touching any of the skin/template code so it's necessary to have in last ordering of css files.
Your best best is to register it using the DNN CSS Include skin object, adding it to your skin and simply setting a priority that is high.
<dnn:DnnCssInclude runat="server" FilePath="~/Your-PathHere" Priority="100" />
You just need to be sure that you have the following register in your skin as well.
<%# Register TagPrefix="dnn" Namespace="DotNetNuke.Web.Client.ClientResourceManagement" Assembly="DotNetNuke.Web.Client" %>
The full API Details for Client Resource Management will help. Highest DNN priority appears to be 35
Related
I've inherited an .net 4 aspx solution and I need to make a number of changes. All the styles in the main seem to be set in-line. So to make it a bit more maintainable I'm trying to create seperate css files for each aspx file. This may seem overkill, but it's a first stage of gradually moving over to .net core.
Ordinarily I'd simply do something like:
<asp:Content......
<link href="myStyleSheet"....
</asp:Content>
but the link statement causes an error stating that it cannot be nested within a td element. Placing it outside the content block also errors stating that Content is not supported outside the content block.
How should I reference my stylesheets on an individual basis without placing a reference to them all in the <head> section of the master page?
the link statement causes an error stating that it cannot be nested within a td element
Well, that's true. You don't put <link> elements inside a table. According to MDN they can go in "Any element that accepts metadata elements." <td> definitely is not such an element. <head> certainly is, and is probably the safest place to put these.
In your master page you can add a ContentPlaceHolder in the <head>:
<head runat="server">
<title>Your page title</title>
<!-- etc. -->
<asp:contentplaceholder id="HeaderPlaceholder" runat="server" />
</head>
Then in the individual pages put the <link> elements in a Content control for that placeholder:
<asp:Content ID="ContentHeader" ContentPlaceHolderID="HeaderPlaceholder" runat="server">
<link href="myStyleSheet" etc... />
</asp:Content>
This may seem overkill
Ya, it kinda does. Why a separate stylesheet for each page? Seems like it would make more sense to have one stylesheet for the site. For any styling that needs to target only a specific page and nothing else, some wrapper element around that page's content (such as a <div>) with a specific id will make that easy.
My ASP.NET app has some server-side methods whose results I'd like to inject into my CSS files. For example, rather than hard-code the URL to a logo, I might like to insert a call to MyHelperClass.GetCurrentLogoUrl() in the middle of the CSS file.
If I were writing an ASPX page, I could use code render blocks x (that is, stuff like "<%=MyHelperClass.GetCurrentLogoUrl()%>") in the middle of my HTML markup. It would be nice to do something similar for CSS.
There are some CSS preprocessing frameworks, e.g. dotless, and they seem to have some cool features, but I'm not aware of any of them supporting making C# calls like this.
You could just make an aspx page and link to it when including a stylesheet. You'll miss out on css highlighting though.
<link href="http://domain.com/css.aspx" type="text/css" rel="stylesheet">
This has the potential to generate unnecessary overhead though, especially if most properties you're modifying do not change at runtime. In that case you may want to research TT files which basically generate other files when deployed - in your case, you could have it generate the css with whatever complex logic.
David P's answer to ASP.NET MVC URL auto-resolution in CSS files suggests one approach. If you give your CSS files the .aspx extension and then use a Page directive to tell ASP.NET that it's actually a CSS file, like so
<%# Page Language="C#" ContentType="text/css" %>
then you can write CSS, but also use the normal ASP.NET code render blocks. It feels a little bizarre to name CSS files .aspx, but an initial test suggests this could work.
UPDATE: Props to o.v. for pointing this out even faster than me.
You can inject a classname into the html, something like:
<input type="text" id="myTextBox" cssClass="<%=myClassName%>" />
You can also change the class name in the code behind using the .attributes method.
Add the following into your <head></head> section of your page
<style runat="server" id="cssPhoneResize" type="text/css"></style>
Then from your server-side method:
string logoUrl = "/images/logo2.jpg";
cssPhoneResize.InnerHtml += "#Image{-image: url(" + logoUrl + ");}";
Hope this helps!
Having to deal with URL rewriting, I decided to programmatically add CSS references rather than relying on the automatic behavior of ASP.NET to add all CSS files within a theme automatically to the <head> of an ASPX page.
I suceeded in adding the CSS file programmatically by using
<link type="text/css" rel="stylesheet" runat="server" id="CssFile" />
and setting the actual URL it in code behind.
My question is:
Is there a way to prevent the ASP.NET "engine" from automatically adding all CSS files into the <head> of my ASPX/master page?
(Of course, I still could go with my own folders and completely drop the App_Themes concept)
You can prevent this feature by adding the following attributes to the Page directive:
<%# Page ... EnableTheming="false" Theme="" StylesheetTheme="" %>
I do not believe you can tell a skin to not include the files within it, that was the killer for us when it came to using them as it referenced all the css files not just the ones we needed and we needed maximum efficiency.
<head runat="server" visible="false" />
<%# Master Language="C#" AutoEventWireup="true" Inherits="Front" Codebehind="Front.master.cs" **EnableTheming="false"** %>
was my solution to getting around the problem.
I have a <table/> in a ViewUserControl that I have given the tag a class="tblRaised" attribute/value. Visual Studio keeps underlying tblRaised and telling me - The class or CssClass is not defined.
Why is the intellisense engine trying to validate my CSS class names here? Anyone else run into this? Is this a bug? How would intellisense even know where my css file was in a ViewUserControl?
Because the styles are usually included in your view or master page, VS can't find them in your ViewUserControl. If you add something like the following to your ViewUserControl you can get around the issue (and get intellisense) without including the CSS twice.
<% if (false) { %>
<link rel="stylesheet" type="text/css" ...
<% } %>
This will get the intellisense since it can find the stylesheet, but the use of if (false) actually prevents it from being included at runtime.
Typically in the ASP.NET world (not MVC) you'd specify your styles in the master page or your current page. VS then reads all the style information and then tries to help with intellisense to output the class names from your styles onto your aspx page while typing. With MVC it is trying to do the same thing, but it's probably just not finding your files, and throwing up a warning.
Just ignore it for now, I'm sure they are going to try and support that with the 1.0 release.
It's a known bug. Visual Studio IntelliSense is being too helpful. :)
Use this workaround in your user control markup files, it will make VS IntelliSense happy:
<% if (false) { %><link href="../../Content/Css/MyCssDefinitions.css" rel="Stylesheet" type="text/css" /><% } %>
Is it possible to use an ASP.NET web.sitemap with a jQuery Superfish menu?
If not, are there any standards based browser agnostic plugins available that work with the web.sitemap file?
I found this question while looking for the same answer... everyone says it's possible but no-one gives the actual solution! I seem to have it working now so thought I'd post my findings...
Things I needed:
Superfish which also includes a version of jQuery
CSS Friendly Control Adaptors download DLL and .browsers file (into /bin and /App_Browsers folders respectively)
ASP.NET SiteMap (a .sitemap XML file and siteMap provider entry in web.config)
My finished Masterpage.master has the following head tag:
<head runat="server">
<script type="text/javascript" src="/script/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="/script/superfish.js"></script>
<link href="~/css/superfish.css" type="text/css" rel="stylesheet" media="screen" runat="server" />
<script type="text/javascript">
$(document).ready(function() {
$('ul.AspNet-Menu').superfish();
});
</script>
</head>
Which is basically all the stuff needed for the jQuery Superfish menu to work. Inside the page (where the menu goes) looks like this (based on these instructions):
<asp:SiteMapDataSource ID="SiteMapDataSource" runat="server"
ShowStartingNode="false" />
<asp:Menu ID="Menu1" runat="server"
DataSourceID="SiteMapDataSource"
Orientation="Horizontal" CssClass="sf-menu">
</asp:Menu>
Based on the documentation, this seems like it SHOULD work - but it doesn't. The reason is that the CssClass="sf-menu" gets overwritten when the Menu is rendered and the <ul> tag gets a class="AspNet-Menu". I thought the line $('ul.AspNet-Menu').superfish(); would help, but it didn't.
ONE MORE THING
Although it is a hack (and please someone point me to the correct solution) I was able to get it working by opening the superfish.css file and search and replacing sf-menu with AspNet-Menu... and voila! the menu appeared. I thought there would be some configuration setting in the asp:Menu control where I could set the <ul> class but didn't find any hints via google.
Yes, it is totally possible.
I have used it with the ASP:Menu control and jQuery 1.2.6 with the Superfish plugin. Note, you will need the ASP.NET 2.0 CSS Friendly Control Adapters.
ASP.NET generates the ASP:Menu control as a table layout. The CSS Friendly Control Adapter will make ASP.NET generate the ASP:Menu control as a UL/LI layout inside a div.
This will allow easy integration of the jQuery and Superfish plugin because the Superfish plugin relies on a UL/LI layout.
It looks like you need to generate a UL for Superfish. You should be able to do this with ASP.Net from your site map. I think the site map control will do something like this. If not, it should be pretty trivial to call the site map directly from C# and generate the DOM programmatically. You could build a user control to do this, or do it in the master page.
Check out this MSDN article on how to programmatically enumerate the nodes in your site map.
Remember to add css classes for NonLink elements. Superfish css elements don't acccont for them. And if you're like me and have root menu's that are not links, then it renders horribly. Just add AspNet-Menu-NonLink elements to the superfish.css file and it should render fine.
The SiteMapDataSource control should be able to bind to any hierarchical data bound control. I'm not familiar with superfish but I know there are plenty of jQueryish controls out there to do this.
I created a neat little sample project you can use at http://simplesitemenu.codeplex.com/
It is a composite control which generates a nested UL/LI listing from your sitemap.
Enjoy!