We hope you enjoy your visit.

You're currently viewing our forum as a guest. This means you are limited to certain areas of the board and there are some features you can't use. If you join our community, you'll be able to access member-only sections, and use many member-only features such as customizing your profile, sending personal messages, and voting in polls. Registration is simple, fast, and completely free.


Join our community!


If you're already a member please log in to your account to access all of our features:

Username:   Password:
Locked Topic
  • Pages:
  • 1
[ C ] Twitter Profile Integration
Topic Started: Aug 16 2015, 07:49 PM (755 Views)
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
ZB
URL in profile

I'm looking for a code that'll allow members to enter the twitter @'s and it'll display in their mini profile and profile and it'll link it to the twitter account. I've seen this code before but I just can only find a skype and facebook one.
Offline Profile Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
Admin CP Posted Image Themes Posted Image Board Template Posted Image Below the Board
Code:
 
<script type="text/javascript">
$(function() {
var PFName = 'PROFILE_FIELD_NAME';

$('dl.user_profile dt:contains(' + PFName + ')').next('dd').each(function() {
var tAccount = $(this).text().split('@')[1];
$(this).html('<a href="https://twitter.com/' + tAccount + '" target="_blank">@' + tAccount + '</a>');
});
});
</script>
Edit the capitalized text as necessary.
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
Doesn't work
Offline Profile Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
Is 'Show field in topics' set to Yes for the profile field? Did you ensure you inserted the exact profile field name in the code?
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
Works now. Can a description be added under the profile field saying this: Must Include @

?
Offline Profile Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
Code:
 
<script type="text/javascript">
//<![CDATA[
$('#edit_profile td.c_desc:contains(Twitter @)').append('<small>Must Include @</small>');
//]]>
</script>
Try that.
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
Woo! Looks great, thank you Cory :)
I have one more question, how would I make it appear next to the line instead of below it and remove the italic?
Edited by Tyler Dream, Aug 17 2015, 01:21 AM.
Offline Profile Goto Top
 
Roby
Member Avatar
#27

How's this?
Code:
 
<script type="text/javascript">
//<![CDATA[
$('#edit_profile td.c_desc:contains(Twitter @)').html('Twitter: Must Include @<small>Maximum length: 250</small>');
//]]>
</script>
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
Nope
Offline Profile Goto Top
 
DaPizzaMan
Member Avatar
#TeamSupport

Code:
 
<script type="text/javascript">
//<![CDATA[
$('#edit_profile td.c_desc:contains(Twitter @)').prepend('<small style="display:inline; font-style:normal;">Must Include @</small>');
//]]>
</script>
It shouldn't be italicized by default, but I forced it to be non-italicized just in case the theme you're using makes it italicized.
Edited by DaPizzaMan, Aug 17 2015, 04:05 PM.
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
None of the 3 codes worked. It's still italicized by default and it's still under it :O
This is my current code:
Code:
 
<script type="text/javascript">
$(function() {
var PFName = 'Twitter:';

$('dl.user_profile dt:contains(' + PFName + ')').next('dd').each(function() {
var tAccount = $(this).text().split('@')[1];
$(this).html('<a href="https://twitter.com/' + tAccount + '" target="_blank">@' + tAccount + '</a>');
});
});
</script>
<script type="text/javascript">
//<![CDATA[
$('#edit_profile td.c_desc:contains(Twitter:)').prepend('<small style="display:inline; font-style:normal;">Must Include @</small>');
//]]>
</script>
Edited by Tyler Dream, Aug 17 2015, 06:27 PM.
Offline Profile Goto Top
 
Roby
Member Avatar
#27

Can you post a screenshot of what you see?

Here's an alternative if you're not set on having it look the way you described:
Code:
 
<script type="text/javascript">
//<![CDATA[
$(function() {
var twitter_field_value = $('table#edit_profile td.c_desc:contains(Twitter)').next().children('input');
if(!twitter_field_value.val()) {
twitter_field_value.val('Must include @');
twitter_field_value.click(function() {
$(this).val('');
});
}
});
//]]>
</script>
It will have the field filled in with the text "Must include @" if the user has not saved anything to the field and will clear when the field is clicked (also if the user hasn't saved anything to it yet).

Side Note: My JS/jQuery is pretty rusty. If any of the proficient coders see any fixes or optimizations, go for it. It worked for me the way it is.
Offline Profile Goto Top
 
Tyler Dream
Member Avatar
Member
[ *  *  *  * ]
That code works. However, it's still italicized and it's still under the profile field in the mini profile
Offline Profile Goto Top
 
Roby
Member Avatar
#27

Are you able to post a screenshot of what you're seeing?
Offline Profile Goto Top
 
Cory
Member Avatar
Member
[ *  *  *  *  *  *  *  *  * ]
Try this:
Code:
 
<script type="text/javascript">
$('dl.user_profile dt:contains(PROFILE_FIELD_NAME)').css({
'float': 'left',
'margin': '0',
'min-width': '4em',
'padding': '.1em'
}).next('dd').css({
'padding': '.1em',
'margin-bottom': '1px',
'font-style': 'normal'
});
</script>
Edit the capitalized text as necessary.
Offline Profile Goto Top
 
1 user reading this topic (1 Guest and 0 Anonymous)
Go to Next Page
« Previous Topic · Closed Requests · Next Topic »
Locked Topic
  • Pages:
  • 1