How to mask a link with htlm

byebyebaby

byebyebaby

Affiliate Guard Dog Member
Joined
Feb 11, 2014
Messages
469
Reaction score
131
Hi,

I have a question.

I use this code to make an image into a clickable link:
<a href="https://www.www.nl" target="_blank" rel="nofollow"><img alt="Picture" src="https://www.picture.nl" border="0"></a>

What code or text to I need to add so that people don't see the affiliate link when they click on the picture, but something I want to let them see?
 
byebyebaby

byebyebaby

Affiliate Guard Dog Member
Joined
Feb 11, 2014
Messages
469
Reaction score
131
What I mean is that when I have image, like a casino logo with a link, when you have the mouse over the image, you don't see the affiliate link, but maybe visitABC or something.
 
DaftDog

DaftDog

Affiliate Guard Dog Member
Joined
May 15, 2007
Messages
699
Reaction score
455
byebyebaby said:
What I mean is that when I have image, like a casino logo with a link, when you have the mouse over the image, you don't see the affiliate link, but maybe visitABC or something.
Click to expand...
That would be sneaky. Rather just mask the url like mywebsite. com/goto/abc-casino/

Do you use a masking plugin? If not, try this one for free: https://dinomatic.com/plugins/nonaki
 
roth

roth

New Member
Joined
Nov 1, 2023
Messages
13
Reaction score
5
byebyebaby said:
What I mean is that when I have image, like a casino logo with a link, when you have the mouse over the image, you don't see the affiliate link, but maybe visitABC or something.
Click to expand...

<a href="link" target="_blank" rel="nofollow"><img alt="Picture" src="link" border="0" title="visitABC"></a>
 
roth

roth

New Member
Joined
Nov 1, 2023
Messages
13
Reaction score
5
Ah, if you want to disable the bottom text (showing the URL), you can do it with js.

HTML: 
<!DOCTYPE html>
<html>
<head>
    <style>
        a img {
            cursor: pointer;
            transition: opacity 0.2s ease;
        }

        a:hover img {
            opacity: 0.8;
        }
    </style>
</head>
<body>

<a data-href="link" target="_blank" rel="nofollow">
    <img alt="Picture" src="link" border="0" title="visitABC">
</a>

<script>
var aTags = document.querySelectorAll('a[data-href]');

for(var i = 0; i < aTags.length; i++){
    var aTag = aTags[i];
    aTag.addEventListener('click', function(e){
        e.preventDefault();
        var href = e.target.closest('a').getAttribute('data-href');
        window.location.href = href;
    });   
}
</script>

</body>
</html>


My advice - don't use it.
 
Podcast

Podcast

New Member
Joined
Aug 8, 2024
Messages
2
Reaction score
0
That's right, affiliate links are taken quite normally.
 
You must log in or register to reply here.
Top