Link Field Plugin (improved)

Resources Plugins
1

Hello!

I saw the plugin by @thguenther for links and had ideas for improvements. So I decided to fork it and experiment. I ended up creating a completely different plugin and I think it’s an improvement. It has better UX, more options, and more functionality in the templates. Here’s a demo:

test

Features:

  • Native Kirby fields used for pages, files, url, email (with mailto:), and tel (with tel:)
  • When used in a structure, you get nice previews; for links to a page or file, the native file/page preview is shown
  • Specify link text inside the field itself, you don’t need a separate field just for it
  • Toggle whether the link opens in a new tab
  • Specify a fragment (hash) for the link
  • In the blueprint, you can specify possible link types and settings. For example, if you specify page as the only link type and set settings:false, the field would look just like a pages field, which simplifies the UX.

You also get a bunch of methods for rendering the link in the template. First, you convert the link to a Link instance via $link = $field->toLink(), similar to what you would to for a pages or files field with toPage() and toFile().

Then, you can render it like this:

<a <?= $link->attr()?> class="my link">
  <?= $link->title() ?>
</a>

…which would add href, target and any other attributes accordingly. Internally, it uses Kirby’s Html class to render the link.

My favorite part is that you can also just do:

<?= $link->tag() ?>

…and you’d get a full <a> tag with the correct href, target, and any text you’ve specified.

I’ve used in a couple of projects so far and I’ve had no issues with it. :+1:

Check it here:

https://github.com/OblikStudio/kirby-link-field

Feedback would be much appreciated!

6 Likes
2

Could it be that you’re not validating the url? Seems like required: true has no effect in the panel.

3

Sorry for the late reply. I’ll look into it soon. Could you please open an issue on GitHub in the meantime?

4

Sure, here you go: https://github.com/OblikStudio/kirby-link-field/issues/3

1 Like
5

Hi @hdodov,

Great plugin. Thank you!
I’m not sure how to implement the plugin in my template file. Can you help me?

I tried:

<a <?= $link->attr()?> class="my link">
  <?= $link->title() ?>
</a>

But this gives a error:

Whoops \ Exception \ ErrorException (E_NOTICE)

Undefined variable: link

So I guess I missed the most important part:

First, you convert the link to a Link instance via $link = $field->toLink() , similar to what you would to for a pages or files field with toPage() and toFile() .

How can I do this?

Thank you!

6 
$link = $page->nameOfYourLinkField()->toLink();
7

Like this:

<?php 

$link = $page->buttonlink()->toLink();

<a <?= $link->attr()?> class="my link">
  <?= $link->title() ?>
</a>

 ?>
8

No, like this:

<?php $link = $page->buttonlink()->toLink(); ?>

<a <?= $link->attr()?> class="my link">
  <?= $link->title() ?>
</a>
1 Like
9

I feel very stupid but I can’t get it working.

Error

Call to a member function attr() on null
10

That’s probably because the field is empty-let’s check if we get a link from the field to prevent such errors:

<?php if ($link = $page->buttonlink()->toLink()): ?>
<a <?= $link->attr()?> class="my link">
  <?= $link->title() ?>
</a>
<?php endif ?>
2 Likes
11

Thank you very much!