Custom Skin CSS Images Not Showing

8 posts, 1 answers
  1. Robert
    Robert avatar
    58 posts
    Member since:
    Dec 2008

    Posted 02 Nov 2009 Link to this post

    Hello,

    I'm trying out the Style Builder with a skin we created in May.  I've uploaded the zip with the path setup as illustrated, css file in the root with the images in a folder.  To test it out I started with a single grid css file named "Grid.Default.css" that we edited in May and the related images in a directory named "Grid".  In the colorize tab I get a message that says "Image not available. sorry"  In the Fine-tune tab I see the grid but its completely void of any images except the pencil and trash can icons. 

    It looks like there is a problem with any images loaded through the CSS.  The pencil and trashcan images named "delete.gif" and "edit.gif" are not referenced in any of the CSS files therefore must be be called elsewhere.  I've checked the path in the CSS file and it's correct: "Grid\sprite.gif"

    The skin was created with Q12009.  Any idea why the images aren't showing up?

    Bob
  2. Robert
    Robert avatar
    58 posts
    Member since:
    Dec 2008

    Posted 02 Nov 2009 Link to this post

    The problem appears to be with the zip files I'm creating.  I simply opened the Zip file created by Style Builder and extracted the contents to a new folder then rezipped it into a new zip file and found that Style Builder does not recoginze the files.

    Is there a known issue with zip files?

    Bob
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2500 posts

    Posted 04 Nov 2009 Link to this post

    Hi Robert,

    The skin archive should be called like the name of the skin, i.e. Default.zip. Other than that - we are not aware of any problems. If that is not the case, could you please send the problematic zip?

    Greetings,
    Alex
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  5. Robert
    Robert avatar
    58 posts
    Member since:
    Dec 2008

    Posted 04 Nov 2009 Link to this post

    Hi Alex,

    Thank you for getting back to me on this.

    I've tried this on two machines with no success.

    I created a quick window skin using the skin builder and downloaded the zip file.  The file works fine when I load it back into the style builder.  However, if I unzip that file first then rezip and attempt to uplaod the images don't show up.

    I've attached both zip files here:
    1) bobtest.zip (this is the simple window skin I created with the style builder, it loads back in without a problem)
    2) bobtestrezipped.zip (this is the zip I made simply by unzipping the first one and rezipping it, this file is not loading the images)

    I've also tried renaming the 2nd file to "window.zip" as you suggest but it made no difference.  Furthermore the 1st file named bobtest.zip loads in fine with that naming convention.

    Any help would be greatly appreciated as I'm at a loss trying to figure out why it won't load even a simple unzipped and rezipped file.  Hopefully its something simple.

    Note:  How do I attach a zip file?  The attach file only allows for gif, jpg, jpeg, and png.

    Thanks,
    Bob
  6. Answer
    Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2500 posts

    Posted 05 Nov 2009 Link to this post

    Hello Robert,

    You should name the second file bobtest.zip and it should load fine.

    Kind regards,
    Alex
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  7. Robert
    Robert avatar
    58 posts
    Member since:
    Dec 2008

    Posted 05 Nov 2009 Link to this post

    Hi Alex,

    OK, I updated the names following your suggestion and its working.

    Using just the skin for the Window component as a test for our custom skin I've replaced the "default.gif" file with an updated image to represent the skin we adjusted it previously.  When I load it in and edit the shift colors in the Colorize tab I see my skin image as a base for which to adjust.  Cool.

    A couple of questions:

    1) In Fine Tune when I click on the "close hover" I cannot see the hover state, should I be seeing the hover in the example?

    2) Any change to the color of the title text isn't reflected in the example above, I'm not sure why I don't see the change.

    3) Using the shift colors in the Colorize tab also changes the window icon, usually to a strange neon pink or green.  My guess is the solution would be to adjust the colors as desired then save the skin, download and lastly edit the icon in the sprite file manually in Photoshop.  Perhaps there really isn’t any other way around it without separating the icon image from the sprite file.

    Overall the tool is effective however I'm going to guess that I'll run into problems with other components that we've skinned because we found it necessary to edit and add styles to tweak the skin.  How will the Style builder react to style sheets that have additional styles added or if a style has been removed?

    Thanks,
    Bob

  8. Alex Gyoshev
    Admin
    Alex Gyoshev avatar
    2500 posts

    Posted 05 Nov 2009 Link to this post

    Hello Robert,

    Glad it worked.

    Regarding your questions:
    1. the hovered icons are nowhere in the page, indeed. I just got an idea of how they can be visualized - I'll try to add it next week.

    2. That's probably a bug. I'll look into it.

    3. Indeed, there are no capabilities for "exploding" the sprite and colorizing only the desired parts of it. It's a lot of effort, yet it's in the backlog - I hope that we'll get to it at some point.

    The tool should be able to handle such files - though it depends on the case.

    The biggest benefit from the tool is when you make small tweaks - it's by no means better than a hand-coded stylesheet, but in most cases, it does the trick.

    Greetings,
    Alex
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  9. Robert
    Robert avatar
    58 posts
    Member since:
    Dec 2008

    Posted 05 Nov 2009 Link to this post

    Hi Alex,

    I think the tool is very helpful and I wish it was available when we created our custom skin last Spring as it can be a bit time consuming trying to figure out exactly which styles do what.  In the future it will be much easier to start with the Style Buiilder and then tweak manually most imporatantly the process should save a lot of time.

    Keep up the good work and thanks again.

    Regards,
    Bob
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017