Link Field

Overview

The Link field renders a URL input paired with an open-in-new-tab toggle. It returns an associative array with url and target keys. Use it for call-to-action buttons, banner links, logo links, navigation items, or any other setting that needs both a URL and a target option collected together.

---

Field Registration

php

[
    'id'      => 'hero_button_link',
    'type'    => 'link',
    'title'   => __('Hero Button Link', 'your-textdomain'),
    'subtitle' => __('URL and target for the primary hero CTA button', 'your-textdomain'),
    'default' => [
        'url'    => '',
        'target' => '_self',
    ],
]

---

Field Options

Option	Type	Required	Description
id	string	✅	Unique field identifier — used as the option key
type	string	✅	Must be link
title	string	✅	Label shown above the field
subtitle	string	—	Smaller descriptive text shown below the label
desc	string	—	Help text shown below the link inputs
default	array	—	Default values — see sub-options below
required	array	—	Conditional logic rules — see Conditional Logic

Default Sub-options

Key	Type	Description
url	string	The link URL — e.g. https://example.com or a relative path
target	string	Link target — _self (same tab) or _blank (new tab)

---

Return Value

Type: array

Returns an associative array with url and target keys, or the default array if nothing has been saved yet.

php

$link = themeplus_get_option( 'hero_button_link', [] );
// Returns:
// [
//     'url'    => 'https://example.com/shop',
//     'target' => '_blank',
// ]

---

Usage Examples

Basic link output

php

$link   = themeplus_get_option( 'hero_button_link', ['url' => '', 'target' => '_self'] );
$url    = $link['url']    ?? '';
$target = $link['target'] ?? '_self';

if ( $url ) {
    $rel = $target === '_blank' ? ' rel="noopener noreferrer"' : '';
    echo '<a href="' . esc_url( $url ) . '" target="' . esc_attr( $target ) . '"' . $rel . ' class="btn btn--primary">';
    echo esc_html__( 'Shop Now', 'your-textdomain' );
    echo '</a>';
}

CTA button with label

php

[
    'id'      => 'cta_button',
    'type'    => 'link',
    'title'   => __('CTA Button Link', 'your-textdomain'),
    'default' => ['url' => '', 'target' => '_self'],
],
[
    'id'      => 'cta_button_label',
    'type'    => 'text',
    'title'   => __('CTA Button Label', 'your-textdomain'),
    'default' => __('Get Started', 'your-textdomain'),
],

php

$link  = themeplus_get_option( 'cta_button', ['url' => '', 'target' => '_self'] );
$label = themeplus_get_option( 'cta_button_label', __('Get Started', 'your-textdomain') );

$url    = $link['url']    ?? '';
$target = $link['target'] ?? '_self';

if ( $url && $label ) {
    $rel = $target === '_blank' ? ' rel="noopener noreferrer"' : '';
    echo '<a href="' . esc_url( $url ) . '" target="' . esc_attr( $target ) . '"' . $rel . ' class="btn">';
    echo esc_html( $label );
    echo '</a>';
}

Logo link

php

$logo_link = themeplus_get_option( 'logo_link', ['url' => home_url('/'), 'target' => '_self'] );

$url    = $logo_link['url']    ?? home_url('/');
$target = $logo_link['target'] ?? '_self';
$rel    = $target === '_blank' ? ' rel="noopener noreferrer"' : '';

echo '<a href="' . esc_url( $url ) . '" target="' . esc_attr( $target ) . '"' . $rel . ' class="site-logo">';
// logo image output here
echo '</a>';

Multiple CTA links

php

$primary   = themeplus_get_option( 'hero_primary_link',   ['url' => '', 'target' => '_self'] );
$secondary = themeplus_get_option( 'hero_secondary_link', ['url' => '', 'target' => '_self'] );

foreach ( [
    ['link' => $primary,   'label' => __('Get Started', 'your-textdomain'), 'class' => 'btn--primary'],
    ['link' => $secondary, 'label' => __('Learn More',  'your-textdomain'), 'class' => 'btn--secondary'],
] as $item ) {
    $url    = $item['link']['url']    ?? '';
    $target = $item['link']['target'] ?? '_self';

    if ( ! $url ) continue;

    $rel = $target === '_blank' ? ' rel="noopener noreferrer"' : '';
    echo '<a href="' . esc_url( $url ) . '" target="' . esc_attr( $target ) . '"' . $rel . ' class="btn ' . esc_attr( $item['class'] ) . '">';
    echo esc_html( $item['label'] );
    echo '</a>';
}

With a conditional field

php

[
    'id'      => 'enable_hero_cta',
    'type'    => 'toggle',
    'title'   => __('Enable Hero CTA Button', 'your-textdomain'),
    'default' => true,
],
[
    'id'       => 'hero_cta_label',
    'type'     => 'text',
    'title'    => __('Button Label', 'your-textdomain'),
    'default'  => __('Get Started', 'your-textdomain'),
    'required' => ['enable_hero_cta', '==', true],
],
[
    'id'       => 'hero_cta_link',
    'type'     => 'link',
    'title'    => __('Button Link', 'your-textdomain'),
    'default'  => ['url' => '', 'target' => '_self'],
    'required' => ['enable_hero_cta', '==', true],
],

---

Notes

• Always escape link URLs with esc_url() before outputting in HTML.
• When target is _blank, always add rel="noopener noreferrer" to the anchor tag to prevent reverse tabnapping — a security best practice for external links.
• Always check that url is non-empty before rendering the anchor element.
• For a plain URL input without a target control, use a Text field with type="url" or the standard Text field instead.