smd_gallery: super-flexible gallery generator

pullober · 2009-07-15 17:45:45

i am desperate! maybe i should stick to graphic design, i can not find the error! i’m trying to create a automatically starting slideshow and whatever plugin i have tried, it didn’t work. noch i’m back – using smd_gallery.

after no javascript slideshow is working – it is maybe something easy to find out.

the categorized images should automatically display and loop:
qarante/beta

do you see anything suspicious?

the txp tag
<txp:smd_gallery category="test" form="gallery" />
should output the images.

my gallery form looks like this:

<div class="slideshow" id="slideshow1"> <img src="<txp:site_url />images/{id#1}.jpg" alt="{alt#1}" width="{width#1}" height="{height#1}" /> </div> <script type="text/javascript"> myShow1 = new slideshow("slideshow1", { hu: "<txp:site_url />images/", images: [{imglist}], captions: [{alt}], classes: ["prev","next","active"], type: "fade" }); </script>

am i doing this right?

thank you for any help in advance, stefan.

in the end – it should look like this:

qarante

Last edited by pullober (2009-07-15 17:48:50)

Bloke · 2009-07-15 19:44:52

pullober wrote:

do you see anything suspicious?

Not suspicious, but you do need to think about how the slideshow is made up. Most slideshow scripts need one list of images to be given to them in one go. To do this you must use the collate attribute in smd_gallery. This collates (collects) all images in the categories you give into a big long list and then calls the form once at the end. Without collate it calls the form once per image in the categories.

Thus, your gallery Form is currently outputting:

<div class="slideshow" id="slideshow1">
 <img src="<txp:site_url />images/{id#1}.jpg"...
</div>
<script type="text/javascript">
  ...
</script>

<div class="slideshow" id="slideshow1">
 <img src="<txp:site_url />images/{id#1}.jpg"...
</div>
<script type="text/javascript">
  ...
</script>

<div class="slideshow" id="slideshow1">
 <img src="<txp:site_url />images/{id#1}.jpg"...
</div>
<script type="text/javascript">
  ...
</script>

........

That is invalid HTML because you have the same id multiple times on the page. It also duplicates the javascript, which destroys any chance of making the slideshow work. Look at Example 4 in the plugin help. That will get you on the right road.

tye · 2009-07-16 04:03:06

Hey Bloke – thanks for the reply :)

