Themes, virtual path and base href - asp.net

I have created a theme with a skin, including e.g. following:
<asp:Image runat="server" runat="server" SkinID="SquareCopy"
ImageUrl="~/App_Themes/MyTheme/square_copy.png" />
This would create (depending from what page I call it):
<img src="../App_Themes/MyTheme/square_copy.png">
What would I need to do if I only wanted (no ../):
<img src="App_Themes/MyTheme/square_copy.png">
I tried to ommit ~/: ImageUrl="App_Themes/MyTheme/square_copy.png" />
But this doesn't seem to have any effect. The reason why I want to have fix paths is the use of base href through the whole project.
Thx for any suggestions!
Edit:
Interesting, if I use a Image-Control without skin-id, I can make it render the path as I would like to have it:
<asp:Image id="Image1" runat="server"
ImageUrl="App_Themes/MyTheme/square_copy.png"/>
Results in:
<img id="MainContent_Image1" alt="Image text"
src="App_Themes/VolunteerClient/square_copy.png">

Base url of the element defined in skin file will always be
App_Themes/MyTheme/
where MyTheme is a name of your theme.
eg.
Path="~/App_Themes/MyTheme/Images/a.jpg"
will be resolved to
Path="App_Themes/MyTheme/Images/a.jpg"
also
Path="Images/a.jpg"
will be resolved to
Path="App_Themes/MyTheme/Images/a.jpg"
If you want to change that behaviour you will need to overwrite path.
Hope that helps

Try something like this...
<asp:Image runat="server" runat="server" SkinID="SquareCopy"
ImageUrl="<%= Page.ResolveClientUrl("~/App_Themes/MyTheme/square_copy.png") %>" />

Related

MediaItem fails to resolve symbol when used with GetMediaUrl in the image source atrribute

What I am trying to achieve is to get the full path of the images, assigning them to the source attribute of the HTML image control. This image is placed within a Repeater Control.
Here the code:
<asp:Repeater runat="server" ID="flashImagesRepeater" >
<HeaderTemplate>
<table>
<tr id="bodyImagesTr" >
<td>
</HeaderTemplate>
<ItemTemplate>
<sc:Link ID="flashImageClickURL" runat="server" Field="Click Url" Item="<%# Container.DataItem %>" >
<img id="htmlImage" runat="server" field="Image" src="<%# MediaManager.GetMediaUrl(((ImageField)((Item)Container.DataItem).Fields["Image"]).MediaItem) %>" />
</sc:Link>
</ItemTemplate>
<FooterTemplate>
</td>
</tr>
</table>
</FooterTemplate>
Also made sure that I have the relevant namespace added <%# Import Namespace="Sitecore.Resources.Media" %> at the top.
But VS2010 gives me the error
Cannot resolve symbol 'MediaItem'
Can someone guide me as to what am I doing wrong?
May be the brackets are being being placed incorrectly?
Thanks for reading.
You definitely don't need to write anything in the code behind. It looks like for some reason one of the classes in you statement is considered as not from the one of the Sitecore namespaces. Try to use full class names with namespaces:
<img
id="htmlImage"
runat="server"
field="Image"
src="<%# Sitecore.Resources.Media.MediaManager.GetMediaUrl(((Sitecore.Data.Fields.ImageField)((Sitecore.Data.Items.Item)Container.DataItem).Fields["Image"]).MediaItem) %>"
/>
Looks like you're trying to render an image from a field in an item, just use the FieldRender control and let Sitecore handle it.
<sc:FieldRenderer runat="server" FieldName="Image" Item="<%# (Item)Container.DataItem %>" />
I think the problem you are having is that there is that ImageField is not resolving to the Sitecore image field correctly. I pasted that code into an aspx page and I got another error saying that the Field could not be cast as an ImageField. So I added the sitecore name space to the ImageField conversion and it properly intellisensed MediaItem as you wanted.
So change the image tag to this and it should work:
<img id="htmlImage" runat="server" field="Image" src="<%# MediaManager.GetMediaUrl(((Sitecore.Data.Fields.ImageField)((Item)Container.DataItem).Fields["Image"]).MediaItem) %>" />
Personally tho - I would use the Sitecore Image control to render the image, if you just want to find the media Url in back end code, the above code would work but could be written a lot more readable :)
Hope this helps!

image doesnt open in browser. Asp.net image control and imageurl set and visible in designer

