How to use author-selected images in a template?

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Locked
LimeJuice

How to use author-selected images in a template?

Post by LimeJuice »

Hi

Firstly, please accept my apologies if the answer to this question is well-known or seems obvious.  I'm new to CMSMS and I'm a bit stuck...

I'm aware that templates can include multiple content blocks, each with its own name, by using the {content} tag.  When an author creates or edits a page based on that template, they see separate editor areas ('slots'), one for each content block.  But, these content blocks are all for textual, HTML-like content.

* How can I specify a content block that's just for an image?

I want the author to be presented with a 'slot' which, instead of being an htmlarea or wysiwyg editor, is an image chooser.  Then, they can type in the name of their selected image for that 'slot' in the template, or even (as a luxury) browse the CMS's uploaded images to select one.

For templating reasons, this 'slot' needs to specify *just a path to an image* (e.g. for use in the 'src' attribute of an 'img' element) - not a piece of text or HTML.  Is there a tag for this purpose?  The {image} tag seems to be only for fixed images chosen at template-design time - or have I misunderstood it?

Similarly, is there I tag I can use for other non-textual assets that need to be specified by on a page-by-page basis by page authors, but handled specially by the template?  I'm thinking of multimedia files like SWFs, PDFs, MP3s or whatever?

Many thanks in advance for your help,

Richard :)
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: How to use author-selected images in a template?

Post by Dr.CSS »

I tried this using this in the template of course they will have to know the name of the image including the type eg,. .jpg or .gif unless you put it at the end then they will only be able to put that kind of image in it...

1.)

for resticting it to a certain type and just the name of the image like 'header' which like I said will have to have a .jpg on the end of it...

2.)

This *for images only shows up as *for Images Only: with a small box here.

In the box they need to put...
in line
1.) book.gif/.jpg
in line
2.) book 

This may be able to handle additional types of input such as mp3s * not tested *, I've tested the image part, it works.
LimeJuice

Re: How to use author-selected images in a template?

Post by LimeJuice »

Thanks Mark, that's a really good suggestion.  It should suffice as a workaround until "proper" image-type content blocks are available.

Cheers!  :)
WebGirl

Re: How to use author-selected images in a template?

Post by WebGirl »

Hi there,

I had no idea how to do this either, so I just created a new {content} block called {content block="Image for top of page" }, so the website owner could add a different image at the top of each new page.

This works fine, except that the physical size of the block for {content block="Image for top of page" } is huge.

Question 1 : is there any way to alter the SIZE of the block which appears?

I set up a third block to show the new NAME of the page as well, and also ended up with a huge block on the edit screen {content block="Page name to right of image" }.

Question 2 : is there a better way to do this, or is what I've done ok?

My only concern is that the website owner will be presented with 3 huge text blocks - and yes, I am giving them a written manual with lots of snapshots to make it easy, I just thought aesthetically it would be nice to make the 'input' screen a bit 'tidier'.

Cheers
WebGirl
KoalaBlue
Forum Members
Forum Members
Posts: 39
Joined: Tue Sep 12, 2006 4:23 am

Re: How to use author-selected images in a template?

Post by KoalaBlue »

About the additional content areas, I read elsewhere on the forum where you can do this

{content block="thirdblocktitle" oneline="true" wysiwyg="false"}

'oneline' means don't show a whole Content Block on the screen, just one line to fill in.

wysiwyg 'false' means no need to show the FCKeditor - you can do all your styling in the stylesheet and template.
KoalaBlue
Forum Members
Forum Members
Posts: 39
Joined: Tue Sep 12, 2006 4:23 am

Re: How to use author-selected images in a template? GREAT SOLUTION!

Post by KoalaBlue »

Mark - I just used your suggestion in a piece of javascript, and it worked!  fantastic, mate!
2.)
Locked

Return to “Layout and Design (CSS & HTML)”