Tagging URL --> Summary Page

Well, i think it is not needed to stay on markdown-output. i think i will create html directly for my used template (lingonberry).

Im not sure i follow you. It’s in a snippet / tag combination so you don’t get to see the markdown in your snippet, because it is behind the scenes. It would have been totally fine to use HTML or even Bricks, I think.

Exactly, it’s not a text file.

I think/thought, using kirbytext() to generate html output is pre-designed by css of template? so the output is different on every template?

well… you see, i’m not a coder =)

You can totally throw HTML in a Kirby Textarea in the panel and it will handle it :slight_smile: But don’t though, it confuses clients :slight_smile:

I must admit I don’t understand that sentence. First of all, a template generates HTML. The Markup and classes together with your CSS file then determine what your page actually looks like in the browser.

Kirbytext parses Markdown and Kirbytag into HTML. But the question is what else you want to do with that Markdown hidden away in a PHP template? Of course, you could write your Markdown to file and then do whatever you want with those files. But I don’t see what you gain from generating Markdown and then parsing it to HTML in that snippet apart from making your life more difficult than necessary.

i thought, that the generated html of kirbytext() has any style related content, like classes or something like that.

well… maybe this all is just a missunderstanding by me. i’m realy not a coder =)

i’ll give it a try to generate html table instead of markdown which then will be converted via kirbytext().

Well, if the text in a text file contains any classes - added via kirbytags (e.g. (link: some.pdf class: someclass) or MarkdownExtra, or even via HTML itself - than the generated output will contain classes, yes.

ok… i did it in html - and i like the output =)
both columns are now responsive.

// generate html-table of array
foreach($finalarray as $taggroupname => $taggroup) {
echo '<h3>' . $taggroupname . '</h3>';
echo '
<table style="table-layout: fixed;">
 <thead>
   <tr>
     <th>Link</th>
     <th style="text-align: right;">Text</th>
   </tr>
 </thead>
 <tbody>';

foreach($taggroup as $tgi) { // taggroupitem
$linkstring = url::short($tgi['link']);
echo '
 <tr>
   <td style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"><a href="' . $tgi['link'] . '">' . $linkstring . '</a></td>';
echo '
   <td style="text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"><a href="' .  $tgi['pagelink'] . '">' . $tgi['text'] . '</a></td>';
echo '
 </tr>';
}
echo '
 </tbody>
</table>
<br>
';
}

Thats better :slight_smile:

I would suggest just putting a class on it though rather then using inline styles, and make it possible to change the class name as a tag attribute, or a config option. The config option is probably a better idea because it will change the class on all the tables at once. If you do it on the tag, you run into the possibility of some tables ending up with a different class.

Then you can style it easily this way (assuming your using sass):

.link-table {
  table-layout: fixed;

  td {
    // All TD's
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    white-space: nowrap;
    // Center the middle TD
    + td {
      text-align: center;
    }
    // Right align the last TD
    &:last-child {
      text-align: right;
    }
  }
}

CSS:

.link-table {
  table-layout: fixed;
}
.link-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  white-space: nowrap;
}
.link-table td + td {
  text-align: center;
}
.link-table td:last-child {
  text-align: right;
}

I am not sure what the overflow: hidden is being used for in this case. That’s usually a trick for clearing floats etc. I don’t think its doing much on your table cells. It hides anything that might fall out side the cell.

And I would highly recommend that you do not echo your HTML. Write your HTML as usual and include your PHP tags. Makes your code much more readable and easier to maintain. Echoing HTML isn’t considered good coding style.

For example (I left out the first part):

<table>
<tbody>
<?php
foreach($taggroup as $tgi): // taggroupitem
$linkstring = url::short($tgi['link']);
?>
 <tr>
   <td class="my-cell-class"><a href="<?= $tgi['link'] ?>"><?= $linkstring ?></a></td>
   <td class="my-cell-class"><a href="<?=  $tgi['pagelink'] ?>"><?= $tgi['text'] ?></a></td>
 </tr>
<?php endforeach ?>
 </tbody>
</table>
2 Likes

Thx for your suggestions on cleaning the code.
Well… for me, it works. And i don’t plan to be a coder =)
Maybe i will go for external css file in future and/or config options. My ambition to release a plugin is realy lowered because of spending realy too much time for this. The code-wreck is published in this thread and everyone is invited to took those code-lines to release his/her own plugin. A little mention would be nice, but is not mandatory.

thx so far

Just as a site note.

In this context you need it to make text-overflow: ellipsis; work.

@lukaskleinschmidt Oh yes, that would make sense. I haven’t used ellipsis in a million years. It would get clipped without the overflow property.

If I wanted to make this sort of universally usable, I’d probably create an endpoint that returns the data dynamically as JSON, than I could consume this API in whatever way I want.

as far as i’m able to tell so, my code seems to produce such universal endpoint in the finalarray. but i wanted to go one more step by giving the enduser with no coding knowledge a solution.

nevermind… that was an idea based on semy-fault knowledge. now i know/see, that this was not neccessary. the html output gives the same result.

anyway… anyone who need a structured array and knows how to deal with it, can grab it from source.

thx again =)