I couldn’t get it to work though :( – probably me being stupid… rather than post what a mess I came up with, I thought its best to post what I had originally. There are 2 forms, one for thumb images, one for text –

Here is my form for the text

{grouptagstart}
<a rel="shadowbox[{category}]"  href="{url}">{onchange:category}</a>
{grouptagend}

And here is how I am calling it:

<txp:smd_gallery category="formal" sublevel="all" form="trt-gallerytxt" wraptag="ul" break="li"  class="subnav" thumblimit="1" />

Here is the form for the images – this is working with a div wraptag – but I would like to use a li if possible:

<div class="trtholder">
{grouptagstart}
<a rel="shadowbox[{category}]"  href="{url}">{object}
</a>
{grouptagend}
<br /><em>{onchange:category}</em>
</div>

And here is how I am calling it.

<txp:smd_gallery category="formal" sublevel="all" form="trt-gallery" thumblimit="1" onchange="category" wraptag="div" class="trtgallery" />

When using the countform method, I just ended up with one piece of text or image :(

pullober · 2009-07-16 15:04:34

finally! no errors, a more complete installation of slideshow.js and it still doesn’t start automatically!

there must be some kind of minimal error, which i can not locate!

beta

please have a look at my resource code!

thanks in advance for every hint.

have a nice day, stefan.

decoderltd · 2009-07-21 12:09:55

Hi all,

I’m using smd_gallery to show project images related to articles, the plug-in uses the article image field to determine the correct images to show. However, some articles don’t have an image so I’d like to tell the plug-in to use images if the article image field has content, else use a generic image.

As far as I can see this is not possible using the plug-in as is, so I installed smd_if. My code is as follows, but I can’t get it to work correctly – Can anyone help?

<txp:smd_if field="{thisid}"
     operator="isused">

<txp:smd_gallery id="?article_image" wraptag="div" html_id="fade" class="pics">
<txp:image id="{id}" />
</txp:smd_gallery>

<txp:else />

    <txp:image id="11" />

</txp:smd_if>

Bloke · 2009-07-21 12:22:30

decoderltd

So close! Try:

<txp:smd_if field="thisid" operator="isused">
...

The {} syntax isn’t used in the field attribute natively — only if you are embedding smd_if inside smd_gallery can you do that kind of thing :-)

Last edited by Bloke (2009-07-21 12:22:53)

decoderltd · 2009-07-21 13:22:08

Great, thanks for your quick reply Stef.

One more question, my <txp:else /> statement doesn’t seem to be working properly as it’s only displaying a blank image – it’s the correct size, just nothing is appearing so it seems to be some kind of rendering issue. Any ideas what it could be?

Bloke · 2009-07-21 13:24:37

decoderltd wrote:

… only displaying a blank image – it’s the correct size, just nothing is appearing

Weird. Without seeing the page I can’t really think why. Does the HTML source give you any clues?

decoderltd · 2009-07-21 14:18:54

Hi Stef,

Not really, it just confirms that nothing’s there –

<div id="content">                   
          <div id="feature_panel" class="grid_16">

</div><!—ends #feature_panel—>

Do you think it could have something to do with the Javascript, this is what an article with an image looks like –

<div id="content">
        <div id="feature_panel" class="grid_16">
            <div id="fade" class="pics">
            <img src="http://www.gardensbydesign.uk.net/images/10.jpg" width="940" height="320" alt="Garden Project 1a" title="Garden Project 1a" />
            <img src="http://www.gardensbydesign.uk.net/images/11.jpg" width="940" height="320" alt="Garden Project 1b" title="Garden Project 1b" />
       </div>
</div><!--ends #feature_panel-->

The actual page is here although I’ll have to remove from view shortly. You’ll see there’s still a bit of CSS tidying to do, but it’s the testimonials that are causing the problem.

Bloke · 2009-07-21 14:45:27

decoderltd

Freaky.

Seems it’s something to do with the garden-projects section because the slideshow doesn’t even show up on the landing page, as well as any articles in that section. All other sections appear fine. Is that section using a different form or is there something otherwise special about it?

I don’t think the unterminated <div class="searchbox" has anything to do with it because that’s the same on the other pages but there must be some reason why the gallery hates that section. No idea off the top of my head, short of there being a dangling <txp:else /> or other tag somewhere in that section. Sorry.

decoderltd · 2009-07-21 15:16:06

Hmmm, strange. Will need to go through everything with a fine tooth comb – thanks for your time Stef.

photonomad · 2009-07-29 22:45:16

Hi Stef, I thought I’d better go ahead and avoid the hijacking by moving the conversation here:

I tried your suggested solution for using smd_if and smd_gallery, but I am going wrong somewhere and can’t figure it out.

A little more information: I am trying to get the prev/next buttons for jCarousellite to show up below the div of visible thumbnails only when there are more than 12 article images (that is the number of thumbs visible in the jCarousellite div). I am using the grouptagstart and grouptagend feature of smd_gallery to wrap every three thumbs in an <li>. If there are 12 or less thumbnails, I still want them to show up – just without the next/prev buttons below the div.

I thought that maybe I could avoid the buttons showing up with each iteration of the thumbs by breaking the code into two smd_gallery containers… one for thumbs (that includes the grouptags) and one for the buttons that includes the smd_if test for the number of images. I just can’t figure out how to avoid looping the smd_if call in with the thumbnail iterations – which results in x number of sets of next/prev buttons instead of just one.

I figured it out! : )

<txp:smd_gallery id="?article_image">
<txp:smd_if field="{counter}" operator="eq" value="1">
   <txp:smd_if field="{totalimages}" operator="gt" value="12">
      <div id="thumbnav">
	<button class="prev"><<</button>
	<button class="next">>></button>
      </div>
   </txp:smd_if>
</txp:smd_if>
</txp:smd_gallery>

Last edited by photonomad (2009-07-31 14:20:24)

Textpattern CMS

Textpattern CMS support forum

#517 2009-07-15 17:45:45

Re: smd_gallery: super-flexible gallery generator

#518 2009-07-15 19:44:52

Re: smd_gallery: super-flexible gallery generator

#519 2009-07-16 04:03:06

Re: smd_gallery: super-flexible gallery generator

#520 2009-07-16 15:04:34

Re: smd_gallery: super-flexible gallery generator

#521 2009-07-21 12:09:55

Re: smd_gallery: super-flexible gallery generator

#522 2009-07-21 12:22:30

Re: smd_gallery: super-flexible gallery generator

#523 2009-07-21 13:22:08

Re: smd_gallery: super-flexible gallery generator

#524 2009-07-21 13:24:37

Re: smd_gallery: super-flexible gallery generator

#525 2009-07-21 14:18:54

Re: smd_gallery: super-flexible gallery generator

#526 2009-07-21 14:45:27

Re: smd_gallery: super-flexible gallery generator

#527 2009-07-21 15:16:06

Re: smd_gallery: super-flexible gallery generator

#528 2009-07-29 22:45:16

Re: smd_gallery: super-flexible gallery generator

Board footer