---
title: "Tag Factory"
version: "5.19"
---

> Documentation Index
> Fetch the complete documentation index at: https://docs.phalcon.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Tag Factory

## Overview

[Phalcon\Html\TagFactory][html-tagfactory] is a component that generates HTML tags. This component creates a new class locator with predefined HTML tag classes attached to it. Each tag class is lazy-loaded for maximum performance. To instantiate the factory and retrieve a tag helper, you need to call `newInstance()` by passing a `Phalcon\Html\Escaper` object to it.

If you are using the [Phalcon\Di\FactoryDefault][di-factorydefault] container for your application, the [Phalcon\Html\TagFactory][html-tagfactory] is already registered for you with the name `tag`.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\TagFactory;

$escaper = new Escaper();
$factory = new TagFactory($escaper);
$helper  = $factory->newInstance('a');
```

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

$helper = $container->tag->newInstance('a');
```

The registered names for respective helpers are:

| Name                 | Class                                                       |
|----------------------|-------------------------------------------------------------|
| `a`                  | `Phalcon\Html\Helper\Anchor`                                |
| `aRaw`               | `Phalcon\Html\Helper\Anchor` (raw)                          |
| `base`               | `Phalcon\Html\Helper\Base`                                  |
| `breadcrumbs`        | `Phalcon\Html\Helper\Breadcrumbs`                           |
| `body`               | `Phalcon\Html\Helper\Body`                                  |
| `button`             | `Phalcon\Html\Helper\Button`                                |
| `buttonRaw`          | `Phalcon\Html\Helper\Button` (raw)                          |
| `close`              | `Phalcon\Html\Helper\Close`                                 |
| `doctype`            | `Phalcon\Html\Helper\Doctype`                               |
| `element`            | `Phalcon\Html\Helper\Element`                               |
| `elementRaw`         | `Phalcon\Html\Helper\Element` (raw)                         |
| `form`               | `Phalcon\Html\Helper\Form`                                  |
| `friendlyTitle`      | `Phalcon\Html\Helper\FriendlyTitle`                         |
| `img`                | `Phalcon\Html\Helper\Img`                                   |
| `inputCheckbox`      | `Phalcon\Html\Helper\Input\Checkbox`                        |
| `inputCheckboxGroup` | `Phalcon\Html\Helper\Input\CheckboxGroup`                   |
| `inputColor`         | `Phalcon\Html\Helper\Input\Generic` (`type=color`)          |
| `inputDate`          | `Phalcon\Html\Helper\Input\Generic` (`type=date`)           |
| `inputDateTime`      | `Phalcon\Html\Helper\Input\Generic` (`type=datetime`)       |
| `inputDateTimeLocal` | `Phalcon\Html\Helper\Input\Generic` (`type=datetime-local`) |
| `inputEmail`         | `Phalcon\Html\Helper\Input\Generic` (`type=email`)          |
| `inputFile`          | `Phalcon\Html\Helper\Input\Generic` (`type=file`)           |
| `inputHidden`        | `Phalcon\Html\Helper\Input\Generic` (`type=hidden`)         |
| `inputImage`         | `Phalcon\Html\Helper\Input\Generic` (`type=image`)          |
| `inputInput`         | `Phalcon\Html\Helper\Input\Generic` (`type=text`)           |
| `inputMonth`         | `Phalcon\Html\Helper\Input\Generic` (`type=month`)          |
| `inputNumeric`       | `Phalcon\Html\Helper\Input\Generic` (`type=number`)         |
| `inputPassword`      | `Phalcon\Html\Helper\Input\Generic` (`type=password`)       |
| `inputRadio`         | `Phalcon\Html\Helper\Input\Radio`                           |
| `inputRadioGroup`    | `Phalcon\Html\Helper\Input\RadioGroup`                      |
| `inputRange`         | `Phalcon\Html\Helper\Input\Generic` (`type=range`)          |
| `inputSearch`        | `Phalcon\Html\Helper\Input\Generic` (`type=search`)         |
| `inputSelect`        | `Phalcon\Html\Helper\Input\Select`                          |
| `inputSubmit`        | `Phalcon\Html\Helper\Input\Generic` (`type=submit`)         |
| `inputTel`           | `Phalcon\Html\Helper\Input\Generic` (`type=tel`)            |
| `inputText`          | `Phalcon\Html\Helper\Input\Generic` (`type=text`)           |
| `inputTextarea`      | `Phalcon\Html\Helper\Input\Textarea`                        |
| `inputTime`          | `Phalcon\Html\Helper\Input\Generic` (`type=time`)           |
| `inputUrl`           | `Phalcon\Html\Helper\Input\Generic` (`type=url`)            |
| `inputWeek`          | `Phalcon\Html\Helper\Input\Generic` (`type=week`)           |
| `label`              | `Phalcon\Html\Helper\Label`                                 |
| `labelRaw`           | `Phalcon\Html\Helper\Label` (raw)                           |
| `link`               | `Phalcon\Html\Helper\Link`                                  |
| `meta`               | `Phalcon\Html\Helper\Meta`                                  |
| `ol`                 | `Phalcon\Html\Helper\Ol`                                    |
| `olRaw`              | `Phalcon\Html\Helper\Ol` (raw)                              |
| `preload`            | `Phalcon\Html\Helper\Preload`                               |
| `script`             | `Phalcon\Html\Helper\Script`                                |
| `style`              | `Phalcon\Html\Helper\Style`                                 |
| `tag`                | `Phalcon\Html\Helper\Tag`                                   |
| `title`              | `Phalcon\Html\Helper\Title`                                 |
| `ul`                 | `Phalcon\Html\Helper\Ul`                                    |
| `ulRaw`              | `Phalcon\Html\Helper\Ul` (raw)                              |
| `voidTag`            | `Phalcon\Html\Helper\VoidTag`                               |

