1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.
  2. This forum is for release discussion only. Discussions that do not relate specifically to the resource release should be discussed in another, more appropriate forum.
    Dismiss Notice
  3. This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Separate the permalink and sharing overlay in posts

Discussion in 'Template Modifications [Archive]' started by Brogan, Oct 13, 2011.

  1. Brogan

    Brogan XenForo Moderator Staff Member

    A few people have commented that it's not immediately obvious that clicking on the permalink in the bottom right of a post will bring up the sharing overlay.

    This simple template edit will separate the two, hopefully making it more obvious.

    It also rearranges the order of the links slightly, moving the permalink to the far right.

    First you need to create two new phrases.
    You can name these however you want, as long as you use the same naming in the template (highlighted in red in the code block below).

    In this example the phrases are:
    cta_share | Share
    cta_share_this_post | Share this post

    You also need to edit one existing phrase:
    permalink_for_post_x | Share Options for Post #{position}

    Then you need to edit the post template.

    Look for this near the bottom of the template:
    Code:
                <div class="publicControls">
                    <a href="{xen:link threads/post-permalink, $thread, 'post={$post}'}" title="{xen:phrase permalink}" class="item muted postNumber hashPermalink OverlayTrigger" data-href="{xen:link posts/permalink, $post}">#{xen:calc '{$post.position} + 1'}</a>
                    <xen:hook name="post_public_controls" params="{xen:array 'post={$post}'}">
                    <xen:if is="{$post.canLike}">
                        <a href="{xen:link posts/like, $post}" class="LikeLink item control {xen:if $post.like_date, unlike, like}" data-container="#likes-post-{$post.post_id}"><span></span><span class="LikeLabel">{xen:if $post.like_date, {xen:phrase unlike}, {xen:phrase like}}</span></a>
                    </xen:if>
                    <xen:if is="{$canReply}">
                        <a href="{xen:link threads/reply, $thread, 'quote={$post.post_id}'}" data-postUrl="{xen:link posts/quote, $post}" class="ReplyQuote item control reply" title="{xen:phrase reply_quoting_this_message}"><span></span>{xen:phrase reply}</a>
                    </xen:if>
                    </xen:hook>
                </div>
    Replace with this:
    Code:
                <div class="publicControls">
                    <xen:hook name="post_public_controls" params="{xen:array 'post={$post}'}">
                    <xen:if is="{$post.canLike}">
                        <a href="{xen:link posts/like, $post}" class="LikeLink item control {xen:if $post.like_date, unlike, like}" data-container="#likes-post-{$post.post_id}"><span></span><span class="LikeLabel">{xen:if $post.like_date, {xen:phrase unlike}, {xen:phrase like}}</span></a>
                    </xen:if>
                    <xen:if is="{$canReply}">
                        <a href="{xen:link threads/reply, $thread, 'quote={$post.post_id}'}" data-postUrl="{xen:link posts/quote, $post}" class="ReplyQuote item control reply" title="{xen:phrase reply_quoting_this_message}"><span></span>{xen:phrase reply}</a>
                    </xen:if>
                    <a href="{xen:link threads/post-permalink, $thread, 'post={$post}'}" title="{xen:phrase cta_share_this_post}" class="item control postNumber hashPermalink OverlayTrigger" data-href="{xen:link posts/permalink, $post}">{xen:phrase cta_share}</a>
                    </xen:hook>
                    <a href="{xen:link threads/post-permalink, $thread, 'post={$post}'}" title="{xen:phrase permalink}" class="item muted postNumber" data-href="{xen:link posts/permalink, $post}">#{xen:calc '{$post.position} + 1'}</a>
                </div>
    The end result is this (I have also changed the Reply link phrase to Quote):

    permalink.png share.png
    Clicking the permalink will now just anchor the thread on that URL.
    Clicking the Share link will produce the overlay with the new "Share Options for Post #" text.
    share-options.png
     
    Sasa, @lex, Alluidh and 6 others like this.
  2. Alluidh

    Alluidh Well-Known Member

    Hi Brogan

    Good work. This should be included completely into XenForo 1.1
     

Share This Page