I'm currently stuck with styling in Umbraco 4.11.1.
We have separate packages for our style and our structure, so during the build process stylesheets are copied from one package to /css/ and macro scripts and master pages from another, to their respective folders. The stylesheets are detected by Umbraco, and do show up in the admin panel for the site and are applied.
However, if we try to include images in that style package and link to them from the stylesheets, we always get a 404 on our development server. I've verified that the build is placing them where we want, and it works on my local machine (using WebMatrix), so I can only assume it's something to do with the build process, but I can't figure out what the problem would be.
We've tried putting them in:
/css/ (linking to bulletpoint.png or /css/bulletpoint.png)
/css/images/ (linking to images/bulletpoint.png or /css/images/bulletpoint.png)
/images/ (linking to ../images/bulletpoint.png or /images/bulletpoint.png)
However, none have worked.
The worst case solution is that we'll upload them to somewhere else and link directly, but I'd really rather keep them within our project. Can anyone offer insight into what I might be doing wrong?
I've been using background-image: url('/css/images/image.png') as opposed to <src=/css/image/image.png>. Is that Umbraco mark-up for CSS that I wasn't aware of? I did try it but it didn't seem to work.
I've tried the other two URLs too but neither have worked. ../css/ worked on local but not on dev, I assume because it simply points straight back into the CSS folder, while ~/css/ makes it look for /css/~/css/, which obviously can't be found, although I think that is correct considering the the rules for relative URLs.
I probably should have mentioned that simple pointing my browser directly to where I expect the image to be works on my local but not on dev in the same way, so I have a feeling the problem is not to do with URL resolution, but that Umbraco somehow doesn't know about or serve the images, which again leads me to believe it is a problem with the build process, as we don't use the same process on our local copies.
On a similar note, I've discovered this morning that App_Code/SomeFunctions.cshtml also isn't found on the dev server, while it works fine on my local copy. This means that any macro scripts calling my shared functions will break. I have a feeling it is the same issue and hopefully provides a clue, but I'm still stumped.
Have just been talking on another post and somethng came to my mind - There may be an issue with the actual saving of files and images, like why does something work locally and not when deployed. If you can individually re-save say the file that calls the image, template etc one one example, then try, if it appears you have the answer.
The url/src is not really connected to Umbraco, but more the MVC part, so one of those should work, that is what makes me think that altough you can see the file, image etc, it is not completely saved, therefore does not appear.
That is just a quick thought and will think a bit more as I go.
Just wanted to thank you for your help. It turns out it was part of our build process, we had missed some post-build actions on Jenkins and weren't copying the files to our deployment folder. Probably nothing you could have guessed from your end, but I appreciate your time all the same. :)
Sometimes we are all in the position you have been in so it is nice to be able to connect to a forum where people genuinely try to help each other. We may not have all of the answers, but sometimes a general direction as to where to look can be enough.
Linking non-media images from stylesheets
Hi everyone,
I'm currently stuck with styling in Umbraco 4.11.1.
We have separate packages for our style and our structure, so during the build process stylesheets are copied from one package to /css/ and macro scripts and master pages from another, to their respective folders. The stylesheets are detected by Umbraco, and do show up in the admin panel for the site and are applied.
However, if we try to include images in that style package and link to them from the stylesheets, we always get a 404 on our development server. I've verified that the build is placing them where we want, and it works on my local machine (using WebMatrix), so I can only assume it's something to do with the build process, but I can't figure out what the problem would be.
We've tried putting them in:
However, none have worked.
The worst case solution is that we'll upload them to somewhere else and link directly, but I'd really rather keep them within our project. Can anyone offer insight into what I might be doing wrong?
Hi Michael
Im thinking this has something to do with relative urls?
In the css you are calling say background-image: <src=/css/images/image.png>, or something like that?
It may be worth trying one of two things, either ../css/ or ~/css/).
I can get this if I drag in a background image link in Visual Studio, it gives me a relative path.
Can't be 100% certain, but it will eliminate it if it is not correct.
Anyway, hope it helps
Gary
Hi Gary,
I've been using background-image: url('/css/images/image.png') as opposed to <src=/css/image/image.png>. Is that Umbraco mark-up for CSS that I wasn't aware of? I did try it but it didn't seem to work.
I've tried the other two URLs too but neither have worked. ../css/ worked on local but not on dev, I assume because it simply points straight back into the CSS folder, while ~/css/ makes it look for /css/~/css/, which obviously can't be found, although I think that is correct considering the the rules for relative URLs.
I probably should have mentioned that simple pointing my browser directly to where I expect the image to be works on my local but not on dev in the same way, so I have a feeling the problem is not to do with URL resolution, but that Umbraco somehow doesn't know about or serve the images, which again leads me to believe it is a problem with the build process, as we don't use the same process on our local copies.
On a similar note, I've discovered this morning that App_Code/SomeFunctions.cshtml also isn't found on the dev server, while it works fine on my local copy. This means that any macro scripts calling my shared functions will break. I have a feeling it is the same issue and hopefully provides a clue, but I'm still stumped.
Micheal
Have just been talking on another post and somethng came to my mind - There may be an issue with the actual saving of files and images, like why does something work locally and not when deployed. If you can individually re-save say the file that calls the image, template etc one one example, then try, if it appears you have the answer.
The url/src is not really connected to Umbraco, but more the MVC part, so one of those should work, that is what makes me think that altough you can see the file, image etc, it is not completely saved, therefore does not appear.
That is just a quick thought and will think a bit more as I go.
Regards
Gary
Hi Gary,
Just wanted to thank you for your help. It turns out it was part of our build process, we had missed some post-build actions on Jenkins and weren't copying the files to our deployment folder. Probably nothing you could have guessed from your end, but I appreciate your time all the same. :)
Hi Michael
Many thanks for your kind words.
Sometimes we are all in the position you have been in so it is nice to be able to connect to a forum where people genuinely try to help each other. We may not have all of the answers, but sometimes a general direction as to where to look can be enough.
Happy you resolved the issue
Best regards and thanks again
Gary
is working on a reply...