smd_gallery: super-flexible gallery generator

chrisgoodhue · 2010-07-30 15:28:42

this is what txp spits out, which i’m assuming is what’s supposed to happen:

i’m using version 0.62 of smd_gallery and .036 of smd_lib

Bloke · 2010-07-30 15:36:35

chrisgoodhue wrote:

this is what txp spits out, <snip>

Yup, perfect. But you need to update your jQuery start script as I mentioned a few posts ago. You’re currently doing this:

$("a[rel=fancybox]").fancybox({
...
});

which won’t match when you are using fancybox-something :o) You need to find some other way of starting your fancybox script off; either explicitly starting two of them:

$("a[rel=fancybox-design], a[rel=fancybox-photography]").fancybox({
...
});

Or by adding a class to all your anchors in the gallery Form and using:

$(".imgclass").fancybox({
...
});

chrisgoodhue · 2010-07-30 16:02:19

that did the trick!!

thanks so much for your help. i’ve learned a lot

Gallex · 2010-08-05 11:29:36

my aim is quite similar to chrisgoodhue, but i’m using shadowbox and i want to wrap the whole code into smd_gallery tags

my template:

<txp:smd_gallery category="linnud" thumbsize="100">
   <a rel="shadowbox" href="{url}"
     title="{caption}">
 <txp:thumbnail id="{id}" />
</a>
</txp:smd_gallery>

almost get to work beside thumbsize=“100” and next/previous links won’t appear below of large images.
what’s wrong in my code?

Gallex · 2010-08-05 13:52:04

Gallex wrote:

next/previous links won’t appear below of large images.
what’s wrong in my code?

ok, this one i get to work – needed to use square brackets

<txp:smd_gallery thumbsize="100">
   <a rel="shadowbox[linnud]" href="{url}"
     title="{caption}">
<txp:thumbnail id="{id}" />
 </a>

but this thumbsize staff….

Bijay · 2010-08-06 09:55:23

Hi Bloke .. i have used an smd_gallery plugins.. On my “slidebar” form i have used this code…

 <script type="text/javascript">
myShow1 = new Slideshow("slideshow1",
  { hu: "<txp:site_url />images/",
    images: [{imglist}],
    captions: [{alt}],
    classes: ["prev","next","active"],
    type: "fade"
  });
</script>

But i didn’t get the result. it shows “myShow1” error when i turn on firebug..
So can you tell me how should i solve this problem and make plugin to work..
thanx

Gallex · 2010-08-06 10:22:16

this is the page i’m working

i would ike to display only first image from both albums. and here is code i’m using:

page:

<txp:smd_gallery category="linnud, eksponaadid" form="shadowbox" thumblimit="1" thumbsize="380,300" onchange="category_title" onchangewraptag="h3" grouptag="div" groupclass="pildid" />

form:

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

everything ok, but it doesn’t recognize the image category correctly. it outputs same images in both albums

the html output

<a rel="shadowbox[category]" href="http://www.hm-kodulehed.ee/images/44.jpg" title="Hallpea-rähn">
<img src="http://www.hm-kodulehed.ee/images/44t.jpg" alt="emaslind männioksal" width="380" height="300" />
</a>

but should be

<a rel="shadowbox[linnud]" href="http://www.hm-kodulehed.ee/images/44.jpg" title="Hallpea-rähn">
<img src="http://www.hm-kodulehed.ee/images/44t.jpg" alt="emaslind männioksal" width="380" height="300" />
</a>

any ideas what could be wrong in my code?

Gallex · 2010-08-07 08:54:38

switched to slimbox2 and get it work propely

detail · 2010-08-11 11:16:26

Mr B,

I’ve managed to get a Showcase slideshow working on my front page which has its own section. Trrrrific.

Now, just as a special challenge I’m hoping to add a separate slideshow for each article in a 12 page section.

Maybe I’m not thinking correctly but can I get a slideshow, pulling the images from the images linked to the article rather than a gallery, ie the first page has images A, B, C and the second D, E, F, the third G, H I etc.

I want the images & captions to be separate from any other text ie so these slideshows would be placed outside each article on the page.

Or do I create 12 separate galleries and somehow link these to the individual page where each article appears?

Not quite sure if this question is just plain dumb or profound.

Bloke · 2010-08-11 11:59:39

detail wrote:

Not quite sure if this question is just plain dumb or profound.

The latter; I’m just too dumb to figure out what you mean :-)

Taking a stab at what I think you are trying to achieve:

you have a section called, for example, zodiac
in this section you have 12 articles — one for each sign of the zodiac
each article has some images associated with it (perhaps listed in the article_image field) of celebrities having that star sign
you want to display the article content on the left and the slideshow in its own doohicky on the right of the page

Is that about right? If so, you’re in luck. In your default article Form (assuming that’s the one you’re using!) you’d set up your page structure like this:

<div id="article_text">
... <txp:title />, <txp:body />, etc tags here
</div>
<div id="sideshow_bob">
   <txp:smd_gallery id="?article_image">
      <txp:image id="{id}" /><br />
      <span class="caption">{caption}</span>
   </txp:smd_gallery>
</div>

So when this is called from the <txp:article /> tag in your Page, the text is rendered on the left and your smd_gallery tag reads the list of image IDs you have placed in the article image field of the current article and makes a slideshow of them in its own div which you can float:right or whatever you like.

If you had already put your celebrity pictures in image categories you could be even more clever. If your articles were each named after a sign of the zodiac and you also placed the celebrities in image categories named after the star signs, you coud tie them together with this gallery tag:

