More in this section

Forums / 3.x Pre-release forums (retired) / Setting Background & Colors

Setting Background & Colors

5 posts, 0 answered
  1. Ben Alexandra
    Ben Alexandra avatar
    215 posts
    15 Sep 2012
    26 Apr 2007
    Link to this post

    I have a site in development ( that has 2 unique features.  1 is a different background image per page, the other is a Hex color that matches that background and sets the color for the page title, the selected tab on the left, the faded lines, etc.

    I solved this by creating a UserControl with 2 public properites ("Page_Image" & "Page_Color").  This is dropped onto every page and the user then types in a image name, such as "homepage.jpg" or "about_us.jpg" and selects a hex color from that image to be the color for titles on the page (e.g. "#6f250d").

    The UserControl then generates the following text on the page which calls the image and colors:

    <style type="text/css">  
      body {  
         background: transparent url(/images/template/top_banners/Action2.jpg) no-repeat;  
      #ctl00_PageTitle1 {  
         color: #294F96  
    .RadPanelbar_Weleda .rootGroup .text           { background-color: #294F96; }  
    .RadPanelbar_Weleda .rootGroup .selected .text { color: #294F96; }  
    .RadPanelbar_Weleda .group .selected .text     { color: #294F96; }  
    .MenuBottom                                    { background: #294F96 url(/images/template/fade.png) no-repeat 0 top; }  

    Now comes my question...

    This works really well, but... is this the right way to handle such a thing?  Could those 2 properties be set elsewhere, like on Properties page of the page edit? If so, how?

    Now comes my follow-up question...

    I want to generate images of the page titles based on Page Name in SF.  I have access to the Title via the SiteMap object, but is there a way to get access to Sitefinity's Page Name in code?  Where would I find instructions on that?  I have all the code to do generate the images on the fly, just need to be able to pull the

    Here's how I'm doing it.

        SiteMapNode smn1 = SiteMap.CurrentNode;  
        string hash = MD5_ComputeHexaHash(smn1.Url);  
        string path = "~/images/template/page_titles/";  
        string url = String.Format("{0}{1}.gif", path, hash);  
        string fileName = Server.MapPath(url);  
        if (!File.Exists(fileName))  
            // Create the file here...  
            Bitmap objBMP = new Bitmap(490, 30);  
            Graphics objGraphics = Graphics.FromImage(objBMP);  
            Font objFont = new Font("Arial", 16, FontStyle.Bold);  
            objGraphics.DrawString(smn1.Title, objFont, Brushes.Black, 0, 4);  
            objBMP.Save(fileName, ImageFormat.Gif);  
        imgPageTitle.ImageUrl = url

    I'll replace the Brush.Black with the color for the page (as listed above), but would also like to replace "SiteMapNode smn1 = SiteMap.CurrentNode;" with Telerik.CMS.SiteMap.CurrentNode or whatever the code i should use would be.

    Thanks for your help.  This is looking great!

  2. Nikolay
    Nikolay avatar
    21 posts
    24 Feb 2016
    27 Apr 2007
    Link to this post
    Hi Ben,
    We need to clear what exactly  you mean. Do you want to change the background and some colors in the admin screens for every different page - for example Page Properties screen, Page Permissions screen, etc. Or, you you have some issues with the look of your pages in the Page editor screen?
    However, we will review your code and answer more clearly next week.

    the telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. bnye
    bnye avatar
    332 posts
    22 Sep 2005
    28 Apr 2007
    Link to this post
    Nice images. Stylish site.
  4. Ben Alexandra
    Ben Alexandra avatar
    215 posts
    15 Sep 2012
    28 Apr 2007
    Link to this post
    Thank you, Ben!  It's starting to come together.  Should be even nicer in a few weeks.

    Nike, to answer your question a bit more clearly:

    No, the user control isn't for the admin section, it's for the pages rendered to the public.  Basically I had the dilemma of the client wanting a different background image (you can see some examples already) on each page, and they wanted the titles (not done yet) and the left nav colors to match the top image.

    Not knowing the best way to solve it, I came up with my own solution: Create a custom UserControl that has 2 public properties, an image name & a hex color.

    To implement this, the users drag the "Set_Background" user control onto each page, click edit and type in an image name (knowing the images in a given folder) and a hex color (related to the image).

    When the page renders, the CSS (first post) is written onto the page, so the visitor sees the correct image and the correct colors.

    My question is, is this the most efficient/"proper" way to solve this problem?  Also, do you have ways that the selection of the image could be a drop-down, instead of a text box?  If so, do you have documentation on that?

    Thanks for any feedback

  5. Bob
    Bob avatar
    330 posts
    30 Dec 2016
    07 May 2007
    Link to this post
    Hi Ben Alexandra,

    Actually, this is the only way to achieve this and you came up with a very nice solution.

    Unfortunately, the only way to make a property show as DropDownList is to make it enum type. We will improve the property editor and give you such ability in version 3.1.

    You can also crate a control implementing IWebUITypeEditor interface and specify that control as type editor for your Image property marking it with WebEditorAttribute.

    Kind regards,
    the telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Register for webinar
5 posts, 0 answered