v5 Cloud

I'd like to use hooks to replace usernames in posts and @mentions with '...' or 'redacted' or similar. I see there is a hook available to potentially achieve this in posts, but I cannot code.

Hook Application: Forums > front/topics/postContainer > postUsername

<h3 data-ips-hook="postUsername" class='ipsEntry__username'>

{{if $comment->author()->isOnline() AND ( !$comment->author()->isOnlineAnonymously() OR ( $comment->author()->isOnlineAnonymously() AND \IPS\Member::loggedIn()->isAdmin() ) )}}

<span class='ipsOnline' data-ipsTooltip title='{{if $comment->author()->isOnlineAnonymously()}}{lang="online_now_anon" sprintf="$comment->author()->name"}{{elseif $comment->author()->isOnline()}}{lang="online_now" sprintf="$comment->author()->name"}{{endif}}'></span>

{{endif}}

{template="userLink" group="global" app="core" params="$comment->author(), $comment->warningRef(), FALSE, $comment->isAnonymous()"}

{{if $comment->isAnonymous() and \IPS\Member::loggedIn()->modPermission('can_view_anonymous_posters')}}

<a data-ipsHover data-ipsHover-width="370" data-ipsHover-onClick href="{{if $comment->isFirst()}}{$comment->item()->url( 'reveal' )->csrf()}{{else}}{$comment->url( 'reveal' )->csrf()}{{endif}}" rel="nofollow"><span class="ipsAnonymous" data-ipsTooltip title="{lang="post_anonymously_reveal"}"></span></a>

{{endif}}

</h3>

How would go about replacing the usernames with 'redacted' when viewed by guests?

Thanks.

Don't think you can do that from within a hook. As the hook goes before or after that part of the template, or you have the orginal part. But that means, the orinal parts still loads, but have to be hidden. Just like your mobilefooter button.

however you can redact it with some javascript, only depends on pc speed of the viewer how fast it is redacted.. That means username could be visable for a fraction of a second.

document.addEventListener('DOMContentLoaded', () => {
    const signUpSpan = document.querySelector('.ipsUserNav__text');
    const text = signUpSpan?.textContent || '';

    // List of keywords to check for
    const keywords = ['Sign Up', 'Sign In'];

    // Check if any keyword is included in the text
    const hasKeyword = keywords.some(keyword => text.includes(keyword));

    //console.log('User nav text:', `"${text}"`);
    //console.log('Contains any keyword:', hasKeyword);

    if (hasKeyword) {
        //console.log('Sign Up or Sign In detected - replacing usernames with "redacted"');

        // Function to replace username links inside a given container
        function replaceUsernames(containerSelector) {
            const usernameLinks = document.querySelectorAll(`${containerSelector} .ipsUsername`);
            //console.log(`Found username links in ${containerSelector}:`, usernameLinks.length);

            usernameLinks.forEach(link => {
                //console.log('Replacing username link:', link.outerHTML);
                const redactedText = document.createTextNode('redacted');
                link.parentNode.replaceChild(redactedText, link);
            });
        }

        // Replace usernames in all target containers
        replaceUsernames('.ipsData__last-primary');
        replaceUsernames('.ipsData__meta');
        replaceUsernames('.ipsData__last-secondary');

        //console.log('Replacement complete');
    } else {
        //console.log('Neither Sign Up nor Sign In found, no changes made');
    }
});

Wrote this script fast, that when Sign Up is shown on the website, it redacts usernames.
Perhaps there are more elements then ipsData__last-primary, ipsData__meta,ipsData__last-secondary
but those can be added.

Not a very nice solution, but kinda does work..

however is users logged in, also does not have to see it, you beter hide those elements in css as that is a faster way. But css depends then for all users.

Edited May 15, 20251 yr by Moestuin

Hi @Moestuin

Unfortunately, I am looking for a programmatic solution, which prevents usernames from ever being loaded. Else, I would have tried out a CSS hack.. It is to ensure that usernames cannot be indexed - I suspect that a JS solution, like with CSS, would not ensure that they are not indexed.

I probably do not properly understand how hooks are used. I thought there were four options and they would allow some elseif code to replace the username with a generic '..' (or similar) for the username.

I thought there were four places the hooked code might be employed:

1
<h3 data-ips-hook="postUsername" class='ipsEntry__username'>
2
3
</h3>
4

I also assumed that, potentially, code could be to each of the four points.

Hi

1
<h3 data-ips-hook="postUsername" class='ipsEntry__username'>
2
3
</h3>
4

Yes this is exactly how hooks work, you can insert before, insert after. But all orginial code keeps running. So you cannot just copy a template, and insert it into position 1,2,3 or 4. Or the code will run twise, one time as original, and one time your adjust code, in the position where you want. So that will result in double output. (as see in mobile footer).
Normaly hooks are used, to add something before that template, or just in the template at top, or at bottom, or after the template. Like a line or text.
Not to change the template itself.

In 4.7 it was however possbile to change the templates like you want, but to my knowlage that was removed in version 5.
If i am wrong i would like to know, if a moderator can jump in here?

7 hours ago, Moestuin said:

Hi

1
<h3 data-ips-hook="postUsername" class='ipsEntry__username'>
2
[ORIGINAL CODE / HTML]
3
</h3>
4

Yes this is exactly how hooks work, you can insert before, insert after. But all orginial code keeps running. So you cannot just copy a template, and insert it into position 1,2,3 or 4. Or the code will run twise, one time as original, and one time your adjust code, in the position where you want. So that will result in double output. (as see in mobile footer).
Normaly hooks are used, to add something before that template, or just in the template at top, or at bottom, or after the template. Like a line or text.
Not to change the template itself.

In 4.7 it was however possbile to change the templates like you want, but to my knowlage that was removed in version 5.
If i am wrong i would like to know, if a moderator can jump in here?

Hmm. I probably do not understand something fundamental about hooks, so bear with me here.

Is it not possible to add conditions which would prevent the original code running? An 'if guest' type argument? I thought 'hooks' kept the original, and potentially adds code/HTML at the four hook points. A couple of days ago I know that - because we had no choice due to the absence of a suitable hook point - we reproduced the whole mobile footer menu (with some additional code), placed this before the original using a hook, and then hid the original template HTML output content with CSS - that worked in that situation.

Here, I presumed that we could add up to four sections of code at the various hook point options (probably just points 2 & 3) to add some kind of if condition to the original code so that it is skipped when the page is viewed by a guest, and else to add '...' or similar. This would result in keeping the h3 tags and alternative content (...) for guests.

Apologies - I am just trying to gain a better understanding of how hooks work.

And all this might be moot anyway. I would also need to do this for @mentions but I cannot locate this in any of the templates.