Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2015-07-17 15:14:14

photonomad
Member
Registered: 2005-09-10
Posts: 290
Website

Randomly ordered images permlinked to their respective articles...

How do I output article images in random order in an article list without the images ending up grouped by article? In other words, how do I gather all the image id’s from a group of articles and display them randomly so that the images aren’t grouped by article, but still maintain the ability to permlink each image to it’s respective article? Should I use a json document or something to gather the data for each image and then use a plugin or something to read the data and output the images (with permlinks) in random order? I need a hand wrapping my head around this. Thx.

Offline

#2 2015-07-17 16:35:48

etc
Developer
Registered: 2010-11-11
Posts: 5,028
Website GitHub

Re: Randomly ordered images permlinked to their respective articles...

Assuming you’ve obtained and saved a links list like

<txp:variable name="links">
<a href="art-1"><img src="img-1" /></a>
<a href="art-1"><img src="img-2" /></a>
...
<a href="art-100"><img src="img-999" /></a>
</txp:variable>

the following (taken here) could work:

<!-- import and count links -->
<txp:etc_query data='<txp:variable name="links" />'
	query="count(a)" name="count" save="links" />

<!-- shuffle links -->
<txp:etc_query data="links" markup="data" parse="before">
	<txp:etc_query data="[{?count||range(1|$).@shuffle.implode(,|$)}]" markup="json">
	{{a[{?}]}}
	</txp:etc_query>
</txp:etc_query>

You’ll need the version 1.2.9, the latest beta (1.3.0) will not work, but I can send you a fixed version (the download link is offline).

Offline

#3 2015-07-17 19:01:37

photonomad
Member
Registered: 2005-09-10
Posts: 290
Website

Re: Randomly ordered images permlinked to their respective articles...

Thanks, Oleg! I had a feeling etc_query would be helpful. I only have version 1.3.0 saved on my computer. Would love the version that will work with the above when you have a moment to send it. Thanks again!

Offline

#4 2015-07-17 20:14:57

etc
Developer
Registered: 2010-11-11
Posts: 5,028
Website GitHub

Re: Randomly ordered images permlinked to their respective articles...

Sorry, Stacey, I’m too biased, this is just disguised php in your case. Since you don’t need to go inside your links (unlike in the post I cited), but just shuffle them, a more direct way will be:

  • choose some pattern unlikely to be in you links, say |||;
  • separate (with break attribute) your links with |||, to get
<txp:variable name="links">
<a href="art-1"><img src="img-1" /></a>|||
<a href="art-1"><img src="img-2" /></a>|||
...
<a href="art-100"><img src="img-999" /></a>
</txp:variable>

Now just split <txp:variable name="links" /> and shuffle the array:

<txp:php>
$links = do_list(parse('<txp:variable name="links" />'), '|||');
shuffle($links);
echo implode(n, $links);
</txp:php>

I’ll send you a working version of etc_query though, just need to test it a little more. It will be then

<txp:etc_query argsep="," data="{?links||do_list($,|||).@shuffle.implode(,$)}" />

Edit: adi_list could do it too, if it has some delimiter attribute.

Last edited by etc (2015-07-18 06:56:34)

Offline

#5 2015-07-17 20:37:04

colak
Admin
From: Cyprus
Registered: 2004-11-20
Posts: 9,007
Website GitHub Mastodon Twitter

Re: Randomly ordered images permlinked to their respective articles...

I may have misunderstood the question but couldn’t this be easily achieved with txp tags? Something like:

<txp:article_custom limit="200" sort="rand()">
<txp:permlink><txp:article_image /></txp:permlink>
</txp:article_custom>

Yiannis
——————————
NeMe | hblack.art | EMAP | A Sea change | Toolkit of Care
I do my best editing after I click on the submit button.

Offline

#6 2015-07-17 21:39:57

jakob
Admin
From: Germany
Registered: 2005-01-20
Posts: 4,578
Website

Re: Randomly ordered images permlinked to their respective articles...

Yiannis, I was thinking that too. As long as you have only one article image per article, that should be fine. If your article image field has several images, then oleg’s variant provides randomisation within all the article images wherever they are.


TXP Builders – finely-crafted code, design and txp

Offline

#7 2015-07-17 22:13:11

colak
Admin
From: Cyprus
Registered: 2004-11-20
Posts: 9,007
Website GitHub Mastodon Twitter

Re: Randomly ordered images permlinked to their respective articles...

Even if there is more than one image in the article_image field an untested code could be

