profile comments translate edit

[Marble]

I was trying out one of KHDev's skins and came across something that other people might experience with their default etano skin, so I thought I'd share it in here.

After a user opens a message that says they received a comment on their profile, it includes a link to view the comment. The link takes the user to their profile page instead of their comments page.

In the admin control panel: skin settings > site skins > translate > language settings at key 165. The original looks like this
%1$s posted a comment on your profile.<br><a class="content-link simple" href="my_profile.php#comm%2$s">Click here</a> to view the comment

I changed it to
%1$s posted a comment on your profile.<br><a class="content-link simple" href="my_comments.php">Click here</a> to view the comment

Although I did experiment further by adding #comm%2$s at the end of my_comments.php in the line, but it didn't land exactly on that comment line and I don't know if there is another way around this.

[KHDev]

I'm guessing the issue is with one of my skins which have the fixed bar at top? Which can overlap the comment if the comment is near the top when the page loads.

(Note! Only seems to affect my skins which have a fixed header)


You can try a bit of JS to offset/scroll to the comment when navigating to a specific comment (Found this on Stackoverflow)

Either add it to my_comments.html or create a js file for it. Appears to fix the issue in testing

Code: [Select]


<script type="text/javascript">

function scroll_if_anchor(href) {
    href = typeof(href) == "string" ? href : $(this).attr("href");

    // If href missing, ignore
    if(!href) return;

    // You could easily calculate this dynamically if you prefer
    var fromTop = 100;

    // If our Href points to a valid, non-empty anchor, and is on the same page (e.g. #foo)
    // Legacy jQuery and IE7 may have issues: http://stackoverflow.com/q/1593174
    var $target = $(href);

    // Older browsers without pushState might flicker here, as they momentarily
    // jump to the wrong position (IE < 10)
    if($target.length) {
        $('html, body').animate({ scrollTop: $target.offset().top - fromTop });
        if(history && "pushState" in history) {
            history.pushState({}, document.title, window.location.pathname + href);
            return false;
        }
    }
}   

// When our page loads, check to see if it contains and anchor
scroll_if_anchor(window.location.hash);

// Intercept all anchor clicks
$("body").on("click", "a[href^='#']", scroll_if_anchor);

</script>



Note!

I'd recommend also editing the comment div on my_comments.html

Code: [Select]

### FROM ####
<div class="comment {loop_comments.is_online}">

### TO ###
<div class="comment {loop_comments.is_online}" id="comm{loop_comments.comment_id}">


Also make sure you change your lang key 165 to %1$s posted a comment on your profile.<br><a class="content-link simple" href="my_comments.php#comm%2$s">Click here</a> to view the comment

[Marble]

Thanks for this great solution. I made a js file to keep the html file from looking too cluttered. I customized the var fromTop by changing the number to 70.