can i call a page field inside a css file - Templates and document types

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Evan 344 posts 99 karma points

Jul 08, 2009 @ 17:13

0

Can I call a Page Field Inside a CSS File?

For instance can I have an upload field and (as long as the file is the right size) have it be the background of a DIV in one of my stylesheets? Is this possible?

Copy Link
Sebastiaan Janssen 5060 posts 15522 karma points MVP admin hq

Jul 08, 2009 @ 17:18
3
You could just write some CSS in the page:
```
<style>
#item {
 background-url: <xsl:value-of select="background" />
}
</style>
```
By default I don't think it is possible to do this in the CSS file itself.
Copy Link
Sebastiaan Janssen 5060 posts 15522 karma points MVP admin hq

Jul 08, 2009 @ 17:19

1

Sorry, not in the page, but the XSLT.

Why is there still no "edit" button in the forum?

Copy Link
Evan 344 posts 99 karma points

Jul 08, 2009 @ 17:19

0

Ok I am not a fan of inline CSS, not a big deal if it can not be done, just an idea. Didn't think it could work...

Copy Link
Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib

Jul 08, 2009 @ 17:20
2
Well the simpliest way is that you could have an inline stylesheet in your head section is the easiest way but not the nicest code.

For example
```
<style>
div#MyBackground
{
background:url(<umbraco:item field="youUploadField" runat="server"></umbraco:item>) no-repeat top left;
}
</style>
```
Kenny who I work with at Xeed has done a solution to this before where the image is in the CSS file but he is currently on holiday, but I will try to remember to ask him when he is back.
Copy Link
Warren Buckley 2106 posts 4836 karma points MVP 7x admin c-trib

Jul 08, 2009 @ 17:22

0

Seems like alot of us working on this at the same time ;)

Copy Link
Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib

Jul 08, 2009 @ 17:25
0
I think that will require that you somehow make a documenttype with a template in, which the template acts as a css file.

Then you would have to reference the dynamically created CSS file in your master-template to make use of it.

I think that it should be possible.

I would do the following

1: Create a document type and a template called stylesheet in the Settings section

2: In the content section define a placeholder (an empty document type) called "stylesheets"

3: Define my stylesheet and like this
```
div#randomUploadImage{
```
```
background: url('place the path to the image here fetching it with eithr XSLT or just using an umbraco page field') top left no-repeat;
```
```
width: 100px;
```
```
height: 100px;
```
```
}
```
3: Under the "Stylesheets" placeholder I would create my stylesheet and publish it

4: Then either make a XSLT macro to retrieve the image, which should be inserted into the stylesheet in the url().

5: Reference the stylesheet in the <head> of my master template

Please let me know if it is working out.
Copy Link
dandrayne 1138 posts 2262 karma points

Jul 08, 2009 @ 17:54

0

Seems a bit hacky, making the content tree messier, another http request and potentially open to breakage from editors just to avoid a single inline style. +1 for sebastien and warren's solutions!

I'm not usually a fan of inline styles either, but sometimes they are the lesser of two evils.

Copy Link
Jan Skovgaard 11280 posts 23678 karma points MVP 11x admin c-trib

Jul 08, 2009 @ 18:49

0

The intention is that it should be made in a sperate tree so you have a structure like the following:

Content

- Homepage

   - Subpage 1

   - Subpage 2

- Settings

   - Stylesheets

    - Stylesheet

Under settings it is intended to make a stylesheets folder where you can create the stylesheet. I can't see what is messy about that to be honest. Content editors should off course not have access to the settings part.

I know that it seems like a lot of work to avoid a single inline stylesheet but what if suddenly you need to generate more stylesheet declarations than just one?

If people are using the compression package, which is made by Peter, I guess that it would all be wrapped into one single file and then I can't really see the problem :)

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?

Can I call a Page Field Inside a CSS File?