I want to echo the url which includes an onlick property. Here is my code below:

function royal_sidebutton_body_tag_html() {

    // get plugin option array and store in a variable
    $royal_sidebutton_plugin_option_array   = get_option( 'royal_sidebutton_plugin_options' );

    // fetch individual values from the plugin option variable array
    $royal_sidebutton_text_for_tab          = $royal_sidebutton_plugin_option_array[ 'text_for_tab' ];
    $royal_sidebutton_tab_url               = /*$royal_sidebutton_plugin_option_array[ 'tab_url' ]; */ 'https://www.example.co.uk">';
    $royal_sidebutton_target_blank          = $royal_sidebutton_plugin_option_array[ 'target_blank' ];

    // set the page target
    if ($royal_sidebutton_target_blank == '1') {
        $royal_sidebutton_target_blank = ' target="_blank"';
    }

    // Write HTML to render tab
    echo '<a href="' . esc_url( $royal_sidebutton_tab_url ) . '"' . $royal_sidebutton_target_blank . '><div id="royal_sidebutton_tab" class="royal_sidebutton_contents royal_sidebutton_left">' . esc_html( $royal_sidebutton_text_for_tab ) . '</div></a>';
}

I have tried to add

a href="//www.example.co.uk/login.aspx" target="_blank" title="Login" onclick="popitup(); return false;"

to the variable "$royal_sidebutton_tab_url" but it does not work. It just adds it to the link.

Dani AI

Generated

Brief diagnosis: the option you're echoing currently contains full HTML (and even stray characters like "&gt;) so when you pass it through the code that builds the anchor it becomes broken. , store a plain URL in the option (just "") rather than an entire <a> tag. is right that handing the element into your popup logic is a good idea — but avoid putting markup into the DB and avoid inline JS when you can.

Suggested PHP approach (sanitise the stored value, validate, then build the anchor when rendering):

$url = wp_strip_all_tags( trim( $opts['tab_url'] ) );
if ( ! filter_var( $url, FILTER_VALIDATE_URL ) ) {
  return; // skip output if not a valid URL
}

$open = $opts['open_new_tab'] ? ' target="_blank" rel="noopener noreferrer"' : '';
$attrs = 'href="' . esc_url( $url ) . '"' . $open;
echo '<a ' . $attrs . ' data-popup="1"><div id="royal_sidebutton_tab">' . esc_html( $opts['tab_text'] ) . '</div></a>';

Javascript: attach a handler (preferably via an enqueued script) that reads the link when clicked instead of embedding onclick in the option:

document.addEventListener('click', function(e){
  var a = e.target.closest('a[data-popup]');
  if (!a) return;
  e.preventDefault();
  var href = a.href;
  window.open(href, '_blank', 'noopener');
});

Notes and cautions: always escape output (esc_url, esc_attr, esc_html), validate URLs before use, add rel="noopener noreferrer" for new tabs, and enqueue scripts via WordPress rather than inlining. This keeps data storage simple, avoids broken markup, and separates presentation from behavior.

Hi,
As per my understanding your requirment is when you click on link you get href url

HTML
<a href="//www.example.co.uk/login.aspx" target="_blank" title="Login" onclick="popitup(); return false;">Click</a>

Javascript:
on popitup() function pass 'this' object i.e. onclick="popitup(this)" ;
and in the function get href value
ex: Javascript Function

function popitup(thisobj) {
    var thisurl = thisobj.attr('href');
    alert('Url is: ' + thisurl);
}

Please check and let me know.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.