I have a question about my quick and dirty solution for displaying a clickable icon in my wordpress header. I just want to a a quick icon to open a external link so i add the following line to my template.php file:
<a href="<?php echo esc_url( "http://www.google.com/" ); ?>" rel="external" class="site-intro"><i class="fab fa-github-alt fa-2x"> </i></a>
I spotted the region where my header will be initiated and will be styled. The icon will be shown as I wanted it to be but I can not click the link... When I change the link to my home URL or use 'home_url' the icon is clickable. But when I use an external link I get the blocking sign when I hover over the link.
Might anyone know why this is happening?
/**
* Site title
* Displays the gravatar, site title and description
* Hooked into highwind_header()
* @since 1.0
*/
if ( ! function_exists( 'highwind_site_title' ) ) {
function highwind_site_title() {
?>
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home" class="site-intro">
<?php
do_action( 'highwind_site_title_link' );
if ( apply_filters( 'highwind_header_gravatar', true ) ) {
echo get_avatar( apply_filters( 'highwind_header_gravatar_email', $email = esc_attr( get_option( 'admin_email' ) ) ), 256, '', esc_attr( get_bloginfo( 'name' ) ) );
}
?>
<h1 class="site-title"><?php esc_attr( bloginfo( 'name' ) ); ?></h1>
<h2 class="site-description"><?php esc_attr( bloginfo( 'description' ) ); ?>
</h2>
</a>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
<a href="<?php echo esc_url( "http://www.google.com/" ); ?>" rel="external" class="site-intro"><i class="fab fa-github-alt fa-2x"></i></a>
<?php
}
}
