Follow Me Postbit Icon [Deleted]

Great add on @Adam Howard - I would like to add a font awesome icon in place of the image you supply, any thoughts how to do so?

Code:
<i class="fa fa-plus-square"></i>
The next update will either use font awesome or have a high resolution optimized svg. But one way or the other, the old png file is going to be replaced.

As for your inquiry .... Let me get back to you on that....
 
Great add on @Adam Howard - I would like to add a font awesome icon in place of the image you supply, any thoughts how to do so?

Code:
<i class="fa fa-plus-square"></i>
First your code is a little incorrect

fa fa-plus-square fa-fw

^
You were missing the fa-fw ;)

Test 1   Test Site Only - Registration CLOSED.webp

With that said, I cannot get this to work completely with Font Awesome... At least not with the "Follow" text. I can do it without the "follow", but with the word "follow" (and the tooltip), it all ends up looking like the above photo (bunched up together).

Unless someone else knows how to resolve that (@Russ maybe?), the next release will be using an optimized svg file in it's place.
 
First your code is a little incorrect

fa fa-plus-square fa-fw

^
You were missing the fa-fw ;)

View attachment 74880

With that said, I cannot get this to work completely with Font Awesome... At least not with the "Follow" text. I can do it without the "follow", but with the word "follow" (and the tooltip), it all ends up looking like the above photo (bunched up together).

Unless someone else knows how to resolve that (@Russ maybe?), the next release will be using an optimized svg file in it's place.
I did something similar for trophies on the member_view template, not sure if it will help you.

Code:
<!--Trophy under avatar start-->
<div class="section infoBlock"><a href="{xen:link 'members/trophies', $user}" class="OverlayTrigger">User Trophies: <i class="fa fa-trophy fa-2x"></i></a></dl>
                           
    </div><!--Trophy under avatar end-->

Screen Shot 2014-05-31 at 6.53.16 PM.webp
 
@tommydamic68 If you want to have a go at it....

message_user_info

search for
PHP:
<span class="arrow"><span></span></span>
Below is the code
PHP:
<xen:follow user="$user" class="Tooltip" style="text-align:center; display:block; font-weight:bold;" />
<xen:if is="{xen:helper isIgnored, $user.user_id}"><a href="{xen:link members/unignore, $user}" class="FollowLink">{xen:phrase unignore}</a><xen:elseif is="{$canIgnore}" /><a href="{xen:link members/ignore, $user}" class="FollowLink">{xen:phrase ignore}</a></xen:if>
 
@tommydamic68 If you want to have a go at it....

message_user_info

search for
PHP:
<span class="arrow"><span></span></span>
Below is the code
PHP:
<xen:follow user="$user" class="Tooltip" style="text-align:center; display:block; font-weight:bold;" />
<xen:if is="{xen:helper isIgnored, $user.user_id}"><a href="{xen:link members/unignore, $user}" class="FollowLink">{xen:phrase unignore}</a><xen:elseif is="{$canIgnore}" /><a href="{xen:link members/ignore, $user}" class="FollowLink">{xen:phrase ignore}</a></xen:if>
And this is the original code with the image
PHP:
<xen:follow user="$user" class="Tooltip" style="background: url('styles/followme.png') no-repeat 8px center; padding:5px; text-align:center; display:block; font-weight:bold;" />
<xen:if is="{xen:helper isIgnored, $user.user_id}"><a href="{xen:link members/unignore, $user}" class="FollowLink">{xen:phrase unignore}</a><xen:elseif is="{$canIgnore}" /><a href="{xen:link members/ignore, $user}" class="FollowLink">{xen:phrase ignore}</a></xen:if>
 
I have removed for now, unless it can be hidden in responsive it does not work for my users. Great add on though.
 
@Adam Howard - I have had a few complaints on members "accidentally" unfollowing other members when using a mobile phone, scrolling, anyway to disable for mobile users?
I have removed for now, unless it can be hidden in responsive it does not work for my users. Great add on though.
I have not run into this issue, but never the less, I will be pushing out an update later today :)
 
^ The above will be the best I can do.

Normally, if I wanted something NOT to be visible after "X" screensize (width), I would make a new css template and add this as a requirement
PHP:
@media (max-width:@maxResponsiveWideWidth)
{
    .X-bullet-here
    {
        display: none;
    }
}
See the part that reads, "X-buttet-here". That is where you would add the statement that is "exclusive" to the code you wish to apply this to.

My add-on has no exclusive code and uses the shared resource within XenForo... ie... The follow link code that adds a follow link on the members card / user profile page. So there really is no statement that I could put in that "X-bullet-here" value.

So the best I can do is have it as shown in this screenshot

Screen Shot 2014-06-02 at 08.03.40.webp

Which should be good enough, because it's compact within the postbit and not the full width length. Now if your members still some how keep click that....

Get smarter members.... lol ... I'm joking of course (sort of... lol).

Of course if anyone knows an alternative that I maybe missing... I'm open to suggestion.

Although I have ruled out this
PHP:
<xen:container var="$noResponsive">
</xen:container>
Because that would disable this on responsive designs altogether (regardless of screen size) and so that would be pointless (most people use the responsive feature).
 
Ok- will give it a go. Most of my members use Mobil devices. :confused:
On my update (soon coming), use the alternative version and not the original. It seems to plug into the postbit responsive code that is already there in XenForo (hiding the icon).

For this reason, the next update maybe the last release of the "original" that places this above the avatar.
 
Original - Final Edition (v0.0.3)
Test 1   Test Site Only - Registration CLOSED.webp

This will be the last update for the original version. It will be completely unsupported (may the force be with you).

Why?

The original placed the link and icon above the avatar. This had undesired results on the responsive design.

So does this mean this add-on is discontinued?

NO! What was once called, the alternative version, which places this below the avatar under the general postbit information, will no longer be called the alternative version and simply, "Follow Me Postbit" ... ie... Becoming the new normal standard release along with future updates and support. ;)

I am release this final "original" here within the thread for those who still may want it (despite it's flaw)... ie... Those few who disable the responsive feature or do not care either way.

Installation:

Upload the new contents (this version uses an svg for higher resolution)
Import the XML file
Safe to delete the old image located at: /styles/followme.png


However, if you wish to upgrade to the new supported version which places this below in your postbit (which was once called, the alternative version); you want to see this
http://xenforo.com/community/threads/follow-me-postbit-icon.75146/page-3#post-774239
 

Attachments

Last edited:
Top Bottom