Description
This jQuery mod will convert all of the links in your site page pointing to any member profile to an option dropdown with the actions you can perform with another user account.
Background:
As per request of the user AwesomePol over PM at community I've coded this script.
Dependency:
jQuery library is required to implement this as the script is written in jQuery. So if you have already not included jQuery library include now first. [How]
Method:
A[1]. First, include the following script to your 'headerinclude' template, at the end.
A[2]. You can optionally keep the script external as well. For that, skip the previous step and start from here:
1. Upload the attached file 'user_options.js' in your 'jscripts' folder.
2. Open your 'headerinclude' template and find this:
... and add the following line just before this:
I've also uploaded to the script to Demoante CDN. you can even call that from there if you have trust on Demonate.
or.
B. Now designing the option dropdown list. Its is required to make the unordered list to a menu. So, open your global.css and add at the end:
You are done. Result (applied to my premium theme Sytrax):
![[Image: IkJju86.png]]()
Change the CSS properties to suit your requirement further.
Happy coding.![Big Grin]( "Big Grin")
![.js]()
user_options.js (Size: 1.89 KB / Downloads: 4)
This jQuery mod will convert all of the links in your site page pointing to any member profile to an option dropdown with the actions you can perform with another user account.
Background:
As per request of the user AwesomePol over PM at community I've coded this script.
Dependency:
jQuery library is required to implement this as the script is written in jQuery. So if you have already not included jQuery library include now first. [How]
Method:
A[1]. First, include the following script to your 'headerinclude' template, at the end.
PHP Code:
/*
/ "User Link Quick Options Dropdown"
/ - a jQuery script for MyBB to convert all user profile links in page to quick option dropdown list
/ Author: effone
/ Website: http://demonate.com
/ Licence: Demonate standard licence for free products applied
/ © 2014, Demonate
*/
jQuery.noConflict();
jQuery(document).ready(function(jQ){
jQ("a[href*='member.php?action=profile&uid=']").addClass("user_link");
jQ(".user_link").click(function(){
var name = jQ(this).text();
var uid = jQ(this).attr('href').substr(jQ(this).attr('href').lastIndexOf("=") + 1);
jQ( this ).before( "<ul class='user_opt'><li><a href='member.php?action=profile&uid="+uid+"'>Profile</a></li><li><a href='member.php?action=emailuser&uid="+uid+"'>E-Mail</a></li><li><a href='private.php?action=send&uid="+uid+"'>Message</a></li><li><a href='search.php?action=finduser&uid="+uid+"'>Posts</a></li><li><a href='search.php?action=finduserthreads&uid="+uid+"'>Threads</a></li><li><a href='javascript:MyBB.reputation("+uid+");'>Rep User</a></li><li><a href='usercp.php?action=do_editlists&add_username="+name+"&my_post_key="+my_post_key+"'>Make Buddy</a></li><li><a href='usercp.php?action=do_editlists&manage=ignored&add_username="+name+"&my_post_key="+my_post_key+"'>Ignore User</a></li></ul>" );
var pos = jQ(this).position();
var top = jQ(this).outerHeight();
var setleft = jQ(this).outerWidth()/2 - jQ(".user_opt").outerWidth()/2;
jQ(".user_opt").css({
position: absolute,
top: (pos.top + top) + "px",
left: (pos.left + setleft) + "px"
}).show();
return false;
});
jQ(document).mouseup(function (e){
var container = jQ('.user_opt');
if (!container.is(e.target) && container.has(e.target).length === 0) {
container.remove();
}
});
});
A[2]. You can optionally keep the script external as well. For that, skip the previous step and start from here:
1. Upload the attached file 'user_options.js' in your 'jscripts' folder.
2. Open your 'headerinclude' template and find this:
Code:
{$stylesheets}... and add the following line just before this:
Code:
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/user_options.js"></script>I've also uploaded to the script to Demoante CDN. you can even call that from there if you have trust on Demonate.
Code:
<script type="text/javascript" src="http://demonate.com/jscripts/cdn/user_options.js"></script>or.
Code:
<script type="text/javascript" src="http://goo.gl/5rBwtZ"></script>B. Now designing the option dropdown list. Its is required to make the unordered list to a menu. So, open your global.css and add at the end:
PHP Code:
.user_opt {
position: absolute;
padding: 0;
margin: 0;
background: #FFF;
border: 1px solid #0F5C8E;
z-index: 999;
text-align: left;
font-weight: 300;
}
.user_opt li {
list-style: none;
}
.user_opt li a {
color: #0F5C8E;
font-weight: 700;
font-size: 11px!important;
text-decoration: none;
padding: 3px 15px;
display: block;
border-top: 1px solid #0F5C8E;
}
.user_opt li:first-child a { border-top: none; }
.user_opt li a:hover {
color: #000;
background: #ADCBE7;
}
You are done. Result (applied to my premium theme Sytrax):
![[Image: IkJju86.png]](http://i.imgur.com/IkJju86.png)
Change the CSS properties to suit your requirement further.
Happy coding.
user_options.js (Size: 1.89 KB / Downloads: 4)