<txp:smd_gallery category="?title" />

That means you don’t even have to use the article image field: your images are automatically read from the same image category as the current article title.

If you want to truly display the slideshow ‘outside’ the article flow then you could use a standard article tag on the left to render the text of the current article and use an article_custom tag on the right to grab a subset of articles, with an smd_gallery tag embedded inside it to render the relevant slideshow(s) based on the article contents.

Does that help or, if not quite right, give you some ideas to get where you want to be?

EDIT: corrected… articleUNDERSCOREimage

Last edited by Bloke (2010-08-11 13:59:02)

maverick · 2010-08-11 13:45:31

Bloke wrote:

<txp:smd_gallery id=”?article-image”>

<txp:smd_gallery category=”?title” />

Sorry to break into your discussion. For those of us watching and learning before we implement smd_gallery . . .

Does smd_gallery require the “?” in the attributes, or did some php accidently sneak in? :)

Bloke · 2010-08-11 13:58:00

maverick wrote:

Does smd_gallery require the “?” in the attributes

Yes if you want it to mean “get the thing after the ? from the current article”. If you don’t specify the ? then it uses the value literally. Viz:

category="title"
==> get images from the image category called "title"

category="?title"
==> get images from the image category with the same name as the current article's title

There are other modifiers and shortcuts, chiefly the ! to mean “not”. A silly example:

id="12-45, !42, !article_image"

That would grab all the images with IDs between 12 and 45 but would exclude image #42 and any images with IDs listed in the current article image field. So if your article image contained 30, 40, 60 you’d get any images between 12 and 45 except images 30, 40 and 42. The plugin takes everything you specify as a potential pool of images: whatever’s left after all the inclusions/exclusions have been considered are the images you see in your gallery.

Last edited by Bloke (2010-08-11 13:59:57)

detail · 2010-08-11 14:47:42

Wow, Mr B.

That’s really set the mind racing. Yup, I’ve a sort of direction to head.

I just have to work out how to throw those variables into url” “ & description” “.

<script type="text/javascript">
$(function() { 
$("#showcase_1080").showcase({
        css: { width: "1080px", height: "500px",},
        animation: { type: "fade", interval: 5000, speed: 1500 },
        images: [
         { url:"",
          description:""}
                     ],

If it doesn’t strain our fledgling relationship could you, perhaps, expand a little on:

If you want to truly display the slideshow ‘outside’ the article flow then you could use a standard article tag on the left to render the text of the current article and use an article_custom tag on the right to grab a subset of articles, with an smd_gallery tag embedded inside it to render the relevant slideshow(s) based on the article contents.

Bloke · 2010-08-11 15:11:00

detail wrote:

I just have to work out how to throw those variables into url” “ & description” “.

It’ll be the same sort of logic as on your front page I would guess. Are you using smd_gallery’s coallate mode? Got any tag code you could post please?

If it doesn’t strain our fledgling relationship could you, perhaps, expand a little on <snip>

It was just wondering out loud really. Without knowing if the approach I first proposed was the way you were thinking I just threw in an (expensive) alternative.

It boils down to separating the current article’s text from the sidebar slideshow’s content. If you wanted to show images that were assigned to the current article, then the first method should be the way to go. But if you wanted to decouple the views and have the sidebar show something different to the current article (perhaps to entice people to click on it and see the another article from which the images are associated), then you could approach it like this in your Page template:

<div id="article_text">
... <txp:article /> // Calls the form with title/body/etc
</div>
<div id="sideshow_bob">
   <txp:article_custom id="some_article_ID">
      <txp:smd_gallery id="?article_image">
         <txp:image id="{id}" /><br />
         <span class="caption">{caption}</span>
      </txp:smd_gallery>
   </txp:article_custom>
</div>

Not sure if that makes sense or is even useful — it uses two article calls so hits the DB twice. But you can do some wacky things like that with TXP!

Last edited by Bloke (2010-08-11 15:12:21)

maverick · 2010-08-11 16:02:07

Bloke

Thanks for the tutorial! That’s something I should have known, but either missed or forgot. Your explanation was excellent

Mike

Textpattern CMS

Textpattern CMS support forum

#736 2010-07-30 15:28:42

Re: smd_gallery: super-flexible gallery generator

#737 2010-07-30 15:36:35

Re: smd_gallery: super-flexible gallery generator

#738 2010-07-30 16:02:19

Re: smd_gallery: super-flexible gallery generator

#739 2010-08-05 11:29:36

Re: smd_gallery: super-flexible gallery generator

#740 2010-08-05 13:52:04

Re: smd_gallery: super-flexible gallery generator

#741 2010-08-06 09:55:23

Re: smd_gallery: super-flexible gallery generator

#742 2010-08-06 10:22:16

Re: smd_gallery: super-flexible gallery generator

#743 2010-08-07 08:54:38

Re: smd_gallery: super-flexible gallery generator

#744 2010-08-11 11:16:26

Re: smd_gallery: super-flexible gallery generator

#745 2010-08-11 11:59:39

Re: smd_gallery: super-flexible gallery generator

#746 2010-08-11 13:45:31

Re: smd_gallery: super-flexible gallery generator

#747 2010-08-11 13:58:00

Re: smd_gallery: super-flexible gallery generator

#748 2010-08-11 14:47:42

Re: smd_gallery: super-flexible gallery generator

#749 2010-08-11 15:11:00

Re: smd_gallery: super-flexible gallery generator

#750 2010-08-11 16:02:07

Re: smd_gallery: super-flexible gallery generator

Board footer