I've a Link field named field_home_link, attached to a Content Type named Home, and I'm trying to customize how it is rendered as HTML from inside a custom theme.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stucked with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %} 

I've a Link field named field_home_link, attached to a Content Type named Home, and I'm trying to customize how it is rendered as HTML from inside a custom theme.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stuck with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %} 

I've a Link field named field_home_link and I'm trying to customize how it is rendered as HTML from inside a custom theme.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stucked with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %} 

I've a Link field named field_home_link, attached to a Content Type named Home, and I'm trying to customize how it is rendered as HTML from inside a custom theme.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stucked with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %} 

I've a Link field named field_home_link and I'm trying to customize how it is rendered as HTML from inside my custom template.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stucked with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %} 

I've a Link field named field_home_link and I'm trying to customize how it is rendered as HTML from inside a custom theme.

Instead of the default generated HTML:

<a tabindex="0" href="http://example.com">Link text</a> 

I need to render this HTML, adding custom CSS classes on it:

<a href="http://example.com" class="btn-circle btn-circle--blue js-open-modal"> Link text </a> 

But I would like to have most flexibility as possible on the rendered HTML, not only adding classes. For example I might need to add other attributes on the tag <a> or maybe also change the tag <a> with something else.

Would be enough having access to the link's properties (url and text) and arrange them in some custom HTML code.

How can I do this?

I tried to create a template for the link field:

field--field-home-link.html.twig 

but inside this template I don't know how to access link's elements (url and text) and I'm stucked with this:

{% for item in items %} <!-- item.content contains the link element --> {{ item.content }} {% endfor %} 

Is there no way to do something like this?:

{% for item in items %} <a href="{{ item.content.url }}" class="btn-circle btn-circle--blue js-open-modal"> {{ item.content.text }} </a> {% endfor %}