+1-888-365-2779
Try Now
More in this section

Forums / Designing with Sitefinity / Path to theme images

Path to theme images

3 posts, 0 answered
  1. Roger Salomonsson
    Roger Salomonsson avatar
    5 posts
    Registered:
    21 Oct 2004
    31 Mar 2009
    Link to this post
    Hi there,

    How can i address an image that resides in a theme folder, in a Generic Content or Image control on a Sitefinity page (i.e. not a master page or an external aspx page)?

    If i use the Image control and an ImageUrl like "~/Image/Icon.png" it just renders a "<img src='Images/Icon.png >" instead of <img src='App_Theme/<Theme>/Images/Icon.png>.

    If i on the other hand use an ImageUrl of just "Image/Icon.png" it renders a "<img src='App_Master/Images/Icon.png >"

    If i use a Generic Content control and an <img> tag, i suppose i have to hardcode the path to my theme (which is not nice)?

    I can't find a way to use theme images on a page. It works properly on my master page and my external aspx pages. Am i missing something?
    Using Sitefinity v3.5.

    Regards,
    Roger


  2. SelAromDotNet
    SelAromDotNet avatar
    912 posts
    Registered:
    18 Jul 2012
    02 Apr 2009
    Link to this post
    the image control that you drop onto a page references an image directly by url, so in order to reference a theme image, you'd have to include the full url to the image for a specific theme such as

    ImageUrl = "~/App_Themes/MyTheme/Images/myImage.jpg" 

    this is especially true for generic content, because this renders just plain html, and so the img tag has to reference the url directly as well...

    however, for the Image control for pages, you may be able to try a workaround... If you make a Skin file in each theme folder, you can then set the SkinID for the image (instead of the imageurl) and the Skin file will tell the image which age to load!

    For example, lets say you have two themes, Theme1 and Theme2, and in each theme you have an image hello.jpg. In Theme1 hello.jpg might be yellow, in Theme2 hello.jpg is blue.

    make the Image.Skin file inside Theme1. define an image with a specific skin and url for the yellow image:

    <asp:Image SkinID="Hello" runat="server" ImageUrl="hello.jpg" /> 


    then make the Image.Skin file inside of Theme2 folder. you can define the blue image the same way:

    <asp:Image SkinID="Hello" runat="server" ImageUrl="hello.jpg" /> 


    Now just define the SkinID="Hello" for the Image control that you drop on the page (It's under the Advanced Tab when you edit the properties).

    Since the site is using Themes, the ImageControl will load the skin file for the CURRENT Theme that is assigned to the page, and therefore load the image for THAT theme!

    I hope this makes sense! here is an article with more information about skins and themes: http://www.codeguru.com/vb/vb_internet/aspnet/article.php/c7937__4/

    let me know if this works for you, or if you have any questions I'll do my best to help!
  3. Roger Salomonsson
    Roger Salomonsson avatar
    5 posts
    Registered:
    21 Oct 2004
    02 Apr 2009
    Link to this post
    Great answer! Thanks a lot.

    Regards,
    Roger
Register for webinar
3 posts, 0 answered