We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
MODX Community Forums Archive

gallery installed, album created, now what?

    • 29517
    • 40 Posts
    terobot Reply #11, 13 years, 7 months ago
    Quote from: rixe at Sep 23, 2010, 03:39 PM

    terobot, would you show me your whole snippet call?

    Rixe, I tried a couple of methods of calling the snippet. In the first instance, I simply pasted the code from GalleryExample1 in the Wiki into my resource which I’ve shown below. 

    [[!Gallery? &toPlaceholder=`gallery`]]
[[!GalleryItem]]
[[!GalleryAlbums? &toPlaceholder=`galleries`]]

<div style="float: right">
<h2>Galleries</h2>
<ul>
[[+galleries]]
</ul>
</div>

<h2>Item</h2>

[[!+galitem.image:notempty=`
<div class="image">
  <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a>
  <br />Albums: [[+galitem.albums]]
  <br />Tags: [[+galitem.tags]]
</div>
`]]


<hr />

[[!+gallery:notempty=`
<h1><a href="[[~[[*id]]]]">[[+gallery.name]]</a></h1>
<h2>[[+gallery.description]]</h2>

[[+gallery]]
`]]


    I have two albums loaded. One called Photoshoot and another called Test. Now when I visit the page where the above snippet has been pasted in http://www.highondance.com.au/index.php?id=13 I see no thumbnails. Presumably, I’m meant to see two thumbnails - one for each album? But when I specify the album ID in the URL http://www.highondance.com.au/index.php?id=13&galAlbum=2 then the gallery works fine for that album - thumbnails appear with their enlarged images.

    So I decided to work with a bare bones version of the snippet calls and created a new resource http://www.highondance.com.au/index.php?id=21 which only contains the following:
    [[!Gallery? &album=`photoshoot`]]
[[!GalleryAlbums?]]
[[!GalleryItem]]


<div style="clear:both;"></div>


    The aim here was simply just to get my Photoshoot album appearing with their thumbs and enlarged images. Thumbnails appear but lead nowhere. So basically, here’s my problem... I’d like to have a standard gallery setup, ie. Main Gallery Page>Albums>List of Image Thumbs>Click to enlarge. If I use GalleryExample1, I get nothing on the main gallery page but the rest of it (Albums>List of Image Thumbs>Click to enlarge ) works ok. If I use the basic snippet call above, I can’t even get the image thumbs to enlarge, let alone set up a main gallery page with a list of Albums.

    Once I get this working, I’ll start on the lightbox smiley






      Creative Director - Throwstone Web Design Melbourne
      • 10076
      • 1,024 Posts
      Frank Reply #12, 13 years, 7 months ago
      Hi guys,

      maybe one of you could create a step by step tutorial?
      And share it with the rest of us?

      Frank.
        • 25876
        • 79 Posts
        s1Mon Reply #13, 13 years, 7 months ago
        rixe - thank you very much, that worked perfectly. great!

        now I’ll continue and work on the details; can anyone think of a way how to best (i.e., most simple) implement a gallery per resource? Say, I do have certain projects (each project is represented at one resource page, featuring some text details but also images), and if I want to add a new project, I’d just have to duplicate an old resource and change the text and pictures. Connecting the gallery-name with the resource-name or something? Hmm ...
          • 25141
          • 49 Posts
          rixe Reply #14, 13 years, 7 months ago
          Terobot, as I’m by no means an expert on Gallery I can’t really say for sure what’s going on with your galleries ...
          Are you using Friendly Urls?
          And what happens when you kind of mix both calls like this:
          [[!Gallery? &album=`photoshoot`]]
[[!GalleryItem]]

[[!+galitem.image:notempty=`
<div class="image">
  <a href="[[+galitem.image]]"><img class="[[+galitem.imgCls]]" src="[[+galitem.image]]" alt="[[+galitem.name]]" /></a>
  <br />Albums: [[+galitem.albums]]
  <br />Tags: [[+galitem.tags]]
</div>
`]]


          s1mon, you’re welcome, glad it worked for you, too. I’m looking into the details as well, not sure yet what could be the easiest way - have you checked out using tags? That’s probably what I’ll be trying out. My goal was actually to get something like this working: www.sodelikat.de/website/arbeiten/ where clicking on the tags hides / displays certain images but we’ll see if I get there ...
          Good luck!
            • 29517
            • 40 Posts
            terobot Reply #15, 13 years, 7 months ago
            Thanks Rixe. The code you gave me worked well. So now I can display the thumbnails from one album and enlarge the images. But any idea how I create a gallery of albums? I’ve tried pasting [[!GalleryAlbums]] in various places but to no avail.
              Creative Director - Throwstone Web Design Melbourne
              • 20178
              • 82 Posts
              monsterwatt Reply #16, 13 years, 5 months ago
              i am also struggling with this was have been trying to do the following solution i think i’m almost there....

              within the dynamic gallery component create a new gallery called ’gallery1’ - upload some pics.

              create a resource called Main gallery

              within that page create another resource....

              give that resource/gallery the title ’gallery1’ - Add a Gallery template Variable called ’Gallery Logo Thumb’ and select a thumbnail from the gallery you have created in the gallery component.


              - now within the Main Gallery(ID-25) - the one above ’gallery one’ - use the following get resource call:

              [[!getResources?
              &parents=`25`
              &tpl=`galthumb`
              &includeTVs=`1`
              &processTVs=`1`
              ]]


              Also create a new chunk with the following code,

              <p>[[+tv.Gallery Logo Thumb]]</p>

              This will place the thumnail from the sub galleries on the gallery page,

              now i just need to call the gallery album with the same name...

              <p>[[+tv.Gallery Logo Thumb]]<a href="[[!Gallery? &album=`[[+pagetitle]]`]]"</a></p>

              but the above doesnt work and loads everything, just need to say on click of the gallery thumb load the corresponding gallery....


                • 36933
                • 35 Posts
                bradelaide Reply #17, 13 years, 5 months ago
                Hey Monster,

                I think I can help you here although I am also struggling with some parts of Gallery.

                So let me get this straight, you want;

                One page (resource) to list all your galleries (child resources) in the form of a thumbnail which when clicked takes you to the gallery page?

                Ok, so it looks like you have created all the resources, it is just not taking you to the resource when you click the thumbnail. I have done it a bit different and used wayfinder. So on my Main resource listing the galleries I have 

                
<h2>Below are some Galleries</h2>
[[!Wayfinder? &startId=`9` &level=`1` &rowTpl=`galleryRow`]]


                My main resource listing the galleries is 9, then I have a chunk called galleryRow for the rowTpl which wayfinder is looking for:

                <li[[+wf.id]][[+wf.classes]]><a name="brad" href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+Gallery]]<br/>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>


                As long as you create a resource for each gallery, as a child to the main wayfinder will list it.

                This is working fine for me, so I hope this helps you out.

                Brad