I have a image control on a asp.net page and the imageurl is set. The image shows normal in the designer but doesnt open in the browser?? What can be wrong with it? What else should be set then the image url???
Help much appreciated
<form id="form1" runat="server">
<div class="style1">
<h1>A Basic Website<asp:Image ID="Image2" runat="server" Height="93px"
ImageAlign="Right" ImageUrl="~/App_LocalResources/Winter.jpg" Width="263px" />
</h1>
<img src="~/Images/mypic.jpg" alt="My Pic" runat="server" />
Use the tilda (~/) operator and the runat attribute so that the path resolves on the server side.
I also suggest not using designer view - use code view and your browser for regular design work. Try the Firefox Web Dev Toolbar.
To use the image control:
<asp:Image ID="Image1" runat="server"
ImageUrl="~/Images/ASPdotNET_logo.jpg"
AlternateText="ASP.NET Logo">
Here's a walkthrough...
Thank you sooooooo much for the help, I found the solution, I was using app_resources folder which didnt work, but when I renamed the folder it did.... so thanks for taking the time to show the way :)

How to give path for image in a master page for two sub-pages in two locations?

Hi all my work environment is asp.net c# vs2008. My issue is this, i have a master page outside.master in shared folder.Inside it i have an image control with
<img src="App_Themes/Home/images/logo.png" />
i am referring this master page from in two sub pages. One is Index.aspx which is located in the root level and Secondly registration.aspx which is under masters folder. The problem is that when i run, the index.aspx will show the logo where registration.aspx is not showing the logo. Please tell me how to specify the path so that i will get logo in both pages.
Tilde sign ~ will resolve for server side controls.
So you need to add runat="server" as img in HTML element.
Try this:
<img src="~/App_Themes/Home/images/logo.png" runat="server"/>
The most foolproof method is to have something like this
<asp:Image runat="server" id="myImage" ImageUrl='<%# Eval("imageFile") %>' />
Then in the code-behind assign the variable imageFile to something like Server.MapPath("App_Themes/Home/images/logo.png");
Try the following:
<img src="~/App_Themes/Home/images/logo.png" runat="server" />

relative url in asp.net website applications

I have an image that I want to use it's src attribute in relative format
when my website URL was http://localhost/ I used to use this code to access this image file:
<img alt="something" src="/Files/pic.png">
But now I have to add an application to my site and change my site URL to http://localhost/mysite.
Now none of my images load in this site because the path is still http://localhost/Files/pic.png not http://localhost/mysite/Files/pic.png
how can I change my root URL (/) to http://localhost/mysite/?
Thanks
Use tilde ~ in a server control to use a relative path.
<asp:Image runat="server" ID="myImage" ImageUrl="~/Files/pic.png" />
You can use ~ symbol to represent root in ASP.Net
<asp:Image ID="Image1" runat="server" ImageUrl="~/Files/pic.png"/>
#rrrr is right, that the way to do it,
<asp:Image runat="server" ID="myImage" ImageUrl="~/Files/pic.png" />
but I would use a standard html image with runat="server"
<img runat="server" src="~/YourPath/image.png">
Reason : less server side controls

ASP.NET ExpressionBuilder syntax - output AppSetting within img tag

I would like to use ASP.NET's ExpressionBuilder syntax to dynamically retrieve domain of static content from an AppSetting.
I am using the following syntax, which does not work:
<img src="<%$Appsettings:STATIC_CONTENT_DOMAIN %>/img/logo.jpg" alt="logo" width="176" height="159" />
FYI, the desired HTML output is:
<img src="http://static.myserver.com/img/logo.jpg" alt="logo" width="176" height="159" />
Please note, I cannot use <%= %> syntax because my ASPX page needs to be CompilationMode="never". (The reason I am using ExpressionBuilder syntax is that it works in no-compile pages)
Any ideas on how I can do this?
This approach worked for me (not very readable :)...
<img src="<asp:Literal runat='server' Text='<%$Appsettings:STATIC_CONTENT_DOMAIN%>'/>/img/logo.jpg" />
You might want to consider writing a custom expression builder - they're not too difficult to write. Here are some tutorials:
Express Yourself With Custom Expression Builders
Expression Builders in ASP.NET 2.0
You could have your own expression syntax such as:
<%$ MyCdnUrl: Static, '/img/logo.jpg' %>
Then you'd parse out everything after the ":" and build up the URL that you need.
I think that expression builders must be used as "property values" so you can't use them completely on their own. You'll still have to use something like <img runat="server"> or an <asp:Image> control or an <img> with the <asp:Literal> inside it.
I believe you need to use a server-side asp.net control, such as:
<asp:Image ID="MyImage" runat="server" ImageUrl="<%$Appsettings:STATIC_CONTENT_DOMAIN %>" />
I don't know if you can combine the statement with static info like you have, such as:
<asp:Image ID="MyImage" runat="server" ImageUrl="<%$Appsettings:STATIC_CONTENT_DOMAIN %>/img/logo.jpg" />
My guess would be it isn't possible, but I guess it's worth a shot. Try it out and see...

Resources