:::info[NOTE]
A single `Phalcon\Html\Helper\Input\Generic` helper backs every type-only `<input>` (color, date, email, file, etc.); it takes the `type` through its constructor (or `setType()`). The `TagFactory` factory method names (`inputColor`, `inputDate`, ...) resolve to it. See [Generic input](#generic-input) below.
:::

### Registration Pipeline

[Phalcon\Html\TagFactory][html-tagfactory] does not extend `Phalcon\Factory\AbstractFactory`. Every helper is registered as a zero-argument `Closure` that returns the fully constructed helper. `set()` accepts only a `Closure`:

```php
public function set(string $name, Closure $definition): void
```

The closure takes no arguments and captures whatever the helper needs - the escaper, the shared `doctype` helper (through `newInstance('doctype')`), the `response` or `url` services - from its own scope. There is no class-string form, no tuple form, and no dependency-key resolution; the closure supplies every constructor argument itself. The built-in helpers are registered the same way, for example `inputColor` is `fn() => new Generic($escaper, $this->newInstance('doctype'), 'color')`.

Resolved instances are cached lazily per name in a separate `instances` map. Calling `set()` with a new closure invalidates the previously cached instance, so the next resolution returns a fresh helper. `has()` reports against the registered names, not the resolved-instance map.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Anchor;
use Phalcon\Html\Helper\Input\Generic;
use Phalcon\Html\TagFactory;

$escaper = new Escaper();
$factory = new TagFactory($escaper);

// Register or override a helper with a zero-argument closure
$factory->set(
'a',
function () use ($escaper, $factory) {
    return new Anchor($escaper, $factory->newInstance('doctype'));
}
);

// The closure supplies any extra constructor arguments itself
// (this is how `inputColor` is registered: Generic with type 'color')
$factory->set(
'inputColor',
function () use ($escaper, $factory) {
    return new Generic($escaper, $factory->newInstance('doctype'), 'color');
}
);

// Re-registering a name invalidates the previously cached instance
$factory->set(
'a',
fn() => new Anchor($escaper, $factory->newInstance('doctype'))
);
```

### Raw Factory Variants

Several helpers accept a final `bool $raw = false` argument to skip escaping (useful, for example, when the inner content is itself markup such as an `<img>` inside an `<a>`). To avoid having to remember the parameter position, the factory exposes `Raw` variants that pin `raw = true` for you:

| Raw variant  | Equivalent of                             |
|--------------|-------------------------------------------|
| `aRaw`       | `a($href, $text, $attributes, true)`      |
| `buttonRaw`  | `button($text, $attributes, true)`        |
| `elementRaw` | `element($tag, $text, $attributes, true)` |
| `labelRaw`   | `label($label, $attributes, true)`        |
| `olRaw`      | `ol($text, $attributes, true)`            |
| `ulRaw`      | `ul($text, $attributes, true)`            |

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();
$image     = $container->tag->img('https://phalcon.io/img/phalcon.png');

// Without Raw (passing true as 4th arg)
echo $container->tag->a('https://phalcon.io', $image, [], true);

// Same result with the Raw variant - no need for the trailing true
echo $container->tag->aRaw('https://phalcon.io', $image);
```

### Method call

If you do not wish to call `newInstance()`, you can always use the method call that corresponds to the name of the helper. Some helpers accept a `bool` `$raw` parameter, which defines whether the input will be escaped or not. This is useful when creating anchor links with images.

```php
public function a(
string $href, 
string $text, 
array $attributes = [], 
bool $raw = false
): string

public function base(
string $href, 
array $attributes = []
): string

public function body(
array $attributes = []
): string

public function breadcrumbs(
string $indent = '    ',
string $delimiter = "\n"
): Breadcrumbs

public function button(
string $text, 
array $attributes = [], 
bool $raw = false
): string

public function close(
string $tag, 
bool $raw = false
): string

public function doctype(
int $flag, 
string $delimiter
): Doctype

public function element(
string $tag, 
string $text, 
array $attributes = [], 
bool $raw = false
): string

public function form(
array $attributes = []
): string

public function img(
string $src, 
array $attributes = []
): string

public function inputCheckbox(
string $name, 
string $value = null, 
array $attributes = []
): Checkbox

public function inputColor(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputDate(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputDateTime(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputDateTimeLocal(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputEmail(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputFile(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputHidden(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputImage(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputInput(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputMonth(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputNumeric(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputPassword(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputRadio(
string $name, 
string $value = null, 
array $attributes = []
): Radio

public function inputRange(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputSearch(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputSelect(
string $name, 
string $value = null, 
array $attributes = []
): Select

public function inputSubmit(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputTel(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputText(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputTextarea(
string $name, 
string $value = null, 
array $attributes = []
): Textarea

public function inputTime(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputUrl(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function inputWeek(
string $name, 
string $value = null, 
array $attributes = []
): Generic

public function label(
string $label, 
array $attributes = [], 
bool $raw = false
): string

public function link(
string $indent = '    ', 
string $delimiter = PHP_EOL
): Link

public function meta(
string $indent = '    ', 
string $delimiter = PHP_EOL
): Meta

public function ol(
string $text, 
array $attributes = [], 
bool $raw = false
): Ol

public function script(
string $indent = '    ', 
string $delimiter = PHP_EOL
): Script

public function style(
string $indent = '    ', 
string $delimiter = PHP_EOL
): Style

public function title(
string $indent = '    ', 
string $delimiter = PHP_EOL
): Title

public function ul(
string $text, 
array $attributes = [], 
bool $raw = false
): Ul

public function tag(
string $tag, 
array $attributes = []
): string

public function voidTag(
string $tag, 
array $attributes = []
): string

public function aRaw(
string $href, 
string $text, 
array $attributes = []
): string

public function buttonRaw(
string $text, 
array $attributes = []
): string

public function elementRaw(
string $tag, 
string $text, 
array $attributes = []
): string

public function labelRaw(
string $label, 
array $attributes = []
): string

public function olRaw(
string $text, 
array $attributes = []
): Ol

public function ulRaw(
string $text, 
array $attributes = []
): Ul
```

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

$result = $container->tag->a('https://phalcon.io', 'Phalcon Website');

$image  = $container
->tag
->img('https://phalcon.io/img/phalcon.png')
;

$result = $container
->tag
->a(
    'https://phalcon.io', 
    $image,
    true
)
;
```

### Helpers

All helpers that are used by the [Phalcon\Html\TagFactory][html-tagfactory] are located under the `Phalcon\Html\Helper` namespace. You can create each of these classes individually if you wish to, or you can use the tag factory as shown above.

:::info[NOTE]
The code and output below have been formatted for readability
:::

**Boolean HTML5 attributes**

When an attribute value is set to `true`, the helper renders it as a standalone attribute name (e.g. `async`, `defer`) instead of `async="1"`. This follows the [HTML5 boolean attribute][html5-boolean] specification.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Script;

$escaper = new Escaper();
$helper  = new Script($escaper);

echo $helper('/app.js', ['type' => 'text/javascript', 'async' => true]);
// <script type="text/javascript" async src="/app.js"></script>
```

### `a`

[Phalcon\Html\Helper\Anchor][html-helper-anchor] creates a `<a>` (anchor) tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $href`           | The href                          |
| `string $text`           | The text to display               |
| `array $attributes = []` | Additional attributes (key/value) |
| `bool $raw = false`      | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Anchor;

$escaper = new Escaper();
$helper  = new Anchor($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('/myurl', 'click<>me', $options);
// <a href="/myurl" 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
//     click&lt;&gt;me
// </a>
```

### `base`

[Phalcon\Html\Helper\Base][html-helper-base] creates a `<base>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $href`           | The href                          |
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Base;

$escaper = new Escaper();
$helper  = new Base($escaper);
$options = [
'target' => '_blank',
];

echo $helper('/myurl', $options);
// <base href="/myurl" 
//    target="_blank">
```

### `breadcrumbs`

[Phalcon\Html\Helper\Breadcrumbs][html-helper-breadcrumbs] creates HTML for breadcrumbs based on the existing or passed template.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

A common piece of HTML that is present in many web applications is the breadcrumbs. These are links separated by a space or by the `/` character usually, that represents the tree structure of an application. The purpose is to give users another visual way to navigate throughout the application.

An example is an application that has an `admin` module, an `invoices` area, and a `view invoice` page. Usually, you would select the `admin` module, then from the links you will choose `invoices` (list), and then clicking on one of the invoices in the list, you can view it. To represent this tree-like structure, the breadcrumbs displayed could be:

```php
Home / Admin / Invoices / Viewing Invoice [1234]
``` 

Each of the words above (apart from the last one) are links to the respective pages. This way the user can quickly navigate back to a different area without having to click the back button or use another menu.

[Phalcon\Html\Helper\Breadcrumbs][html-helper-breadcrumbs] offers functionality to add text, URL, icon and attributes to each element. The resulting HTML when calling `render()` will have each breadcrumb formatted and enclosed in the HTML structure defined by the template. Each element will be separated from another using the default separator `<li>/</li>`.

### Methods

```php
public function __invoke(
string $indent = '    ',
string $delimiter = PHP_EOL
): static 
```

Sets the indent and delimiter and returns the object back

```php
public function add(
string $text,
string $link = '',
string $icon = '',
array $attributes = []
): static 
```

Adds a new crumb.

```php
// Adding a crumb with a link
$breadcrumbs->add("Home", "/");

// Adding a crumb with added attributes
$breadcrumbs->add("Home", "/", ["class" => "main"]);

// Adding a crumb without a link (normally the last one)
$breadcrumbs->add("Users");
```

```php
public function clear(): void
```

Clears the crumbs

```php
$breadcrumbs->clear()
```

```php
public function clearAttributes(): static
```

Clears the attributes of the parent element

```php
public function getAttributes(): array
```

Returns the attributes of the parent element

```php
public function getPrefix(): string
```

Returns the link prefix that is prepended to every non-empty link during rendering.

```php
public function getSeparator(): string
```

```php
public function getTemplate(): array
```

Returns the current template

```php
public function remove(int $index): void
```

Removes a crumb by index.

```php
$breadcrumbs->remove(2);
```

```php
public function render(): string
```

Renders and outputs breadcrumbs based on previously set template.

```php
echo $breadcrumbs->render();
```

```php
public function setAttributes(array $attributes): static
```

Sets the attributes for the parent element

```php
public function setPrefix(string $prefix): static
```

Sets a string prefix that is prepended to every non-empty link during rendering. When called, any previously injected `UrlInterface` is replaced by the static prefix string.

```php
public function setSeparator(string $separator): static
```

Sets the separator

```php
public function setTemplate(
string $main,
string $line,
string $last
): static 
```

Sets the HTML template

```php
public function toArray(): array
```

Returns the internal breadcrumbs array

### Subdirectory / Prefix Support

When a Phalcon application is installed in a subdirectory (e.g. `https://example.com/myapp/`), links added with `add()` need the subdirectory prepended so they resolve correctly.

**Using `setPrefix()`** - a static string is prepended to every non-empty link:

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\TagFactory;

$escaper    = new Escaper();
$tagFactory = new TagFactory($escaper);

$breadcrumbs = $tagFactory->breadcrumbs();
$breadcrumbs->setPrefix('/myapp');

$breadcrumbs
->add('Home', '/')
->add('Admin', '/admin')
->add('Invoices')
;

// Links rendered as /myapp/, /myapp/admin
echo $breadcrumbs->render();
```

**Using `TagFactory` with a `UrlInterface`** - when a URL service is passed to `TagFactory`, it is forwarded to `Breadcrumbs` automatically. Every link is then resolved through `$url->get()`, which handles the base URI and double-slash normalisation:

```php
<?php

use Phalcon\Di\FactoryDefault;
use Phalcon\Html\TagFactory;

$container  = new FactoryDefault();
$url        = $container->get('url');
$tagFactory = new TagFactory($container->get('escaper'), [], null, $url);

$breadcrumbs = $tagFactory->breadcrumbs();

$breadcrumbs
->add('Home', '/')
->add('Invoices', '/invoices')
->add('View')
;

echo $breadcrumbs->render();
```

### Templates

The default templates are:

*Main*

```html
<nav%attributes%>
<ol>
%items%
</ol>
</nav>
```

*Line*

```html
<li%attributes%><a href="%link%">%icon%%text%</a></li>
```

*Last Element*

```html
<li><span%attributes%>%text%</span></li>
```

A different template can be supplied to match the needs of the application. The template can be set using the `setTemplate()` method. The template is a string that can contain placeholders that will be replaced by the actual values when rendering the breadcrumbs.

The available placeholders are:

| Placeholder    | Description                          | Applies to |
|----------------|--------------------------------------|:----------:|
| `%attributes%` | The attributes of the parent element |   Parent   |
| `%items%`      | The list of items                    |   Parent   |
| `%link%`       | The link of the element              |  Element   |
| `%text%`       | The text of the element              |  Element   |
| `%icon%`       | The icon of the element              |  Element   |
| `%attributes%` | The attributes of the element        |  Element   |

### Separator

The separator is what is printed between each of the breadcrumbs. By default, the separator is `<li>/</li>`. You can change the separator by calling `setSeparator()`.

### Example

Our application needs to display breadcrumbs in the following format:

```html
Home > Admin > Invoices > Viewing Invoice [1234]
```

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\TagFactory;

$escaper = new Escaper();
$tagFactory = new TagFactory($escaper);

$separator = '
<span class="mx-5 text-gray-500 dark:text-gray-300 rtl:-scale-x-100">
<svg xmlns="http://www.w3.org/2000/svg" 
     class="w-5 h-5" 
     viewBox="0 0 20 20" 
     fill="currentColor">
    <path fill-rule="evenodd" 
          d="M7.293 14.707a1 1 0 010-1.414L10.586 
            10 7.293 6.707a1 1 0 011.414-1.414l4 
            4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" 
          clip-rule="evenodd" />
</svg>
</span>
';

$homeIcon = '
<svg xmlns="http://www.w3.org/2000/svg" 
 class="w-5 h-5" viewBox="0 0 20 20" 
 fill="currentColor">
<path d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 
        0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 
        0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 
        0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 
        0 001.414-1.414l-7-7z" />
</svg>
';

$mainTemplate = '
<div%attributes%>
%items%
</div>
';
$lineTemplate = '
<a href="%link%"%attributes%>
%icon%%text%
</a>
';
$lastTemplate = '
<a href="%link%"%attributes%>
%icon%%text%
</a>
';

$homeAttributes = [
'class' => 'text-gray-600 dark:text-gray-200',
];
$lineAttributes = [
'class' => 'text-gray-600 dark:text-gray-200 hover:underline',
];
$lastAttributes = [
'class' => 'text-blue-600 dark:text-blue-400 hover:underline',
];

$breadcrumbs
->setTemplate($mainTemplate, $lineTemplate, $lastTemplate)
->setSeparator($separator)
->add('', '#', $homeIcon, $homeAttributes)
->add('Admin', '#', '', $lineAttributes)
->add('Invoices', '#', '', $lineAttributes)
->add('Viewing Invoice [1234]', '#', '', $lastAttributes)
;

echo $breadcrumbs->render();    
```

Output HTML:

```html
<div class="flex items-center py-4 overflow-x-auto whitespace-nowrap">
<a href="#" class="text-gray-600 dark:text-gray-200">
    <svg xmlns="http://www.w3.org/2000/svg" 
         class="w-5 h-5" 
         viewBox="0 0 20 20" 
         fill="currentColor">
        <path d="M10.707 2.293a1 1 
            0 00-1.414 0l-7 7a1 1 
            0 001.414 1.414L4 10.414V17a1 1 
            0 001 1h2a1 1 0 001-1v-2a1 1 
            0 011-1h2a1 1 0 011 1v2a1 1 
            0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 
            0 001.414-1.414l-7-7z" />
    </svg>
</a>

<span class="mx-5 text-gray-500 dark:text-gray-300 rtl:-scale-x-100">
    <svg xmlns="http://www.w3.org/2000/svg" 
         class="w-5 h-5" 
         viewBox="0 0 20 20" 
         fill="currentColor">
        <path fill-rule="evenodd" 
              d="M7.293 14.707a1 1 
                0 010-1.414L10.586 10 7.293 6.707a1 1 
                0 011.414-1.414l4 4a1 1 
                0 010 1.414l-4 4a1 1 
                0 01-1.414 0z" 
              clip-rule="evenodd" />
    </svg>
</span>

<a href="#" class="text-gray-600 dark:text-gray-200 hover:underline">
    Admin
</a>

<span class="mx-5 text-gray-500 dark:text-gray-300 rtl:-scale-x-100">
    <svg xmlns="http://www.w3.org/2000/svg" 
         class="w-5 h-5" 
         viewBox="0 0 20 20" 
         fill="currentColor">
        <path fill-rule="evenodd" 
              d="M7.293 14.707a1 1 
                0 010-1.414L10.586 10 7.293 6.707a1 1 
                0 011.414-1.414l4 4a1 1 
                0 010 1.414l-4 4a1 1 
                0 01-1.414 0z" 
              clip-rule="evenodd" />
    </svg>
</span>

<a href="#" class="text-gray-600 dark:text-gray-200 hover:underline">
    Invoices
</a>

<span class="mx-5 text-gray-500 dark:text-gray-300 rtl:-scale-x-100">
    <svg xmlns="http://www.w3.org/2000/svg" 
         class="w-5 h-5" 
         viewBox="0 0 20 20" fill="currentColor">
        <path fill-rule="evenodd" 
              d="M7.293 14.707a1 1 
                0 010-1.414L10.586 10 7.293 6.707a1 1 
                0 011.414-1.414l4 4a1 1 
                0 010 1.414l-4 4a1 1 
                0 01-1.414 0z" 
              clip-rule="evenodd" />
    </svg>
</span>

<a href="#" class="text-blue-600 dark:text-blue-400 hover:underline">
    Viewing Invoice [1234]
</a>
</div>
```

### `body`

[Phalcon\Html\Helper\Body][html-helper-body] creates a `<body>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Body;

$escaper = new Escaper();
$helper  = new Body($escaper);
$options = [
'class' => 'my-class',
'id'    => 'my-id',
];

echo $helper($options);
// <body id="my-id" class="my-class">
```

:::info[NOTE]
This helper creates only the opening `<body>` tag. You will need to use the `Close` helper to generate the closing `</body>` tag.
:::

### `button`

[Phalcon\Html\Helper\Button][html-helper-button] creates a `<button>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $text`           | The text to display               |
| `array $attributes = []` | Additional attributes (key/value) |
| `bool $raw = false`      | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Button;

$escaper = new Escaper();
$helper  = new Button($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('click<>me', $options);
// <button 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
//     click&lt;&gt;me
// </button>
```

### `close`

[Phalcon\Html\Helper\Close][html-helper-close] creates a closing tag.

| Parameter           | Description                       |
|---------------------|-----------------------------------|
| `string $text`      | The text to display               |
| `bool $raw = false` | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Close;

$escaper = new Escaper();
$helper  = new Close($escaper);

echo $helper('form');
// </form>
```

### `doctype`

[Phalcon\Html\Helper\Doctype][html-helper-doctype] creates a `<doctype>` tag.

| Parameter           | Description                       |
|---------------------|-----------------------------------|
| `int $flag`         | The text to display               |
| `string $delimiter` | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Doctype;

$escaper = new Escaper();
$helper  = new Doctype($escaper);

echo $helper(Doctype::XHTML11, '-:-');
// <!DOCTYPE html
//     PUBLIC "-//W3C//DTD XHTML 1.1//EN"-:-
//     "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd\">-:-
```

### `element`

[Phalcon\Html\Helper\Element][html-helper-element] creates a tag based on the passed `name`.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $tag`            | The href                          |
| `string $text`           | The text to display               |
| `array $attributes = []` | Additional attributes (key/value) |
| `bool $raw = false`      | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Element;

$escaper = new Escaper();
$helper  = new Element($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('address', 'click<>me', $options);
// <address 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
//     click&lt;&gt;me
// </address>
```

### `form`

[Phalcon\Html\Helper\Form][html-helper-form] creates a `<form>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Form;

$escaper = new Escaper();
$helper  = new Form($escaper);
$options = [
'class'   => 'my-class',
'name'    => 'my-name',
'id'      => 'my-id',
'method'  => 'post',
'enctype' => 'multipart/form-data'
];

echo $helper($options);
// <form 
//    id="my-id" 
//    name="my-name" 
//    class="my-class"
//    method="post"
//    enctype="multipart/form-data">
```

:::info[NOTE]
This helper creates only the opening `<form>` tag. You will need to use the `Close` helper to generate the closing `</form>` tag.
:::

### `friendlyTitle`

[Phalcon\Html\Helper\FriendlyTitle][html-helper-friendlytitle] converts text to a URL-friendly slug.

| Parameter                     | Description                                |
|-------------------------------|--------------------------------------------|
| `string $text`                | The text to convert                        |
| `string $separator = '-'`     | The separator character                    |
| `bool $lowercase = true`      | Convert the result to lowercase            |
| `array\|string $replace = []` | Characters/strings to replace with a space |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\FriendlyTitle;

$escaper = new Escaper();
$helper  = new FriendlyTitle($escaper);

echo $helper('Hello World');
// hello-world

echo $helper('Hello World', '_');
// hello_world

echo $helper('Hello World', '-', false);
// Hello-World

echo $helper('Hello & World');
// hello-and-world

echo $helper('Héllo Wörld');
// hello-world

echo $helper('Hello/World', '-', true, ['/']);
// hello-world
```

### `img`

[Phalcon\Html\Helper\Img][html-helper-img] creates a `<img>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $src`            | The image source                  |
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Img;

$escaper = new Escaper();
$helper  = new Img($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('/my-url', $options);
// <img 
//    src="/my-url" 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
```

### `inputCheckbox`

[Phalcon\Html\Helper\Checkbox][html-helper-input-checkbox] creates a `<input type="checkbox">` tag.

`Checkbox` and `Radio` both extend the shared [Phalcon\Html\Helper\Input\AbstractChecked][html-helper-input-abstractchecked] base. The `checked` attribute matches the `value` using a loose comparison (`==`) by default, so mixed `int`/`string` form input still round-trips correctly. Call `strict(true)` to opt back into strict (`===`) matching.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $name`           | The name                          |
| `string $value`          | The value                         |
| `array $attributes = []` | Additional attributes (key/value) |

**Methods**

```php
public function label(array $attributes)
```

Sets the label for the checkbox

```php
public function strict(bool $flag = true): Checkbox
```

Switches between strict (`===`) and loose (`==`) comparison of `value` against the `checked` attribute. Loose is the default.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\Checkbox;

$escaper = new Escaper();
$helper  = new Checkbox($escaper);
$options = [
'id'        => 'my-id',
'unchecked' => 'no',
'checked'   => 'yes',
];

$result = $helper('my-name', 'yes', $options);

echo $result;
// <hidden name="my_name" value="no">
// <label for="my_id">
//     <input type="checkbox"
//         id="my_id"
//         name="my_name"
//         value="yes"
//         checked="checked" />
//     some text
// </label>
```

### `inputCheckboxGroup`

[Phalcon\Html\Helper\Input\CheckboxGroup][html-helper-input-checkboxgroup] renders a related set of `<input type="checkbox">` tags from a single options array. Every input shares the same HTML `name`, gets an auto-generated `id` derived from `{name}_{value}`, and is paired with a matching `<label>`.

The base class [Phalcon\Html\Helper\Input\AbstractGroup][html-helper-input-abstractgroup] handles option-array parsing, attribute merging, and rendering; `CheckboxGroup` only contributes the matching logic (compare the option value against an array of selected values).

| Parameter                | Description                                                          |
|--------------------------|----------------------------------------------------------------------|
| `string $name`           | Shared HTML name attribute                                           |
| `array $options`         | Map of `value => label` (or `value => [label, ...attrs]`)            |
| `mixed $checked = null`  | Array of selected values, or a scalar (treated as a 1-element array) |
| `array $attributes = []` | Shared HTML attributes applied to every input                        |

Each entry in `$options` can be either:

- A scalar string label: `'admin' => 'Administrator'`
- A rich definition that overrides per-item attributes: `'admin' => ['label' => 'Administrator', 'disabled' => 'disabled']`

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\CheckboxGroup;

$escaper = new Escaper();
$helper  = new CheckboxGroup($escaper);

$options = [
'admin'  => 'Administrator',
'editor' => 'Editor',
'viewer' => ['label' => 'Viewer', 'disabled' => 'disabled'],
];

echo $helper('roles', $options, ['admin', 'editor'], ['class' => 'role-input']);
// <input type="checkbox" id="roles_admin"  name="roles" value="admin"  class="role-input" checked="checked">
// <label for="roles_admin">Administrator</label>
// <input type="checkbox" id="roles_editor" name="roles" value="editor" class="role-input" checked="checked">
// <label for="roles_editor">Editor</label>
// <input type="checkbox" id="roles_viewer" name="roles" value="viewer" disabled="disabled" class="role-input">
// <label for="roles_viewer">Viewer</label>
```

Via the factory:

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

echo $container->tag->inputCheckboxGroup(
'roles[]',
[
    'admin'  => 'Administrator',
    'editor' => 'Editor',
],
'admin'
);
```

:::info[NOTE]
To collect checked values into an array on submission, suffix the name with `[]` (e.g. `roles[]`) or use [Phalcon\Forms\Element\CheckGroup](/5.19/forms/#checkbox-groups) which auto-appends `[]` for you.
:::

### Generic input

[Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] backs every type-only `<input>` (color, date, email, file, etc.). Pass the HTML5 `type` either as the third constructor argument, or after construction via `setType()`.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $name`           | The name                          |
| `string $value`          | The value                         |
| `array $attributes = []` | Additional attributes (key/value) |

**Methods**

```php
public function setType(string $type): Generic
```

Changes the rendered `type=` attribute.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\Generic;

$escaper = new Escaper();
$helper  = new Generic($escaper, null, 'color');
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('test-name', 'test-value', $options);
// <input type="color"
//    value="test-value"
//    id="my-id"
//    name="my-name"
//    class="my-class">

// Switch the rendered type at runtime
$helper->setType('email');
echo $helper('email-name', 'me@phalcon.io');
// <input type="email" value="me@phalcon.io" name="email-name">
```

When called via the factory, the `type` is baked into the recipe so you do not need to pass it yourself:

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

echo $container->tag->inputColor('test-name', 'test-value');
// <input type="color" value="test-value" name="test-name">

echo $container->tag->inputDate('start', '2026-01-01');
// <input type="date" value="2026-01-01" name="start">
```

### `inputColor`

The `inputColor` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=color` baked in. See [Generic input](#generic-input).

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();
$options   = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $container->tag->inputColor('test-name', 'test-value', $options);
// <input type="color"
//    value="test-value"
//    id="my-id"
//    name="my-name"
//    class="my-class">
```

### `inputDate`

The `inputDate` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=date` baked in. See [Generic input](#generic-input).

### `inputDatetime`

The `inputDateTime` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=datetime` baked in. See [Generic input](#generic-input).

### `inputDatetimeLocal`

The `inputDateTimeLocal` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=datetime-local` baked in. See [Generic input](#generic-input).

### `inputEmail`

The `inputEmail` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=email` baked in. See [Generic input](#generic-input).

### `inputFile`

The `inputFile` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=file` baked in. See [Generic input](#generic-input).

### `inputHidden`

The `inputHidden` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=hidden` baked in. See [Generic input](#generic-input).

### `inputImage`

The `inputImage` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=image` baked in. See [Generic input](#generic-input).

### `inputMonth`

The `inputMonth` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=month` baked in. See [Generic input](#generic-input).

### `input`

The `inputInput` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with the default `type=text`. Call `setType()` on the returned helper to render any other HTML5 type. See [Generic input](#generic-input).

### `inputNumeric`

The `inputNumeric` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=number` baked in. See [Generic input](#generic-input).

### `inputPassword`

The `inputPassword` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=password` baked in. See [Generic input](#generic-input).

### `inputRadio`

[Phalcon\Html\Helper\Radio][html-helper-input-radio] creates a `<input type="radio">` tag. `Radio` does not extend `Checkbox`; both share the [Phalcon\Html\Helper\Input\AbstractChecked][html-helper-input-abstractchecked] base. The `checked` attribute matches `value` loosely (`==`) by default - call `strict(true)` to opt into strict (`===`) matching.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $name`           | The name                          |
| `string $value`          | The value                         |
| `array $attributes = []` | Additional attributes (key/value) |

**Methods**

```php
public function label(array $attributes)
```

Sets the label for the radio

```php
public function strict(bool $flag = true): Radio
```

Switches between strict (`===`) and loose (`==`) comparison of `value` against the `checked` attribute. Loose is the default.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\Radio;

$escaper = new Escaper();
$helper  = new Radio($escaper);
$options = [
'id'        => 'my-id',
'unchecked' => 'no',
'checked'   => 'yes',
];

$result = $helper('my-name', 'yes', $options);

echo $result;
// <hidden name="my_name" value="no">
// <label for="my_id">
//     <input type="radio"
//         id="my_id"
//         name="my_name"
//         value="yes"
//         checked="checked" />
//     some text
// </label>
```

### `inputRadioGroup`

[Phalcon\Html\Helper\Input\RadioGroup][html-helper-input-radiogroup] renders a related set of `<input type="radio">` tags from a single options array. Every input shares the same HTML `name`, gets an auto-generated `id` derived from `{name}_{value}`, and is paired with a matching `<label>`.

The base class [Phalcon\Html\Helper\Input\AbstractGroup][html-helper-input-abstractgroup] handles option-array parsing, attribute merging, and rendering; `RadioGroup` only contributes the matching logic (compare the option value against a single scalar).

| Parameter                | Description                                                     |
|--------------------------|-----------------------------------------------------------------|
| `string $name`           | Shared HTML name attribute                                      |
| `array $options`         | Map of `value => label` (or `value => [label, ...attrs]`)       |
| `mixed $checked = null`  | Single scalar value matching the option that should be selected |
| `array $attributes = []` | Shared HTML attributes applied to every input                   |

Per-option attribute overrides use the same `value => [label, ...attrs]` form as `CheckboxGroup`:

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\RadioGroup;

$escaper = new Escaper();
$helper  = new RadioGroup($escaper);

$options = [
'1' => 'Single Date',
'2' => 'Range',
];

echo $helper('dateRange', $options, '2', ['class' => 'control-input']);
// <input type="radio" id="dateRange_1" name="dateRange" value="1" class="control-input">
// <label for="dateRange_1">Single Date</label>
// <input type="radio" id="dateRange_2" name="dateRange" value="2" class="control-input" checked="checked">
// <label for="dateRange_2">Range</label>
```

Via the factory:

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

echo $container->tag->inputRadioGroup(
'plan',
[
    'free' => 'Free',
    'pro'  => 'Pro',
],
'pro'
);
```

### `inputRange`

The `inputRange` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=range` baked in. See [Generic input](#generic-input).

### `inputSearch`

The `inputSearch` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=search` baked in. See [Generic input](#generic-input).

### `inputSelect`

[Phalcon\Html\Helper\Select][html-helper-input-select] creates a `<select>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $name`           | The name                          |
| `string $value`          | The value                         |
| `array $attributes = []` | Additional attributes (key/value) |

**Methods**

```php
public function add(
string $text,
string $value = null,
array $attributes = [],
bool $raw = false
): Select
```

Add an element to the list

```php
public function addPlaceholder(
string $text,
mixed $value = null,
array $attributes = [],
bool $raw = false
): Select
```

Add a placeholder to the element

```php
public function optGroup(
string $label = null,
array $attributes = []
): Select
```

Create an option group

```php
public function fromData(SelectDataInterface $data): Select
```

Populates the select options from a `SelectDataInterface` provider. Flat entries use `value => label` format; nested arrays produce `<optgroup>` sections.

```php
public function placeholder(string $text): Select
```

Injects `<option value="" disabled selected>$text</option>` as the first entry. Useful as a non-selectable hint in the dropdown.

```php
public function selected(string $selected): Select
```

Set the selected option

```php
public function strict(bool $flag = true): Select
```

Switches between strict (`===`) and loose (`==`) comparison of an option's `value` against the `selected` value. Loose is the default so mixed `int`/`string` form input round-trips correctly.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\Select;

$escaper = new Escaper();
$helper  = new Select($escaper);

$options = [
'id' => 'carsList',
];

$result = $helper('    ', PHP_EOL, $options);
$result
->add("Ferrari", "1", ["class" => "active"])
->add("Ford", "2")
->add("Dodge", "3")
->add("Toyota", "4")
->optGroup(
    'oneLabel',
    [
        'class' => 'form-input',
    ]
)
->addPlaceholder(
    'Choose & Car...',
    "0",
    [],
    true,
)
->selected("3")
;

echo $result;
//
//    <select id="carsList">
//        <optgroup class="form-input" label="oneLabel">
//            <option value="0">Choose & Car...</option>
//            <option value="1" class="active">Ferrari</option>
//            <option value="2">Ford</option>
//            <option value="3" selected="selected">Dodge</option>
//            <option value="4">Toyota</option>
//        </optgroup>
//    </select>"
```

**Data providers**

`fromData()` accepts any class implementing `Phalcon\Html\Helper\Input\Select\SelectDataInterface`. Two built-in providers are available.

`Phalcon\Html\Helper\Input\Select\ArrayData` wraps a plain PHP array. Flat entries (`value => label`) produce plain options; nested arrays (`groupLabel => [value => label, ...]`) produce `<optgroup>` sections.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\Select;
use Phalcon\Html\Helper\Input\Select\ArrayData;

$escaper = new Escaper();
$helper  = new Select($escaper);
$result  = $helper('    ', PHP_EOL);

// Flat list
$data = new ArrayData([
'1' => 'Ferrari',
'2' => 'Ford',
'3' => 'Dodge',
]);

$result->fromData($data)->selected('2');

echo $result;

// With optgroups
$grouped = new ArrayData([
'European' => ['1' => 'Ferrari', '5' => 'BMW'],
'American' => ['2' => 'Ford',    '3' => 'Dodge'],
]);

$result = $helper('    ', PHP_EOL);
$result->fromData(new ArrayData($grouped->getOptions()));
echo $result;
```

You can implement `SelectDataInterface` yourself to pull options from any data source (database resultset, configuration, etc.):

```php
<?php

use Phalcon\Html\Helper\Input\Select\SelectDataInterface;

class StatusData implements SelectDataInterface
{
public function getOptions(): array
{
    return [
        'active'   => 'Active',
        'inactive' => 'Inactive',
        'pending'  => 'Pending',
    ];
}
}
```

### `inputSubmit`

The `inputSubmit` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=submit` baked in. See [Generic input](#generic-input).

### `inputTel`

The `inputTel` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=tel` baked in. See [Generic input](#generic-input).

### `inputText`

The `inputText` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=text` baked in. See [Generic input](#generic-input).

### `inputTextarea`

[Phalcon\Html\Helper\TextArea][html-helper-input-textarea] creates a `<textarea>` tags

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $name`           | The name                          |
| `string $value`          | The value                         |
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Input\TextArea;

$escaper = new Escaper();
$helper  = new TextArea($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper('click<>me', $options);
// <textarea 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
//     click&lt;&gt;me
// </textarea>
```

### `inputTime`

The `inputTime` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=time` baked in. See [Generic input](#generic-input).

### `inputUrl`

The `inputUrl` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=url` baked in. See [Generic input](#generic-input).

### `inputWeek`

The `inputWeek` factory name resolves to [Phalcon\Html\Helper\Input\Generic][html-helper-input-generic] with `type=week` baked in. See [Generic input](#generic-input).

### `label`

[Phalcon\Html\Helper\Label][html-helper-label] creates a `<label>` tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $label`          | The label                         |
| `array $attributes = []` | Additional attributes (key/value) |
| `bool $raw = false`      | Whether to escape or not the text |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Label;

$escaper = new Escaper();
$helper  = new Label($escaper);
$options = [
'class' => 'my-class',
'name'  => 'my-name',
'id'    => 'my-id',
];

echo $helper($options);
// <label 
//    id="my-id" 
//    name="my-name" 
//    class="my-class">
```

:::info[NOTE]
This helper creates only the opening `<label>` tag. You will need to use the `Close` helper to generate the closing `</label>` tag.
:::

### `link`

[Phalcon\Html\Helper\Link][html-helper-link] creates a `<link>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Link;

$escaper = new Escaper();
$helper  = new Link($escaper);

$result = $helper();
$result
->add('https://phalcon.io/page/1', ['rel' => 'prev'])
->add('https://phalcon.io/page/2', ['rel' => 'next'])
;

echo $result;
// <link rel="prev" href="https://phalcon.io/page/1" />
// <link rel="next" href="https://phalcon.io/page/2" />
```

### `meta`

[Phalcon\Html\Helper\Meta][html-helper-meta] creates a `<meta>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function add(array $attributes = []): Meta
```

Add an element to the list

```php
public function addHttp(string $httpEquiv, string $content): Meta
```

Adds an HTTP meta tag

```php
public function addName(string $name, string $content): Meta
```

Adds a name meta tag

```php
public function addProperty(string $name, string $content): Meta
```

Adds a property meta tag

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Meta;

$escaper = new Escaper();
$helper  = new Meta($escaper);

$result = $helper();

$result
->add(
    [
        "charset" => 'utf-8',
    ]
)
->addHttp("X-UA-Compatible", "IE=edge")
->addName("generator", "Phalcon")
->addProperty("org:url", "https://phalcon.io")
;

echo $result;
//    <meta charset="utf-8">
//    <meta http-equiv="X-UA-Compatible" content="IE=edge">
//    <meta name="generator" content="Phalcon">
//    <meta property="org:url" content="https://phalcon.io">
```

### `ol`

[Phalcon\Html\Helper\Ol][html-helper-ol] creates a `<ol>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function add(
string $text,
array $attributes = [],
bool $raw = false
): Ol
```

Add an element to the list

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Ol;

$escaper = new Escaper();
$helper  = new Ol($escaper);
$options = [
'id' => 'carsList',
];

$result = $helper('    ', PHP_EOL, $options);

$result
->add("Ferrari", "1", ["class" => "active"])
->add("Ford", "2")
->add("Dodge", "3")
->add("Toyota", "4")
;

echo $result;
// <ol id="carsList">
//     <li class="active">Ferrari</li>
//     <li>>Ford</li>
//     <li>>Dodge</li>
//     <li>>Toyota</li>
// </ol>
```

### `preload`

[Phalcon\Html\Helper\Preload][html-helper-preload] creates a `<link rel="preload">` tag for resource hinting. If a `ResponseInterface` is injected into `TagFactory`, it also sets the HTTP `Link:` header.

| Parameter                | Description                                                         |
|--------------------------|---------------------------------------------------------------------|
| `string $href`           | The resource URL                                                    |
| `string $type = 'style'` | The `as` attribute value (`style`, `script`, `font`, `image`, etc.) |
| `array $attributes = []` | Additional attributes (key/value)                                   |

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Preload;

$escaper = new Escaper();
$helper  = new Preload($escaper);

echo $helper('/my-style.css');
// <link rel="preload" href="/my-style.css" as="style" />

echo $helper('/my-script.js', 'script');
// <link rel="preload" href="/my-script.js" as="script" />

echo $helper('/my-font.woff2', 'font', ['crossorigin' => 'anonymous']);
// <link rel="preload" href="/my-font.woff2" as="font" crossorigin="anonymous" />
```

To also set the HTTP `Link:` response header (for HTTP/2 server push), pass a `ResponseInterface` as the third argument to `TagFactory`:

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\TagFactory;

$escaper  = new Escaper();
$response = $container->get('response');
$factory  = new TagFactory($escaper, [], $response);

echo $factory->preload('/my-font.woff2', 'font');
// <link rel="preload" href="/my-font.woff2" as="font" />
// Also sets header: Link: </my-font.woff2>; rel="preload"; as="font"
```

### `script`

[Phalcon\Html\Helper\Script][html-helper-script] creates a `<script>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function add(
string $url,
array $attributes = [],
int $position = -1
): Script
```

Add a URL to the list. The optional `$position` argument controls the slot in the internal store: a negative value (the default) pushes onto the next auto-increment slot; a non-negative value places the entry at that key, advancing past occupied slots if necessary. Entries are emitted in numerical key order regardless of registration order.

```php
public function beginInternal(): void
```

Starts an output buffer to capture inline JavaScript.

```php
public function endInternal(
array $attributes = [],
int $position = -1
): Script
```

Stops the buffer started by `beginInternal()`, wraps the captured contents in a `<script>` block (with the supplied attributes), and appends it to the asset stack at the optional `$position`.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Script;

$escaper = new Escaper();
$helper  = new Script($escaper);

$result = $helper();

$result
->add('/js/custom.js')
->add('/js/print.js', ['ie' => 'active'])
;

echo $result;
//    <script type="application/javascript" 
//            src="/js/custom.js"></script>
//    <script type="application/javascript" 
//            src="/js/print.js" ie="active"></script>
```

**Positional inserts**

`add()` accepts a third argument that controls where the entry lands in the internal store. Because `__toString()` `ksort()`s the store before rendering, you can interleave entries deterministically:

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Script;

$helper = new Script(new Escaper());
$result = $helper();

$result
->add('/js/a.js')                          // slot 0
->add('/js/c.js', [], 5)                   // slot 5
->add('/js/b.js')                          // slot 1 (next auto-increment)
;

echo $result;
//    <script type="application/javascript" src="/js/a.js"></script>
//    <script type="application/javascript" src="/js/b.js"></script>
//    <script type="application/javascript" src="/js/c.js"></script>
```

**Inline scripts via output buffering**

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Script;

$helper = new Script(new Escaper());
$result = $helper();

$result->beginInternal();
?>
console.log('hello from phalcon');
<?php
$result->endInternal(['type' => 'application/javascript']);

echo $result;
// <script type="application/javascript">
// console.log('hello from phalcon');
// </script>
```

### `style`

[Phalcon\Html\Helper\Style][html-helper-style] creates a `<link>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function add(
string $url,
array $attributes = [],
int $position = -1
): Style
```

Add a URL to the list. The optional `$position` argument controls placement in the internal store the same way it does for `Script::add()`: negative pushes onto the next auto-increment slot; a non-negative value places the entry at that key, advancing past occupied slots. Output is `ksort()`ed by key before rendering.

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Style;

$escaper = new Escaper();
$helper  = new Style($escaper);

$result = $helper();

$result
->add('custom.css')
->add('print.css', ['media' => 'print'])
;

echo $result;
//    <link rel="stylesheet" type="text/css"
//        href="custom.css" media="screen" />
//    <link rel="stylesheet" type="text/css"
//        href="print.css" media="print" />
```

**Positional inserts**

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Style;

$helper = new Style(new Escaper());
$result = $helper();

$result
->add('reset.css')                       // slot 0
->add('theme.css', [], 10)               // slot 10
->add('layout.css')                      // slot 1
;

echo $result;
//    <link rel="stylesheet" type="text/css" href="reset.css" media="screen" />
//    <link rel="stylesheet" type="text/css" href="layout.css" media="screen" />
//    <link rel="stylesheet" type="text/css" href="theme.css" media="screen" />
```

### `tag`

[Phalcon\Html\Helper\Tag][html-helper-tag] is an escape hatch for opening any arbitrary tag without a dedicated helper. It renders only the opening `<name ...>` tag - pair it with the [`close`](#close) helper for the closing tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $tag`            | The tag name                      |
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

echo $container->tag->tag('section', ['class' => 'hero', 'id' => 'top']);
// <section id="top" class="hero">

echo $container->tag->close('section');
// </section>
```

### `voidTag`

[Phalcon\Html\Helper\VoidTag][html-helper-voidtag] is an escape hatch for self-closing (void) tags such as `<hr>` or any custom element that does not need a closing tag.

| Parameter                | Description                       |
|--------------------------|-----------------------------------|
| `string $tag`            | The tag name                      |
| `array $attributes = []` | Additional attributes (key/value) |

```php
<?php

use Phalcon\Di\FactoryDefault;

$container = new FactoryDefault();

echo $container->tag->voidTag('hr', ['class' => 'divider']);
// <hr class="divider" />

echo $container->tag->voidTag('my-custom-element', ['data-id' => '42']);
// <my-custom-element data-id="42" />
```

### `title`

[Phalcon\Html\Helper\Title][html-helper-title] creates a `<title>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function append(
string $text, 
bool $raw = false
): Title
```

Appends text to the current document title

```php
public function get(): string
```

Returns the title

```php
public function set(
string $text, 
bool $raw = false
): Title
```

Sets the title

```php
public function setSeparator(
string $separator, 
bool $raw = false
): Title
```

Sets the separator

```php
public function prepend(
string $text, 
bool $raw = false
): Title
```

Prepends text to the current document title

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Title;

$escaper = new Escaper();
$helper  = new Title($escaper);
$options = [
'id' => 'carsList',
];

$result = $helper();

$result
->setSeparator(' | ')
->set('<Dodge>')
->append('< Ferrari', true)
->prepend('Ford <')
;

echo $result->get();
// &lt; Dodge &gt;

echo $result;
// <title>Ford > | &lt; Dodge &gt; | < Ferrari</title>
```

### `ul`

[Phalcon\Html\Helper\Ul][html-helper-ol] creates a `<ul>` tag.

| Parameter           | Description   |
|---------------------|---------------|
| `string $indent`    | The indent    |
| `string $delimiter` | The delimiter |

**Methods**

```php
public function add(
string $text,
array $attributes = [],
bool $raw = false
): Ol
```

Add an element to the list

```php
<?php

use Phalcon\Html\Escaper;
use Phalcon\Html\Helper\Ul;

$escaper = new Escaper();
$helper  = new Ul($escaper);
$options = [
'id' => 'carsList',
];

$result = $helper('    ', PHP_EOL, $options);

$result
->add("Ferrari", "1", ["class" => "active"])
->add("Ford", "2")
->add("Dodge", "3")
->add("Toyota", "4")
;

echo $result;
// <ul id="carsList">
//     <li class="active">Ferrari</li>
//     <li>>Ford</li>
//     <li>>Dodge</li>
//     <li>>Toyota</li>
// </ul>
```

[di-factorydefault]: /5.19/api/phalcon_di/#difactorydefault
[html-attributes]: /5.19/api/phalcon_html/#htmlattributes
[html-attributes-attributesinterface]: /5.19/api/phalcon_html/#htmlattributesattributesinterface
[html-attributes-renderinterface]: /5.19/api/phalcon_html/#htmlattributesrenderinterface
[html-breadcrumbs]: /5.19/api/phalcon_html/#htmlbreadcrumbs
[html-exception]: /5.19/api/phalcon_html/#htmlexception
[html-helper-abstracthelper]: /5.19/api/phalcon_html/#htmlhelperabstracthelper
[html-helper-abstractlist]: /5.19/api/phalcon_html/#htmlhelperabstractlist
[html-helper-abstractseries]: /5.19/api/phalcon_html/#htmlhelperabstractseries
[html-helper-anchor]: /5.19/api/phalcon_html/#htmlhelperanchor
[html-helper-base]: /5.19/api/phalcon_html/#htmlhelperbase
[html-helper-body]: /5.19/api/phalcon_html/#htmlhelperbody
[html-helper-breadcrumbs]: /5.19/api/phalcon_html/#htmlhelperbreadcrumbs
[html-helper-button]: /5.19/api/phalcon_html/#htmlhelperbutton
[html-helper-close]: /5.19/api/phalcon_html/#htmlhelperclose
[html-helper-doctype]: /5.19/api/phalcon_html/#htmlhelperdoctype
[html-helper-element]: /5.19/api/phalcon_html/#htmlhelperelement
[html-helper-form]: /5.19/api/phalcon_html/#htmlhelperform
[html-helper-friendlytitle]: /5.19/api/phalcon_html/#htmlhelperfriendlytitle
[html-helper-img]: /5.19/api/phalcon_html/#htmlhelperimg
[html-helper-input-abstractchecked]: /5.19/api/phalcon_html/#htmlhelperinputabstractchecked
[html-helper-input-abstractgroup]: /5.19/api/phalcon_html/#htmlhelperinputabstractgroup
[html-helper-input-abstractinput]: /5.19/api/phalcon_html/#htmlhelperinputabstractinput
[html-helper-input-checkbox]: /5.19/api/phalcon_html/#htmlhelperinputcheckbox
[html-helper-input-checkboxgroup]: /5.19/api/phalcon_html/#htmlhelperinputcheckboxgroup
[html-helper-input-generic]: /5.19/api/phalcon_html/#htmlhelperinputgeneric
[html-helper-input-radio]: /5.19/api/phalcon_html/#htmlhelperinputradio
[html-helper-input-radiogroup]: /5.19/api/phalcon_html/#htmlhelperinputradiogroup
[html-helper-input-select]: /5.19/api/phalcon_html/#htmlhelperinputselect
[html-helper-input-textarea]: /5.19/api/phalcon_html/#htmlhelperinputtextarea
[html-helper-label]: /5.19/api/phalcon_html/#htmlhelperlabel
[html-helper-link]: /5.19/api/phalcon_html/#htmlhelperlink
[html-helper-meta]: /5.19/api/phalcon_html/#htmlhelpermeta
[html-helper-ol]: /5.19/api/phalcon_html/#htmlhelperol
[html-helper-preload]: /5.19/api/phalcon_html/#htmlhelperpreload
[html-helper-script]: /5.19/api/phalcon_html/#htmlhelperscript
[html-helper-style]: /5.19/api/phalcon_html/#htmlhelperstyle
[html-helper-tag]: /5.19/api/phalcon_html/#htmlhelpertag
[html-helper-title]: /5.19/api/phalcon_html/#htmlhelpertitle
[html-helper-ul]: /5.19/api/phalcon_html/#htmlhelperul
[html-helper-voidtag]: /5.19/api/phalcon_html/#htmlhelpervoidtag
[html-tagfactory]: /5.19/api/phalcon_html/#htmltagfactory
[html5-boolean]: https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes

Source: https://docs.phalcon.io/5.19/html-tagfactory/index.mdx