Nested if tags to employ a custom field as selector attribute

Destry · 2018-03-01 12:32:45

This should be straight forward, but I’ve never been very straight.

In this silly new vamp I’m getting ready to launch for myself (yay, writing again!) I employ hero images at top of articles with a if_article_image conditional because I don’t always use one. IDs are added via the Article image field.

When used, I typically want heros to be about 40% of the width. But the sources of these images, which I further modify down dimension-wise, are not always big enough to work, getting stretched out and ugly. I need to be able to give them a width class on an article-by-article basis, so in the article form where the if_article_image complex is, there needs to be some additional if_custom_field voodoo that inserts a custom field (e.g. name="Hero_width") value as a class selector in the figure element I have wrapping the images.

I can’t get it to work, nothing shows up, but neither to I get any tag errors either. I deleted the faulty experiment markup, so I’m currently sitting fresh again with this, :

<txp:if_article_image>	
    <txp:article_image wraptag="figure" height="0" width="0" class="x" />
</txp:if_article_image>

How can I swing it with if_custom_field so class="x" exists and drops in a value if one is given in a custom field called “Hero_width”?

Or am I looking at this wrong? Should if_custom_field be the container conditional with if_article_image an else factor? That seemed inside out to me.

Destry · 2018-03-01 12:37:20

Actually, I just realized I want it slightly different…

I don’t want the conditional on the whole selector, class="x", but on a second attribute in the selector, “y”, that overrides the default (i.e. class="x y"). So the if_custom_field magic is only applied to y, but otherwise the same difference.

All hypotheses to test are appreciated.

I’ll try it again and share what’s broken.

colak · 2018-03-01 13:22:18

Hi Destry,

would the code below be of help?

<txp:if_article_image>
<txp:images id='<txp:custom_field name="article_image" />'>
<txp:if_custom_field name="Hero_width">
<img src="/images/<txp:image_info type="id" /><txp:image_info type="ext" />" width="<txp:image_info type="w" />" height="<txp:image_info type="h" />" alt="<txp:image_info type="alt" />" class="<txp:custom_field name="Hero_width" />" />
<txp:else />
The Hero_width custom field is empty
</txp:if_custom_field>
</txp:images>
<txp:else />
There is no article image
</txp:if_article_image>

Re-read your post

try this one:)

<txp:if_article_image>
<txp:images id='<txp:custom_field name="article_image" />'>
<img src="/images/<txp:image_info type="id" /><txp:image_info type="ext" />" width="<txp:image_info type="w" />" height="<txp:image_info type="h" />" alt="<txp:image_info type="alt" />" class="x<txp:if_custom_field name="Hero_width"> <txp:custom_field name="Hero_width" /></txp:if_custom_field>" />
</txp:images>
<txp:else />
There is no article image
</txp:if_article_image>

>Edited again: <txp:image_info type="ext" /> includes the dot.

Last edited by colak (2018-03-01 14:13:29)

Destry · 2018-03-01 16:51:13

Thank you, Colak!

This bit is what had me flummoxed…

class="hero <txp:if_custom_field name="Hero_width"><txp:custom_field name="Hero_width"

…and probably this part too, which I didn’t have before:

<txp:else />
There is no article image

I’ve managed to get it like wanted with this:

<txp:if_article_image>
<figure class="hero <txp:if_custom_field name="Hero_width"><txp:custom_field name="Hero_width" /></txp:if_custom_field>">
  <txp:article_image height="0" width="0" />
</figure>
<txp:else />
There is no article image
</txp:if_article_image>

Though I can probably still put the figure and class parts inside the article_image tag (e.g. wraptag="figure"), but in any case it’s working!

Cheers

colak · 2018-03-01 17:28:54

I would do a minor change from:

<figure class="hero <txp:if_custom_field name="Hero_width"><txp:custom_field name="Hero_width" /></txp:if_custom_field>">

to:

<figure class="hero<txp:if_custom_field name="Hero_width"> <txp:custom_field name="Hero_width" /></txp:if_custom_field>">

It’s a detail but there is no reason of having the space in class="hero " when the CF is empty.

Destry · 2018-03-01 21:00:35

Yes, good call. I saw that and didn’t realize the point. But I see now.

jakob · 2018-03-01 21:13:20

If your Hero_width custom field only evers holds a class name when you need it, you could simply cut straight to the tag without the if:

<figure class="hero <txp:custom_field name="Hero_width" />">

The only ‘wastage’ is a space when you don’t use it.

What’s also a possibility if you want a range of different article layouts is to set up different article form layouts and then use the override form dropdown in the write tab to switch to a special layout for a specific article when you need it. Perhaps it’s a bit overkill for just the image width but you could use it if you wanted say a gallery, video or perhaps a visual essay, then a longform piece etc., then perhaps just a quote – sort of tumblr-style.

etc · 2018-03-01 21:28:50

jakob wrote #309563:

The only ‘wastage’ is a space when you don’t use it.

We could add some [r|l]space values to the global escape attribute, so it would be

<figure class="hero<txp:custom_field name="Hero_width" escape="lspace" />">

Last edited by etc (2018-03-02 14:02:21)

colak · 2018-03-02 07:19:29

etc wrote #309564:

We could add some [r|l]space values to the global escape attribute, so it would be

<figure class="hero<txp:custom_field name="Hero_width" escape="rspace" />">...

That would be very handy!!!

jakob · 2018-03-02 08:07:21

colak wrote #309567:

That would be very handy!!!

I agree. I use smd_wrap quite often and as brilliant as it is it makes for busy template code. I like your additions of some its capabilities as attributes.

etc wrote #309564:

We could add some [r|l]space values to the global escape attribute, so it would be

<figure class="hero<txp:custom_field name="Hero_width" escape="rspace" />">...

Do I understand you correctly: escape="rspace" adds space to the right of the item (like escape="rtrim" would remove excess space/chars from the right). If that’s so, for the example above, it should be escape="lspace", no?

etc · 2018-03-02 14:01:54

jakob wrote #309568:

Do I understand you correctly: escape="rspace" adds space to the right of the item (like escape="rtrim" would remove excess space/chars from the right). If that’s so, for the example above, it should be escape="lspace", no?

Oops, sorry, corrected.

etc · 2018-03-02 14:05:34

colak wrote #309567:

That would be very handy!!!

If [l|r]space is ok as name, let us do it.

Textpattern CMS

Textpattern CMS support forum

#1 2018-03-01 12:32:45