Adding javascript -- where?

Topics: Themes
Oct 30, 2007 at 5:36 PM
Edited Oct 30, 2007 at 5:38 PM
Hi,

Using BE release id 5922.

I have looked all over these forums and the documentation, have found some tips, but can't get my javascript files to stick when creating a new theme. The javascript files are in the root folder of the theme, and I reference them in the head of the theme's site.master page. On initial page load, the js functions are called successfully, but when drilling down into the message, calls to the functions throw errors, even tho I can see in the DOM that the head tag is intact.

I have tried adding "<script type="text/javascript" src="themes/duringlunch/jquery.js"></script>" to the HTML head section in the Admin panel, but as soon as go into the post details the script references aren't correct.

The styles are sticky. In looking at the page source, showing the link to the style sheet, of different pages I see this

default.aspx: <link type="text/css" href="themes/duringlunch/style.css" rel="stylesheet">
/post/2007/09/Welcome-to-BlogEngineNET.aspx: <link type="text/css" href="../../../themes/duringlunch/style.css" rel="stylesheet">

What is causing this rewriting of the path?

So, where do I put my javascript files, and how do I reference them?

Thanks,
James
Coordinator
Oct 30, 2007 at 11:25 PM
The stylesheets are automatically being rewritten because the <head> element is runat="server". it's just something ASP.NET does automatically. You can use "~/themes/yourtheme/style.css" with the tilde.

The javascript is harder. You need to do the path like so as relative to the root: "/themes/yourtheme/script.js".
Oct 31, 2007 at 3:11 AM
Edited Oct 31, 2007 at 3:11 AM
Hi Mads,

Thanks for the reply. It was rather frustrating but I came up with a solution. I put the reference to the javascript files at the bottom of the master page with Request.ApplicationPath and BlogSettings.Instance.Theme and it's working well. Probably won't scale well, but this is just a personal project.

<script type="text/javascript" src="<%=Request.ApplicationPath %>/themes/<%=BlogSettings.Instance.Theme%>/jquery.js"></script>
<script type="text/javascript" src="<%=Request.ApplicationPath %>/themes/<%=BlogSettings.Instance.Theme%>/shadedborder.js"></script>
<script type="text/javascript" src="<%=Request.ApplicationPath %>/themes/<%=BlogSettings.Instance.Theme%>/duringlunch.js"></script>
</body>
</html>

I had tried the ~, the beginning "/", and all sorts of permutations on the path, but it would never work correctly when going to the Comment View or Archives. This seems to be working ok.

Thanks for your work on this. I think this blog engine is the best around.

James
*****************
James Johnson
President, Inland Empire .NET User's Group
www.iedotnetug.org


madskristensen wrote:
The stylesheets are automatically being rewritten because the <head> element is runat="server". it's just something ASP.NET does automatically. You can use "~/themes/yourtheme/style.css" with the tilde.

The javascript is harder. You need to do the path like so as relative to the root: "/themes/yourtheme/script.js".