At the head I removed the master page reference
#{
Layout = null
}
in my head css:
html {
background-image:url('Images\BGP.jpg');
}
But nothing changed, can anybody give me some suggestions?
Thanks
HTTP URLs use forward slashes.
They're also relative to the calling file; you probably want a domain-relative path that starts with /.
Related
I'm trying to identify the home page, and then sub-pages on nodes. Ideally as a class on the Body so i can make style changes based on which section the user is in.
I have two .master pages, Global and Site. The body tag is in Global, and Site is a child master.
As this is an English/French site, I'm hoping using the Node Name would be the easiest approach for me.
If your home page and internal pages are of different Page Type then you can benefit from the macro below. We use something like this to give Page type specific id on the body tag and is usually helpful
<body class="{% CurrentDocument.NodeClass.ClassName.ToString() #%}">
However, it can be tweaked to suit your needs.
I'd recommend you to implement one generic stylesheet, shared across all the pages, and a couple of section specific stylesheets.
I'm not 100% clear about what you are describing, but you could use NodeLevel direct as / is NodeLevel = 0, and everything else will be Level 1+
Here's what i've come up in the .cs of my global .Master. So far it seem to be giving me enough to work with. From here i can use js and css to target what i need.
string aliasPath = CMS.DocumentEngine.DocumentContext.OriginalAliasPath.ToLower().TrimStart('/');
if (aliasPath == "")
{
this.BodyClass += " home";
}
else
{
this.BodyClass += " " + aliasPath.Replace("/","_");
}
The simplest approach, if you are willing to add either a data attribute or an id attribute to the body tag, is to add something like this to the master page, in the text box of the body tag:
id="{%nodealias%}"
Since the node alias will typically be unique unless you have multiple pages, at different paths, with the same name, ID should work fine. I prefer to use "nodealias" as opposed to the friendly name because it ensures there will not be any special characters, and will replace white space etc with a dash "-". The above macro will add the node alias as an id attribute to the body tag. Here's a screenshot:
Alternative approach explained here: https://devnet.kentico.com/forums/f49/t43559/body-class which involves setting the body class using a combination of macros and code behind, or via a custom web part. Basically you can modify it using CMS.CMSHelper.CMSContext.CurrentBodyClass (this was written in 2014 so the syntax will be slightly different)
-Edit:
Adding to some of the other answers, if you'd rather add a stylesheet on a template or page level, you can do so. To add a stylesheet reference on every instance of a template, edit the template header properties:
If you want to include the stylesheet on any particular page, this can be accomplished by editing the General tab on the page level, but this will remove the main stylesheet you are using (depending on how you are including it in the page):
In the body section in the Master page you can start with
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if(CurrentDocument.DocumentName== "Site")
CMS.DocumentEngine.DocumentContext.CurrentBodyClass += "body-site";
else
CMS.DocumentEngine.DocumentContext.CurrentBodyClass += "body-global";
}
</script>
I created another folder for my pie.htc..but when I load my html file in IE8 it does not work..i already tried setting different location to its behavior but still it wont work..
here's my code..
behavior: url(/pie/PIE.htc);
As others have noted elsewhere, and as documented here http://css3pie.com/documentation/known-issues/, the PIE.htc file location must be relative to the page where it's used, not relative to the css file. If you'll need to use PIE from within several different pages, consider adding a reference to it dynamically.
Here's how we handled it in a C# .Net application with a master page:
In the master page's markup between the head tags, place the following line:
<style id="InlinePageStyles" runat="server" type="text/css"></style>
In the Page_Load method of the master page's code behind, place the following line:
//get path to PIE.htc and add it to the page as a style (creates a class called Pie)
InlinePageStyles.InnerHtml += string.Format(".Pie {{ behavior: url({0}PIE.htc); }}", ConvertRelativeUrlToAbsoluteUrl(this.Request, ResolveUrl("~/")));
Also in the code behind, add this method:
private string ConvertRelativeUrlToAbsoluteUrl(HttpRequest request, string relativeUrl)
{
return string.Format("http{2}://{0}{1}", request.Url.Host, System.Web.VirtualPathUtility.ToAbsolute(relativeUrl), request.IsSecureConnection ? "s" : string.Empty);
}
Next, remove the behavior from your CSS.
Finally, add the "Pie" class to any page elements that need it.
Hope this helps.
behavior: url(../pie/PIE.htc);
".." for folder selection and pie is the folder
...............................
HI now put your pie.htc in root location and
write to css as like this
behavior: url(PIE.htc);
more info
EDIT: I solved by myself.Cause the stylesheet reference path is /css/style.css not css/style.css,url will not be fixed by asp.net.I found that <link> <meta> and <title> will add as an server control to head when head tagged with runat="server",So these server control will auto fix current reference problem.
!!!BUT,<script> is ignored,One of the solutions is <%= ResolveClientUrl('~/js/jquery.js') %>.But It does not work when you have a theme attched to master page,asp.net canot add stylesheets in App_Themes to head when it contains such <% %> expression,asp.net will throw an exception.
So it seems like the best solution is using <ScriptManager>.
Another important discover is that when you have a <ContentPlaceHolder> in master runat=server head,stylesheet inside <Content> of child page using this master page will not be treat as a server control.So in <Content> of child page you must use <%= ResolveClientUrl%> to handle url fix.
ORINGIAL:
I'm running asp.net 4.0 on IIS 7 Express. I route "MarketList/{type}" to "~/MarketList.aspx" with default value new {type = 0}. The URL "localhost:4888/MarketList" just works well, I can recieve default value "0".
But I found that the "/" will mess up the stylesheet and javascript references defined in "Main.master" master page. "Main.master" is in the root level with "MarketList.aspx". The stylesheet in "Main.master" is defined as css/style.css. The "css" folder is also at the root level. When I'm accessing by "/MarketList", it works well. But, "/MarketList/1" gives the value "1" to {type}. The URL of the stylesheet in the page becomes "../css/style.css" which points to "/MarketList/css/style.css". This doesn't exists (obviously).
So, I decide to use "-" to split those parts, I route "market-list-{type}" with same setting just like above. But, I found I can not access the default routing URL which I thought would be "localhost:4888/market-list-". "localhost:4888/market-list" does not work either. Only "/market-list-0" will work.
Could someone help me?
On my page I have some images on thisdomain.com/images. on document.ready(), I change the src attribute of images to thatdomain.com/images. Firebug's Net tab shows me that images are downloaded from both thisdomain.com and thatdomain.com. How can I prevent the browser from downloading images from thisdomain.com?
$(document).ready(function(){
$("img").each(function() {
var $img = $(this);
var src = $img.attr("src");
$img.attr("src", src.replace(/thisdomain.com.com\/images/i, "thatdomain.com\/images"));
});
});
EDIT: ASP.NET server-side override of Render() using code "in front" i.e., <script runat="server"> I just added this to the aspx page without recompiling code-behind. It's a bit hack-ish but it works.
<script runat="server">
static Regex rgx = new Regex(#"thisdomain.com/images", RegexOptions.Compiled | RegexOptions.IgnoreCase);
protected override void Render(System.Web.UI.HtmlTextWriter writer)
{
using (HtmlTextWriter htmlwriter = new HtmlTextWriter(new System.IO.StringWriter()))
{
base.Render(htmlwriter);
string html = htmlwriter.InnerWriter.ToString();
string newHtml = rgx.Replace(html, "thatdomain.com/images");
writer.Write(newHtml.Trim());
}
}
</script>
This sounds like something that is impossible to achieve reliably, because images will start to load asynchronously as soon as a src has been specified.
I can't think of a workaround. The <base> tag would allow for some kind of "mass redirection" but the URIs would have to be relative ones for that to work.
I'm sure you have your reasons for outputting thisdomain.com in the first place, but I'm pretty sure you'll have to change your code so thatdomain.com gets output instead (or no src gets specified at all so you can add them using jQuery) if you want a 100% watertight solution.
This ain't going to work in the client side. Your best bet is a server side solution. Have the server side script (PHP? JSP? ASP? etc) to read the to-be-included HTML source and replace the src's accordingly with help of a decent DOM parser before it get emitted to the client side.
I don't that is possible at all. To use jQuery functions, the jQuery library needs to be downloaded, which probably means the browser already started downloading other assets, such as images.
You can't be completely sure to prevent downloading by changing the URL after the element has been parsed. The closest possible that you can get is by changing it immediately after the element:
<img id="something" src="http://www.thisdomain.com/images/hello.gif" />
<script type="text/javascript">
var $img = $('#something');
$img.attr("src", $img.attr("src").replace(/thisdomain.com\/images/i, "thatdomain.com\/images"));
</script>
I don't think there is a way to halt GET requests from img elements once the page has loaded. It's difficult to suggest an alternative since I'm not sure what you're trying to achieve.
Can you be more specific?
I have a web page that contains a "div" element. On the page, there is javascript to reference the div: document.getElementById('divId'). This was working fine until another developer redesigned the page to use an ASP master page.
Now, document.getElementById('divId') returns null. It appears that ASP.net prepends some characters to the names of elements within contents forms when you use a master page. How can I know what the id of the div is when the page loads?
Update Allow me to give a specific example to clarify the question: My page had a div with ID divNotice. After changing my page to use a master page, I see when I print the source to the page that renders that the div ID is ctl00_ContentPlaceHolder1_divNotice. My question is, how am I supposed to know what the div ID is going to be when the framework is done with it?
I think that this is what you looking for.
document.getElementById('<%=divNotice.ClientID%>')
to get the ID of your element as appears on the html page use .ClientID
Hope this help.
Dynamically create the javascript using Control.ClientID to determine the calculated ID of div.
document.getElementById('<%= DivControl.ClientID %>')
Or search for the element on the client side using the base ID as a search pattern. See here: A generic way to find ASP.NET ClientIDs with jQuery
I prefer the server side calculation, but if you don't do it often and/or your current design prohibits it, the client side way is a reasonable workaround.
you can check i the element exists by checking if it returns not null
if (document.getElementById('divId') != null) { /* do your stuff*/ }
in other words:
if (document.getElementById('divId')) { /* do your stuff*/ }
now you have edited you orginal question i got it.. i would do something like this:
var arrDivs = document.getElementsByTagName('div'),
strDivName = "divId";
for (i=0;i<=arrDivs.length;i++){
if( arrDivs[i].id.indexOf(strDivName) != -1) {
alert("this is it")
}
}
you can see a demo here:
http://jsfiddle.net/pnHSw/2/
i think you could do it better with a regex.
But this is a pure JS way i don't know ASP.net
edit: i think Aristos solution is much cleaner :P
maybe you can use a descendent selector un css
<div id="wrapperControler">
<controler id="controler"></controler>
</div>
wrapperControler controler{
dosomething;
}