<txp:article_custom limit="200" sort="rand()" wraptag="" break=",">
<txp:images id='<txp:custom_field name="article_image" />'>
<txp:permlink><txp:image /></txp:permlink>
</txp:images>
</txp:article_custom>

If there are images which are used more than once rah_repeat could be used to eliminate those ids. Again… I may have misunderstood the question.


Yiannis
——————————
NeMe | hblack.art | EMAP | A Sea change | Toolkit of Care
I do my best editing after I click on the submit button.

Offline

#8 2015-07-17 22:26:03

jakob
Admin
From: Germany
Registered: 2005-01-20
Posts: 4,578
Website

Re: Randomly ordered images permlinked to their respective articles...

Yes, you’re right, and rah_repeat also has the sort attribute so you could do the random sort there. Something like this should work:

<txp:variable name="all_article_images">
  <txp:article_custom limit="200" break="">
    <txp:images id='<txp:custom_field name="article_image" />' break=",">
      <txp:permlink><txp:image thumbnail="1" /></txp:permlink>
    </txp:images>
  </txp:article_custom>
</txp:variable>

<txp:rah_repeat value='<txp:variable name="all_article_images" />' duplicates="1" sort="rand()" wraptag="ul" break="li" class="image_list">
  <txp:rah_repeat_value />
</txp:rah_repeat>

TXP Builders – finely-crafted code, design and txp

Offline

#9 2015-07-17 22:28:35

photonomad
Member
Registered: 2005-09-10
Posts: 290
Website

Re: Randomly ordered images permlinked to their respective articles...

I do have more than one article image for each article and I do not want each article’s images to output/display together. I am about to work with Oleg’s solution and I’ll report back on my results. I do not think it is possible to achieve this with only native tags.

Update: Jakob, I’ll try out your suggestion as well!

Thanks,
Stacey

Last edited by photonomad (2015-07-17 22:30:11)

Offline

#10 2015-07-18 02:23:29

gomedia
Plugin Author
Registered: 2008-06-01
Posts: 1,373

Re: Randomly ordered images permlinked to their respective articles...

etc wrote #293425:

adi_list could do it too …

Did I hear my name?

How about:

<txp:hide>**** GENERATE RANDOMISED LIST OF ARTICLE IDS ****</txp:hide>
<txp:variable name="article_list"><txp:article_custom limit="9999" sort="rand()"><txp:article_id />,</txp:article_custom></txp:variable>

<txp:hide>**** CREATE ADI_LIST ****</txp:hide>
<txp:adi_list name="article_list" txpvar="article_list" />

<txp:hide>**** RANDOMLY SELECT ARTICLE & OUTPUT RANDOM ARTICLE IMAGE ****</txp:hide>
<txp:article_custom id='<txp:adi_list name="article_list" random="1" />' limit="9999" >
	<txp:if_article_image>
		<txp:images sort="rand()" limit="1">
			<txp:permlink><txp:image /></txp:permlink>
		</txp:images>
	</txp:if_article_image>
</txp:article_custom>

Offline

#11 2015-07-18 06:50:24

etc
Developer
Registered: 2010-11-11
Posts: 5,028
Website GitHub

Re: Randomly ordered images permlinked to their respective articles...

I wouldn’t use comma as separator, because <txp:image /> outputs something like

<img src="http://localhost/textpattern-parser/images/1.png" alt="Comma, why not?" ... />

If some alt text contains comma, things will go west. So, to complete, this is the list (as suggested by Julian, but delimited by |||)

<txp:variable name="list">
  <txp:article_custom limit="200" break="|||">
    <txp:images id='<txp:custom_field name="article_image" />' break="|||">
      <txp:permlink><txp:image /></txp:permlink>
    </txp:images>
  </txp:article_custom>
</txp:variable>

Now, etc_query (once fixed), rah_replace (if it accepts rand() sort, of which there is no evidence) or adi_list (if it accepts custom delimiters…) will all work, but not do any better than my php snippet.

Offline

#12 2015-07-18 07:32:34

gomedia
Plugin Author
Registered: 2008-06-01
Posts: 1,373

Re: Randomly ordered images permlinked to their respective articles...

etc wrote #293454:

I wouldn’t use comma as separator, because <txp:image /> outputs something like

I don’t think that’s a problem with what I suggested – it runs on article IDs until the last moment, when a link is output.

But if you do need a delimiter with adi_list then use separator="|" or some such and change default_separator to be something different (it defaults to "|").

Last edited by gomedia (2015-07-18 07:36:17)

Offline

Board footer

Powered by FluxBB