Forums Ultimate UI for ASP.NET Web Forms
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Yogesh Shah
580
How to define custome location of CSS & Images folder in WHDG?
posted

Hi,

We are using WHDG 2013. In our project, we have two different folders, 'CSS' & 'Images'. We want to add all the WHDG related CSS into the 'CSS' folder and all images related to WHDG into 'Images' folder.

Can you pls. tell us, how we can define the 'CSS' & 'Images' folder path to WHDG?

We have tried to include all the CSS files just above the WHDG and give the specific Image URL path, i.e. AscendingImageUrl, DescendingImageUrl, ImageUrl for AJAXIndicator. Somewhat we have achieved but 'expansion/collapsible button' image not getting displays and when we tries to export data into 'Excel' (Excel Exporter) or 'PDF' (Document Exporter) then we are getting disturbed UI even though we have set the 'EnableStylesExport' true.

If we add all the 'CSS' files and 'Images' folder inside 'ig_res\Default\' folders at root level of the project then UI on the Web Page and Export functionality working fine.

Thanks & Regards,

Yogesh Shah

  • 20255
    Offline posted

    Hello,

    I'm just checking do you need any further assistance on this.

  • 20255
    Verified Answer
    Offline posted

    Hello Yogesh,

     Thank you for the question.

     The IG controls have ig_res folder that contains all styles. In each style there is a reference pointing to specific image to use, like:

    .ighg_IGColumnGroupingTopDragIndicator
    {
        background-repeat:no-repeat;
        background-image: url(images/ighg_TopDragIndicator.gif);
        width: 5px;
        height: 3px;
        z-index: 100;
    }

     The infragistics.web tag does not currently have a property to set the path for the images folder separately. You can control where the styleSets are loaded from, by setting the StyleSet path in the Web.Config through the css and images are meant to be in the structure where the images folder is a child of the styleset folder. This styleset is meant to be used as a whole, there are some image paths that are used within the controls that use paths based on the stylesheet path.

     My suggestion is, if you want to use different style (custom style), use NetAdvantage AppStylist for ASP.NET. With this handful tool you can design CSS changes to a class and watch those changes be applied at the same time, and many other things.

     Useful reference:

    Getting to Know NetAdvantage AppStylist for ASP.NET

    ASP.NET AppStyling Getting Started (video tutorial)

     After you are done with your custom style just use Infragistics Application Styling Configuration Tool to add libraries of consistently themed CSS files and graphic images to your project/web site.

     Useful references:

    CSS File Structure
    Which are my CSS files?
    WebDataGrid CSS styling guide
    Enabling Application Styling Using the web.config File

     If you have any further questions, please do not hesitate to contact me!