ExpressionEngine - Silent Video Series 1

April 5th, 2009 in ExpressionEngine | 9 comments

Demo video using FF Matrix and nGen File Field in ExpressionEngine. Also showing the power of TinyBrowser in content area with TinyMCE.

Example Usage

Many people are asking how to use this technique in order to generate a proper code rather then serialized array output which is its raw format. So taking the example setup in the video, using below code in a template will create html meta tags for you.

{exp:weblog:entries  weblog="weblog" limit="1"}

{meta}

<meta name="keywords" content="{meta_keywords}" />
<meta name="description" content="{meta_description}" />

{/meta}

{/exp:weblog:entries}

Next example will show you how to put those images in an unordered list form

{exp:weblog:entries  weblog="weblog" limit="1"}

<ul>

{image}

 <li>
  <img src="{image_location}" alt="{image_description}" />
 </li>

{/image}

</ul>

{/exp:weblog:entries}

Hope those examples will give a kick start to understand how to apply FF Matrix and nGen File Field in ExpressionEngine.

email | follow | peak

Cem Meric

Cem runs a creative web design and development studio called Webunder, specialising in ExpressionEngine CMS and he is an active member of the ExpressionEngine forums.

When he's not working, he enjoys being a hero with friends.

Comments

Hey Cem, great screencast. Brilliant use of the Data Matrix fieldtype. I just had a quick question about the workflow you are demonstrating. I was wondering what the purpose of having the Data Matrix for uploading the images, versus say just using the tinybrowser file upload functionality?

said Ryan Blaind about 11 months, 1 week ago

Good question Ryan, sometimes you need to lock image(s) per entry and call them for various reasons.

For instance, creating relations gives me option to use them in a gallery format e.g. http://is.gd/rdPi

Plus I still prefer weblog entries for assets or using ExpressionEngine native upload function.

What I would like to see with nGen File Field is though, 1.allowing files on server to be selected rather then only upload new files and 2.respecting native image resizing rules not just file size

said Cem Meric about 11 months, 1 week ago

Cool, thanks for replying. So once a content editor uploads several images over the span of several entries, when they go to place them inside the tinymce editor, will it show all of the images uploaded for all entries, or specifically only the images uploaded with that one specific entry?

Also, are you using the LG TinyMCE extension? How difficult was it to impliment the Tinybrowser plugin with that?

said Ryan Blaind about 11 months, 1 week ago

Accessing uploaded images from Tinybrowser will show all of the images. You can’t lock user to selective files however what you can do is to create tinymce_image_list.js for TinyMCE and apply some restrictions based on member group etc. See my post http://is.gd/reSD on this.

Yes, LG TinyMCE is one of many extensions I use with every setup.

Wil wrote a great article about how to implement Tinybrowser http://is.gd/o8mU. It’s on my most used list as well. Overall implementation is very easy.

said Cem Meric about 11 months, 1 week ago

Thanks Cem for this tutorial. For some reason I can’t get the tag pair to output anything.

The single tag outputs the matrix table with all the inside fields but I can’t get the single to work for some reason.

{fa-client-1-docs}
<li>{fa-client-1-title}</li>
{/fa-client-1-docs}

said Jim Woodman about 10 months, 4 weeks ago

Hi Jim, did you get this sorted with Fred’s comments in the forums

said Cem Meric about 10 months, 3 weeks ago

Yes, thanks. Just a stupid mistake on my part.

said Jim Woodman about 10 months, 3 weeks ago

Cem, thanks for the screencast. We are just starting out with EE and I noticed some interesting extensions (i.e. wysiwyg, workflow, developer).

Could you let us know what extensions you use and if they are available - it would help us greatly. Thanks!

Jorge

said Jorge Molina about 10 months, 2 weeks ago

I’m glad yo liked it Jorge.

Those extensions are LG TinyMCE, NSM Publish Plus (commercial ), SL Developer Info.

I plan to do another screencast covering basic installation steps such as maintaining an add on library, activating essential add ons and creating a database backup for future projects.

I think this will be a great time saver for all of us.

So, stay tuned!

said Cem Meric about 10 months, 2 weeks ago

Add Your Comment

Commenting is not available in this entry.

Latest from Twitter

@anduiza I never tell them..

Cem said on
Wed, 10th Mar 2010