Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2018-11-14 16:13:32

Vienuolis
Member
From: Vilnius, Lithuania
Registered: 2009-06-14
Posts: 310
Website GitHub GitLab Mastodon Twitter

Image title="Caption"

When and why the title attribute was removed from txp:image, txp:article_image, and txp:thumbnail output? Sad to see them disappeared from all webpages published with Textpattern. I know, this attribute is insufficient for disabled people, also poorly supported on paper media and on small display phones, although it is a valid HTML attribute and is still a very informative popup tooltip on convenient monitors. Probably since 4.6th version Textpattern outputs only width, height, and alt HTML <img> attributes from the Images panel, leaving an input in the Caption text area:

<img src="/images/ID#.jpg"
  alt="Alternate text"
 -title="Caption"-
  width="" height="">

I tried to force the title by extracting it from txp:image_info but got an error.

<txp:image id="123" title='<txp:image_info type="caption" />' />

Is there any hope Textpattern to output the Caption as a title? By default, besides of Alternate text, with no workarounds, and irrespective of figcaption and other supplementary tags.

Offline

#2 2018-11-14 16:28:57

Bloke
Developer
From: Leeds, UK
Registered: 2006-01-29
Posts: 11,468
Website GitHub

Re: Image title="Caption"

How about DIY:

<txp:if_article_image>
   <txp:images>
      <img src="<txp:image_url />" alt="<txp:image_info type="alt" />" title="<txp:image_info />" />
   </txp:images>
</txp:if_article_image>

The smd plugin menagerie — for when you need one more gribble of power from Textpattern. Bleeding-edge code available on GitHub.

Txp Builders – finely-crafted code, design and Txp

Offline

#3 2018-11-14 16:52:21

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

Re: Image title="Caption"

I believe title is not actually an official attribute of the img tag (anymore?) but it is of an a href="" tag (and many others). The thinking is that alt provides an alternative description of the image for non-visual users/devices while figcaption serves as the caption with the figure wrapper linking the two together.

On devdocs, there’s a note explaining why its unwise to use both on the same image:

The title attribute is not an acceptable substitute for an alt attribute. Additionally, avoid duplicating the alt attribute’s value in a title attribute declared on the same image. Doing so may cause some screen readers to announce the description twice, creating a confusing experience.

The title attribute should also not be used as supplemental captioning information to accompany an image’s alt description. If an image needs a caption, use a combination of the figure and figcaption elements.


TXP Builders – finely-crafted code, design and txp

Offline

#4 2018-11-14 16:54:20

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

Re: Image title="Caption"

Hehe, while I was not looking, Oleg posted a more general solution that adds the title attribute (and others) to all tags. See here :-)


TXP Builders – finely-crafted code, design and txp

Offline

#5 2018-11-14 18:19:15

Vienuolis
Member
From: Vilnius, Lithuania
Registered: 2009-06-14
Posts: 310
Website GitHub GitLab Mastodon Twitter

Re: Image title="Caption"

jakob wrote #315228:

I believe title is not actually an official attribute of the img tag (anymore?)

title never was an attribute of img oneself, because it is a general attribute for many HTML tags.

The title attribute is not an acceptable substitute for an alt attribute.

It is not a substitute at all.

avoid duplicating the alt attribute’s value in a title attribute declared on the same image.

Avoid duplicating the alt attribute’s value in a figcaption attribute declared on the same image — the same sense (nonsense).

Doing so may cause some screen readers to announce the description twice

It would the fault of some poor screen reader. In general, duplicating of alt attribute value is better than absence of title. However I am concerned about the cause of dropping support for the Caption output as a title, though.

Oleg posted a more general solution that adds the title attribute (and others) to all tags.

I have just installed this etc_attribute, yet do not find where to input data or how to associate title with caption from the Images panel.

Bloke wrote #315225:

How about DIY:

Thank you for the good tip. Yet I still hope to restore the titles in old websites, too.

Offline

#6 2018-11-14 18:54:43

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

Re: Image title="Caption"

Vienuolis wrote #315235:

I have just installed this etc_attribute, yet do not find where to input data or how to associate title with caption from the Images panel.

Either

<txp:image id="123" title="My great title" />

or

<txp:image id="123" title='<txp:image_info id="123" type="caption" />' />

or

<txp:images id="123">
<txp:image title='<txp:image_info type="caption" />' />
</txp:images>

Offline

#7 2018-11-14 20:26:25

Vienuolis
Member
From: Vilnius, Lithuania
Registered: 2009-06-14
Posts: 310
Website GitHub GitLab Mastodon Twitter

Re: Image title="Caption"

etc wrote #315236:

<txp:image id="123" title='<txp:image_info id="123" type="caption" />' />

type="caption" is default type for txp:image_info , thus could be absent. Whilst duplicating of ID in the same context was a surprise for me, thank you!

The captions are retrieved from the Images panel now, although with some quotation glitch ( instead of ') in the ending HTML tag ( /&gt; insted of />), and without alt attribute, like

<txp:image id="345" title='Textpattern — WWW leidykla su Textile‘ /&gt;

That is an output, not input. I double checked my code.

Textpattern Admin: Diagnostics report does not show the installed and activated etc_attribute.

Offline

#8 2018-11-14 20:33:58

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

Re: Image title="Caption"

Vienuolis wrote #315239:

Whilst duplicating of ID in the same context was a surprise for me, thank you!

You are welcome. Actually, they are not in the same content, title is an attribute here, sibling of id, not its child.

The captions are retrieved from the Images panel now, although with some quotation glitch ( instead of ') in the ending HTML tag ( /&gt; insted of />), and without alt attribute, like

Are you using it in an article body/excerpt? Then wrap it in == to prevent Textiling.

Textpattern Admin: Diagnostics report does not show the installed and activated etc_attribute.

Mine does.

Edit: note that txp 4.7 is required.

Offline

#9 2018-11-14 20:53:23

Vienuolis
Member
From: Vilnius, Lithuania
Registered: 2009-06-14
Posts: 310
Website GitHub GitLab Mastodon Twitter

Re: Image title="Caption"

Are you using it in an article body/excerpt? Then wrap it in == to prevent Textiling.

Why? It was enough to leave a space so far… Ah, because of the plugin? It is still not presented in the Diagnostics report, although seems to work. And the output code is complete now, thank you very much!

Offline

#10 2018-11-14 20:57:51

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

Re: Image title="Caption"

Vienuolis wrote #315241:

Why? It was enough to leave a space so far… Ah, because of the plugin?

No, a space only prevents from wrapping in <p></p>, not from Textile.

Offline

#11 2018-11-14 21:07:37

Vienuolis
Member
From: Vilnius, Lithuania
Registered: 2009-06-14
Posts: 310
Website GitHub GitLab Mastodon Twitter

Re: Image title="Caption"

etc wrote #315243:

No, a space only prevents from wrapping in <p></p>, not from Textile.

Do not Textile wraps separate lines to <p></p> , what else?

Offline

#12 2018-11-14 21:20:12

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

Re: Image title="Caption"

Vienuolis wrote #315246:

Do not Textile wraps separate lines to <p></p> , what else?

Very much else, transforms "Manual":https://textpattern.com/textile-reference-manual into Manual, for example.

Offline

Board footer

Powered by FluxBB