Article thumbnail image from YouTube/Flickr code found in Body

photonomad · 2012-08-01 19:15:15

Thanks! No longer throwing erros and it is finding an image. However the context is an article list and instead of finding the first image from each article body, it is only finds the first image from the first article body, then it inserts that one same image for every one of the subsequent articles as well. It’s like it isn’t observing the fact that it is inside and article_custom form.

Here is the code I’m using:

<txp:article_custom section="sectionnamehere" limit="5">
<txp:etc_query data="{?body}" query="//img[1]/@src"><txp:variable name="bodyimg" value="{?}" /></txp:etc_query>
<txp:if_variable name="bodyimg" value="">
<txp:permlink><img src="http://www.gingermanley.com/thumbs/timthumb.php?src=<txp:variable name="bodyimg" />&w=160&q=100" /></txp:permlink>
<txp:else />
some other content
</txp:if_variable>
</txp:article_custom>

etc · 2012-08-01 20:36:29

No, it looks for images in thisarticle['body'], which is context aware. Are you sure <txp:else /> is not misplaced? Shouldn’t it be (I have modified the quotes too)

<txp:article_custom section="sectionnamehere" limit="5">
<txp:variable name="bodyimg" value='<txp:etc_query data="{?body}" query="string(//img[1]/@src)" />' />
<txp:if_variable name="bodyimg" value="">
some other content
<txp:else />
<txp:permlink><img src='http://www.gingermanley.com/thumbs/timthumb.php?src=<txp:variable name="bodyimg" />&w=160&q=100' /></txp:permlink>
</txp:if_variable>
</txp:article_custom>

Additionally, if you use it in some article, this article should be excluded from the list, for example by assigning it a different section. Otherwise, <img src="http://www.gingermanley.com/thumbs/timthumb.php?src=<txp:variable name="bodyimg" />&w=160&q=100" /> will be matched too.

Edit: I also have changed the variable definition.

Last edited by etc (2012-08-01 20:38:44)

photonomad · 2012-08-01 21:22:07

No, it looks for images in thisarticle['body'], which is context aware. Are you sure <txp:else /> is not misplaced? Shouldn’t it be (I have modified the quotes too)

Oops! Sorry… I mistyped and accidentally switched the <txp:else /> logic around while simplifying my code for this discussion.

Additionally, if you use it in some article, this article should be excluded from the list, for example by assigning it a different section. Otherwise, <img src="http://www.gingermanley.com/thumbs/timthumb.php?src=<txp:variable name="bodyimg" />&w=160&q=100" /> will be matched too.

The image tag with the bodyimg variable is only used in the custom_article form in the page template and is not in any of the article bodies.

I’m still having trouble with the same thumb showing up for every article in the list. In reality, the image that you see repeated in this example is only in the body of the first post and there are zero images in any of the next four posts. On the example/test page (section name is test) I have the following code in the page template:

<txp:if_article_list>
<txp:article_custom section="assisted-loving" limit="5">
<txp:etc_query data="{?body}" query="//img[1]/@src"><txp:variable name="bodyimg" value="{?}" /></txp:etc_query>
<div class="entry clearfix">
<h2><txp:permlink><txp:title /></txp:permlink></h2>
<txp:if_variable name="bodyimg" value="">
some other content
<txp:else />
<txp:permlink><img src='http://www.gingermanley.com/thumbs/timthumb.php?src=<txp:variable name="bodyimg" />&w=160&q=100' /></txp:permlink>
</txp:if_variable>
</div>
</txp:article_custom>
</txp:if_article_list>

Given what is displaying on the example/test page, it seems like the tag is somehow storing the image from the first post.

This page and the home page show the same articles listed using the phpquery code that I posted earlier in this thread.

I’d love to use your plugin instead of bringing in the phpquery file. I just don’t know why it is repeating in my test.

etc · 2012-08-01 21:38:01

I think it’s because of

<txp:etc_query data="{?body}" query="//img[1]/@src"><txp:variable name="bodyimg" value="{?}" /></txp:etc_query>

If an article has no images, then query brings nothing, and etc_query does not process the content (it passes to the else part). That’s why I have changed it to

<txp:variable name="bodyimg" value='<txp:etc_query data="{?body}" query="string(//img[1]/@src)" />' />

Could you try this?

photonomad · 2012-08-01 21:42:46

Now it works perfectly! I completely missed that. Thank you for helping me figure it out and thank you creating this great plugin!

etc · 2012-08-01 21:48:56

Glad to know you like it, thank you!

Edit: and your photos are great!

Last edited by etc (2012-08-01 21:50:27)

photonomad · 2012-09-14 05:43:25

Hi etc! I didn’t see your edit above until now. Thanks!

