How to display each line in separate div?

bashirnoori · 2024-06-07 16:29:16

I have the following table of exchange rates and want to make that dynamic through the article body or excerpt.
I can do that with custom_field solution, but it’s around 40 and I thought that would not be a good solution, or any other way if you suggest.
1 USD = <div class="rate">70</div> AFN
1 EUR = <div class="rate">76</div> AFN
1 GBP = <div class="rate">88</div> AFN
etc…
I think I can write to the body or excerpt and then display each line break to the rate class div separately.


<txp:article_custom id="10"><div class="rate"><txp:excerpt escape="p" LineBreak="1" /></div></txp:article_custom>
<txp:article_custom id="10"><div class="rate"><txp:excerpt escape="p" LineBreak="2" /></div></txp:article_custom>
<txp:article_custom id="10"><div class="rate"><txp:excerpt escape="p" LineBreak="3" /></div></txp:article_custom>
etc...

colak · 2024-06-07 17:05:44

Will you need the history of the exchange rates?

If not, create a section, call it exchange rates, and have 3 articles in it: USD, EUR, GBP.

The section page (template) could have

<txp:article>
<div class="rate">1 <txp:title>= <txp:custom_field="rate" /> AFN</div>
</txp:article>

bashirnoori · 2024-06-07 19:13:14

It’s 40 different rates, making section will become too many.
I was thinking if possible putting all in one article body in 40 lines and fetching each line separately like


3
<br>
4
<br>
5
<br>
6
<br>
etc... all other remaining of 40 lines

then fetch each line <txp:body id="10" firstline /> <txp:body id="10" secondline /> etc...

Bloke · 2024-06-07 20:39:56

Does it have to be stored in an article? i.e. do content editors need to alter the rates?

If not, why not use a few Forms and just make a delimited list, one per row, for each rate in each necessary form? You can include them in your articles to display them, using <txp:output_form>. You could do something similar directly in an article, I suppose, and set Textile to Line breaks only (or Leave text untouched).

You also have global break and breakby attributes, as well as trim and replace available to you. They are powerful tools to help you split up lists and do something for each item and/or row. Maybe they’ll help you come to a manageable solution?

colak · 2024-06-08 04:39:55

bashirnoori wrote #337260:

It’s 40 different rates, making section will become too many.
I was thinking if possible putting all in one article body in 40 lines and fetching each line separately like

...

then fetch each line <txp:body id="10" firstline /> <txp:body id="10" secondline /> etc...

Are the 40 rates for different currencies?

If so, you could still have the section, one article per currency. All the articles could be unlisted and you can only have the section_list visible.

Alternatively you can have them all in a table in an article

table(rates).
| 1 USD | 70 AFN |
| 1 EUR | 76 AFN |
| 1 GBP | 78 AFN |

which will render as

1 USD	70 AFN
1 EUR	76 AFN
1 GBP	78 AFN

bashirnoori · 2024-06-10 09:19:04

colak wrote #337263:

Are the 40 rates for different currencies?

If so, you could still have the section, one article per currency. All the articles could be unlisted and you can only have the section_list visible.

Alternatively you can have them all in a table in an article

table(rates)....

which will render as

Yes, it’s all different currencies.
Currently I resolved with each separate article, but it’s hard to edit each article and save it, it means we need 40 times to edit/save as we have 40 different articles.

<txp:article_custom id="10"><div class="rate"><txp:title /> AFN</div></txp:article_custom>
<txp:article_custom id="11"><div class="rate"><txp:title /> AFN</div></txp:article_custom>
<txp:article_custom id="12"><div class="rate"><txp:title /> AFN</div></txp:article_custom>
... all other 37 remaining

I was expecting to add all in one article to edit and save all one time easily.
I can’t do that in a table as the design is prepared in different div/span classes, here is the screenshot, just the right column numbers are dynamic through the articles.

etc · 2024-06-10 10:34:43

Instead of articles, at least in txp 4.9, you could put the comma-separated rates in a form, say currency:

70.58, 76.80, 90.23, ...

Then call

<div class="rate"><txp::currency breakby offset="0" limit="1" /> AFN</div>
<div class="rate"><txp::currency breakby offset="1" limit="1" /> AFN</div>
<div class="rate"><txp::currency breakby offset="2" limit="1" /> AFN</div>
... all other 37 remaining

That’s not perfect, since you have to remember the currencies order when modifying a rate, but more performant. There is certainly a better solution, but we’d need to see you table template.

bashirnoori · 2024-06-10 12:42:44

I’ve txp 4.8.8 as I didn’t see if the official txp 4.9 was released.
Here is the HTML section of my currency exchange rates:


<div class="exchange">
  <div class="item">
    <span class="flag-us"></span> 1 USD <div class="rate">70 AFN</div>
  </div>
  <div class="item">
    <span class="flag-eur"></span> 1 EURO <div class="rate">76 AFN</div>
  </div>
  <div class="item">
    <span class="flag-uk"></span> 1 GBP <div class="rate">90 AFN</div>
  </div>
  <div class="item">
    all other 37 remaining ...
  </div>
</div>

etc · 2024-06-10 13:06:02

Then probably the simplest option is installing etc_query plugin and storing the rates in some article/form/variable in JSON format:

<txp:variable name="currency">[
{"sym":"us", "cur":"USD", "rate":70},
{"sym":"eur", "cur":"EURO", "rate":76},
{"sym":"uk", "cur":"GBP", "rate":90}
]</txp:variable>

<txp:etc_query data='<txp:variable name="currency" />' markup="json" wraptag="div" class="exchange">
  <div class="item">
    <span class="flag-{sym?}"></span> 1 {cur?} <div class="rate">{rate?} AFN</div>
  </div>
</txp:etc_query>

JSON can be replaced by xml, ini or csv if needed.

colak · 2024-06-11 17:58:12

Another way is to create a shortcode. Start by creating a form called rates and add:

  <div class="item">
    <span class="flag-<txp:if_yield name="currency">"></span> 1 <txp:if_yield name="currency"> <div class="rate"><txp:if_yield name="rate"> AFN</div>
  </div>

After that, add in an article article,

notextile.
<div class="exchange">
<txp::rates currency="USD" rate="70" />
<txp::rates currency="EUR" rate="76" />
<txp::rates currency="GBP" rate="78" />
</div>

Textpattern CMS

Textpattern CMS support forum

#1 2024-06-07 16:29:16