TUTORIAL : MIGX TV Gallery in Revo using phpThumbOf

☆ A M B ☆
250 Posts

Graeme Leighfield Reply #1, 13 years, 6 months ago

As some of you may or may not know, I was asking on Twitter last week for suggestions as to screen capture solutions, and I finally found one.

For a test I've made this in-depth tutorial about how to make a MIGXTV gallery for a site in revo. This tutorial covers :

Why use MIGXTV to perform actions - and there benefits to end client/administrator of site
How to create a MIGXTV and what the values mean
What the forms and grid input areas translate to
Look around a MIGXTV interface on the manager
Adding content to a template and rendering with phpThumbOf (again benefits of using it also)
Lots of cute kittens

I genuinely hope that you find this useful, and I am open to suggestions for other tutorials to make in the future, to at least help out new users to the MODX platform, and hopefully ease support threads for basic queries.

Please leave comments and like/share if you found it useful! Enjoy!

http://www.youtube.com/watch?v=dE9-oZCqy9o [ed. note: gelstudios last edited this post 13 years, 6 months ago.]

GEL STUDIOS
MODX Professional | MODX Ambassador

Website | Email | Twitter | Facebook

29 Posts

smette Reply #2, 13 years, 6 months ago

Hi Graeme!

Thank you very much for uploading this tutorial. Very usefull!

Simon [ed. note: smette last edited this post 13 years, 6 months ago.]

☆ A M B ☆
250 Posts

Graeme Leighfield Reply #3, 13 years, 6 months ago

Nice to see you are scoping out my stuff in your picture!

I got a email saying you were having a problem with the MIGX TV - i take it now you've edited your post you've got things sorted?

GEL STUDIOS
MODX Professional | MODX Ambassador

Website | Email | Twitter | Facebook

29 Posts

smette Reply #4, 13 years, 6 months ago

Yeah haha! I was having some issues earlier, but now I got things sorted out.
Except for one thing. I'm using your tutorial in a blog for a friend of mine. Now the blog posts are called from a Chunck. I pasted the code

[[!getImageList?
	&tvname=`Gallery`
	&tpl=`blog_gallery`
]]

into the chunk like this:

<div class="element">
[[!getImageList?
	&tvname=`Gallery`
	&tpl=`blog_gallery`
]]
    <div class="rostertit"><h1><a href="[[~[[+id]]]]">[[+pagetitle]]</a></h1></div>
    <div class="rostertekst"><p>[[+introtext:limit=`40`]]...</p>
<a href="[[~[[+id]]]]">Lees meer</a></div>
</div>

You can check it out here:
http://www.mostlyofficial.com/index.php?id=3

I've only uploaded an image for the Artist called: "FAISAL/BLATAN".

but the image's doensn't appear on the page where the blogpost is previewed.
It only appears when you're reading the blogpost itself after clicking it...
Any ideas perhaps?

I really apreciate your tutorial Graeme! Thanks a lot!

Simon

☆ A M B ☆
250 Posts

Graeme Leighfield Reply #5, 13 years, 6 months ago

Glad to help simon, I think you've got a bit confused with how you call the actual MIGX TV vars from inside a getImageList chunk template. Using your example above, lets say that the data-index we gave the image is called "image" (as detailed right about here http://youtu.be/dE9-oZCqy9o?t=3m20s) :

[[!getImageList?
    &tvname=`Gallery`
    &tpl=`blog_gallery`
]]

and now the chunk "blog_gallery" :

<div class="element">
    <img src="[[+image]]" />	
    <div class="rostertit"><h1><a href="[[~[[+id]]]]">[[+pagetitle]]</a></h1></div>
    <div class="rostertekst"><p>[[+introtext:limit=`40`]]...</p>
<a href="[[~[[+id]]]]">Lees meer</a></div>
</div>

GEL STUDIOS
MODX Professional | MODX Ambassador

Website | Email | Twitter | Facebook

☆ A M B ☆
250 Posts

Graeme Leighfield Reply #6, 13 years, 6 months ago

Ah I have just noticed your problem after reading further. This would then be a three step process.

getresouces call -> getimagelistcall -> renderimage

The getImageList takes an extra parameter called "docid" which basically tells it which document to look in for this TV value.

If you are calling this inside lets say a get resources call you would use this code... (lets presume now that blog_gallery outputs the image as per the code above...)

<div class="element">
[[!getImageList?
    &docid=`[[+id]]`
    &tvname=`Gallery`
    &tpl=`blog_gallery`
]]
    <div class="rostertit"><h1><a href="[[~[[+id]]]]">[[+pagetitle]]</a></h1></div>
    <div class="rostertekst"><p>[[+introtext:limit=`40`]]...</p>
<a href="[[~[[+id]]]]">Lees meer</a></div>
</div>

GEL STUDIOS
MODX Professional | MODX Ambassador

Website | Email | Twitter | Facebook

29 Posts

smette Reply #7, 13 years, 6 months ago

Alright!
That did it!

Glad you always explain what the code means and not just give the solution.
I'm learning from you wich I'm very thankful for!

Kind regards and many thanks!

Simon

☆ A M B ☆
250 Posts

Graeme Leighfield Reply #8, 13 years, 6 months ago

Quote from: smette at Mar 14, 2013, 05:15 AM

Alright!
Glad you always explain what the code means and not just give the solution.

No problem - that is after all the best way to learn!

Just trying to think of what to do for the next video now...

GEL STUDIOS
MODX Professional | MODX Ambassador

Website | Email | Twitter | Facebook

29 Posts

smette Reply #9, 13 years, 6 months ago

Quote from: gelstudios at Mar 14, 2013, 05:19 AM

Quote from: smette at Mar 14, 2013, 05:15 AM
Alright!
Glad you always explain what the code means and not just give the solution.

No problem - that is after all the best way to learn!

Just trying to think of what to do for the next video now...

Maybe you could explain how to Center a DIV with a responsive content aligned to the left.
Since responsive design is very "in" lately...

Just an idea.

Keep up the good work!
Sure I'll hear it from you wink

Simon

4 Posts

nikhildesai Reply #10, 12 years, 4 months ago

Hi, Thanks so much for this tutorial.

I have a problem, I follow the tutorial fully but when I call the snippet the gallery doesn't show up. The page is simply blank?

I will provide you with the manager login if you'd like to have a look at what I have done?