Question: is it possible to use etc_query to find the first <txp:images /> tag in an article body? I would like to find it and grab the id from it. I don’t think the <txp:images /> tag is parsed into an actual image tag first. I tried using parse=“before” with etc_query (with code above), but didn’t get a result. Any suggestions? Thanks!

etc · 2012-09-14 07:32:04

Hi!

I have not implemented namespaces (like txp:) for security reasons, so <txp:image id="1" /> becomes <image id="1"></image>. Parsing would fix this, you are quite right, but data is not parsed by etc_query, only content is. So

either query for string(//image[1]/@id) with your code
or, if you use this code in article form (not in article body), replace data="{?body}" by data='<txp:body />'. Mind, however, that in this case body will be parsed twice if you use <txp:body /> somewhere else in the form. To avoid it, you can firstly put it in some <txp:variable name="body" value='</txp:body >' />, then use <txp:variable name="body" /> everywhere instead of <txp:body />.

photonomad · 2012-09-15 01:30:12

Thanks, etc! I understand most of what you said above, but I’m still not able to find a way to get only the image ID. However, after playing around with your suggestion and reading a little xpath tutorial, I figured out how to get just the part of the image src that I needed (rather than the image ID from the txp:images tag).

This is what I’m using now and it works:

<txp:etc_query data='<txp:variable name="body" />' query="substring-before(//img[1]/@src, '&')" />

~~Edit:~~
~~I do have one question: is possible with xpath to find the string in the src after “=” and before “&”? In the src below, that would return only the image’s original URL.~~

Ok, I found the answer. This returns only the image’s original url (without the timthumb stuff):

<txp:etc_query data='<txp:variable name="body" />' query="substring-before(substring-after(//img[1]/@src,'='),'&')" />

Full backstory:

I have tags like the following in my article body: <txp:images id=“4” form=“image_large_center” /> (using Bloke’s still-in-development image selector plugin to easily select and add images into the body)

When the body is parsed (in the body variable as etc suggested above), the output of the images tag becomes this (I’m using timthumb.php to resize the image):
<img src="http://www.mydomain.com/timthumb.php?src=http://www.mydomain.com/images/64.jpg&w=568&q=100&s=1" alt="caption text here" class="center caption" />

The following is successful at getting the entire first img src:

<txp:etc_query data='<txp:variable name="body" />' query="string(//img[1]/@src)" />

Since I needed to resize the image differently in an article list, I had to change the string function to get the src up until the “&”.

If anyone found this useful, then great. Otherwise, sorry for such a long and rambling post!

Last edited by photonomad (2012-09-15 02:17:51)

etc · 2012-09-15 09:49:32

photonomad wrote:

I’m still not able to find a way to get only the image ID.

Sorry, I have somehow zapped on this. You should be able to do it with unparsed body:

<txp:etc_query data="{?body}" query="string(//image[1]/@id)" />

To see precisely how etc_query has imported data, call it with debug="h" attribute (in txp debug mode). You should see few warnings about invalid txp:image tags, that will be converted to <image id="64"></image>. You can then extract id attribute as above.

You can also cheat by adding some data-id attribute to img tag in your “image_large_center” form:

<img ... data-id='<txp:image_info type="id" />' />

Edit: or, if you are looking for src

<img ... data-id='<txp:image_url />' />

Then query for

<txp:etc_query data='<txp:variable name="body" />' query="string(//img[1]/@data-id)" />

Anyway, you have found a solution, and I hope learning xpath was not waste of time.

Last edited by etc (2012-09-15 10:36:33)

photonomad · 2012-09-19 19:56:06

Learning xpath wasn’t a waste of time! I like it and your plugin is very useful. Thanks!

Textpattern CMS

Textpattern CMS support forum

#31 2012-08-01 19:15:15

Re: Article thumbnail image from YouTube/Flickr code found in Body

#32 2012-08-01 20:36:29

Re: Article thumbnail image from YouTube/Flickr code found in Body

#33 2012-08-01 21:22:07

Re: Article thumbnail image from YouTube/Flickr code found in Body

#34 2012-08-01 21:38:01

Re: Article thumbnail image from YouTube/Flickr code found in Body

#35 2012-08-01 21:42:46

Re: Article thumbnail image from YouTube/Flickr code found in Body

#36 2012-08-01 21:48:56

Re: Article thumbnail image from YouTube/Flickr code found in Body

#37 2012-09-14 05:43:25

Re: Article thumbnail image from YouTube/Flickr code found in Body

#38 2012-09-14 07:32:04

Re: Article thumbnail image from YouTube/Flickr code found in Body

#39 2012-09-15 01:30:12

Re: Article thumbnail image from YouTube/Flickr code found in Body

#40 2012-09-15 09:49:32

Re: Article thumbnail image from YouTube/Flickr code found in Body

#41 2012-09-19 19:56:06

Re: Article thumbnail image from YouTube/Flickr code found in Body

Board footer