[ADB] Social Networking Site Buttons 2.1.0

[KellyBean]

Modification Name: Social Networking Site Buttons
Authors: KellyBean & Jaymie1989

Modification Description: Adds 8 new links/buttons next to the typical www, AIM, MSN, YIM buttons on the mini profile in viewtopic_body.html:

Bebo, Blogger, Facebook, GoodReads, LinkedIn, MySpace, NetLog and Twitter

Modification Version: 2.1.0

Screenshots:
Viewtopic:


UCP:


ACP:


Viewprofile:


Demo URL: here.

Modification Download: social_networking_buttons 2.1.0

To-Do List:

• Additional Languages

Features:

• Prosilver Compatible
• subSilver2 Compatible
• Auto-MOD Compatible

Suggestions and constructive criticism always welcome!

Thanks to Jaymie1989 for offering to help me with this MOD since I've had a super busy summer and haven't had the time to dedicate to finishing. As such, I added him as co-author.

[Brf]

You need to edit includes/acp/acp_styles.php and refresh your imageset,

[KellyBean]

Thanks for the quick response!
Is this the only edit in includes/acp/acp_styles.php?

Find:

Code: Select all

'buttons'	=> array(
				'icon_back_top', 'icon_contact_aim', 'icon_contact_email', 'icon_contact_icq', 'icon_contact_jabber', 'icon_contact_msnm', 'icon_contact_pm', 'icon_contact_yahoo', 'icon_contact_www', 'icon_post_delete', 'icon_post_edit', 'icon_post_info', 'icon_post_quote', 'icon_post_quick_quote', 'icon_post_report', 'icon_user_online', 'icon_user_offline', 'icon_user_profile', 'icon_user_search', 'icon_user_warn', 'button_pm_forward', 'button_pm_new', 'button_pm_reply', 'button_topic_locked', 'button_topic_new', 'button_topic_reply', 'button_quick_reply',

Inline find:

Code: Select all

'icon_contact_msnm',

Inline after add:

Code: Select all

'icon_contact_gr',

I did that, refreshed the imageset, purged the cache, and still don't have anything.

[Brf]

Does your button show up OK in styles/imagesets edit?

[KellyBean]

You mean in the ACP? Yes.

[Brf]

I am seeing this in your stylesheet:

Code: Select all

ul.profile-icons li.goodreads-icon	{ width: px; height: px; }
ul.profile-icons li.facebook-icon	{ width: px; height: px; }
ul.profile-icons li.blogger-icon	{ width: px; height: px; }
ul.profile-icons li.myspace-icon	{ width: px; height: px; }
ul.profile-icons li.twitter-icon	{ width: px; height: px; }

Code: Select all

.goodreads-icon, .goodreads-icon a		{ background-image: url(""); }
.facebook-icon, .facebook-icon a		{ background-image: url(""); }
.blogger-icon, .blogger-icon a			{ background-image: url(""); }
.myspace-icon, .myspace-icon a			{ background-image: url(""); }
.twitter-icon, .twitter-icon a			{ background-image: url(""); }

That indicates that those icons are not refreshed into your imageset in your database.
Did you refresh your style after refreshing the imageset?

[KellyBean]

Should I have?

I just re-refreshed everything... first one way, then the other... one thing I noticed, when I edited the imageset, went to Select Image, and clicked the drop-down list, the goodreads button is listed without a name... just [en]

So it looks like this:

[Brf]

Your stylesheet looks fine now.
F5 your webbrowser.

That text name is in language/en/acp/styles.php

[KellyBean]

OMG, It works!! THANKS for your help!

Now... honest opinions, please... is this good enough ( ) to attempt to put together as a MOD?

[Brf]

Sure.
That sort of thing could be used for a bunch of different profile options.

[KellyBean]

[DavidIQ]

KellyBean,

If this is something you plan on releasing into our MODDB then you might want to take a look at this:
http://www.phpbb.com/mods/

You'll also want to convert all of your instructions to MODX format.

Once you do that you should post in MODs in Development following the guidelines found here. You've put a bit of work into this so you should consider releasing it to the MODDB

[will_hough]

Thanks for writing this MOD

I wrote it all up for Facebook in old school .mod format if anyone wants it. I'm going to leave it up to you to write it as MODX if you want.

Code: Select all

##############################################################
## MOD Title: Add Facebook Icon In Viewtopic
## MOD Author: KellyBean
## MOD Description: Addes a Facebook link and icon to viewtopic.
## 
## MOD Version: 0.0.1
##
## Installation Level: (Easy)
## Installation Time: 5 min
## 
## Files To Edit: includes/ucp/ucp_profile.php
## 			includes/acp/acp_styles.php
## 			language/en/common.php
## 			language/en/ucp.php
## 			memberlist.php
## 			viewtopic.php
## 			styles/prosilver/imageset/imageset.cfg
## 			styles/prosilver/theme/buttons.css
## 			styles/prosilver/theme/colours.css
## 			styles/prosilver/template/ucp_profile_profile_info.html
## 			styles/prosilver/template/viewtopic_body.html
## 
## Included Files: imageset/icon_contact_fb.png
## 
##############################################################


# 
#-----[ SQL ]--------------------------------------------- 
#

ALTER TABLE `phpbb_users` ADD `user_facebook` VARCHAR(255) CHARACTER SET utf8 COLLATE utf8_bin NOT NULL DEFAULT '';

# 
#-----[ COPY ]------------------------------------------ 
#
imageset/icon_contact_fb.png       to   imageset/icon_contact_fb.png

# 
#-----[ OPEN ]---------------------------------------------
# 
includes/ucp/ucp_profile.php

# 
#-----[ FIND ]---------------------------------------------
#
				$data = array(
					'icq'			=> request_var('icq', $user->data['user_icq']),
					'aim'			=> request_var('aim', $user->data['user_aim']),
					'msn'			=> request_var('msn', $user->data['user_msnm']),
					'yim'			=> request_var('yim', $user->data['user_yim']),
					'jabber'		=> utf8_normalize_nfc(request_var('jabber', $user->data['user_jabber'], true)),
					'website'		=> request_var('website', $user->data['user_website']),

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
					'facebook'      => request_var('facebook', $user->data['user_facebook']),

#
#-----[ FIND ]---------------------------------------------
#
						'website'		=> array(
							array('string', true, 12, 255),
							array('match', true, '#^http[s]?://(.*?\.)*?[a-z0-9\-]+\.[a-z]{2,4}#i')),

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
						'facebook'      => array(
							array('string', true, 12, 255),
							array('match', true, '#^http[s]?://(.*?\.)*?[a-z0-9\-]+\.[a-z]{2,4}#i')),

#
#-----[ FIND ]---------------------------------------------
#
							'user_interests'=> $data['interests'],

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
							'user_facebook'	=> $data['facebook'],


#
#-----[ FIND ]---------------------------------------------
#
					'INTERESTS'	=> $data['interests'],

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
					'FACEBOOK'	=> $data['facebook'],

# 
#-----[ OPEN ]---------------------------------------------
#
language/en/acp/styles.php

#
#-----[ FIND ]---------------------------------------------
#
	'IMG_ICON_CONTACT_WWW'		=> 'Website',

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
	'IMG_ICON_CONTACT_FB'		=> 'Facebook',

# 
#-----[ OPEN ]---------------------------------------------
# 
includes/acp/acp_styles.php

#
#-----[ FIND ]---------------------------------------------
#
			'buttons'	=> array(
				'icon_back_top', 'icon_contact_aim', 'icon_contact_email', 'icon_contact_icq', 'icon_contact_jabber', 'icon_contact_msnm', 'icon_contact_pm', 'icon_contact_yahoo', 'icon_contact_www', 'icon_post_delete', 'icon_post_edit', 'icon_post_info', 'icon_post_quote', 'icon_post_report', 'icon_user_online', 'icon_user_offline', 'icon_user_profile', 'icon_user_search', 'icon_user_warn', 'button_pm_forward', 'button_pm_new', 'button_pm_reply', 'button_topic_locked', 'button_topic_new', 'button_topic_reply',
			),

#
#-----[ IN_LINE FIND ]---------------------------------------------
#
'icon_contact_msnm'

#
#-----[ IN-LINE AFTER, ADD ]---------------------------------------------
#
, 'icon_contact_fb'

# 
#-----[ OPEN ]---------------------------------------------
#
language/en/common.php

#
#-----[ FIND ]---------------------------------------------
#
	'GO'						=> 'Go',

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
	'FACEBOOK'					=> 'Facebook',

# 
#-----[ OPEN ]---------------------------------------------
# 
language/en/ucp.php

#
#-----[ FIND ]---------------------------------------------
#
	'UCP_JABBER'				=> 'Jabber address',

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
    'UCP_FACEBOOK'            => 'Facebook Profile',

# 
#-----[ OPEN ]---------------------------------------------
# 
memberlist.php

#
#-----[ FIND ]---------------------------------------------
# Around line 565
			'JABBER_IMG'	=> $user->img('icon_contact_jabber', $user->lang['JABBER']),


# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
			'FACEBOOK_IMG'	=> $user->img('icon_contact_fb', $user->lang['FACEBOOK']),

#
#-----[ FIND ]---------------------------------------------
# Around line 1492
			'JABBER_IMG'	=> $user->img('icon_contact_jabber', $user->lang['JABBER']),


# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
			'FACEBOOK_IMG'	=> $user->img('icon_contact_fb', $user->lang['FACEBOOK']),

# 
#-----[ OPEN ]---------------------------------------------
# 
viewtopic.php

#
#-----[ FIND ]---------------------------------------------
#
	'JABBER_IMG'		=> $user->img('icon_contact_jabber', 'JABBER') ,


# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
	'FACEBOOK_IMG'      => $user->img('icon_contact_fb', 'FACEBOOK'),

#
#-----[ FIND ]---------------------------------------------
#
				'aim'				=> '',
				'msn'				=> '',
				'yim'				=> '',

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
				'facebook'			=> '',

#
#-----[ FIND ]---------------------------------------------
#
				'jabber'		=> ($row['user_jabber'] && $auth->acl_get('u_sendim')) ? append_sid("{$phpbb_root_path}memberlist.$phpEx", "mode=contact&action=jabber&u=$poster_id") : '',

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
				'facebook'		=> $row['user_facebook'],

#
#-----[ FIND ]---------------------------------------------
#
		'U_JABBER'		=> $user_cache[$poster_id]['jabber'],

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
		'U_FACEBOOK'	=> $user_cache[$poster_id]['facebook'],

# 
#-----[ OPEN ]---------------------------------------------
# 
styles/prosilver/imageset/imageset.cfg

#
#-----[ FIND ]---------------------------------------------
#
img_icon_contact_msnm = icon_contact_msnm.gif*20*20

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
img_icon_contact_fb = icon_contact_fb.png*20*20

# 
#-----[ OPEN ]---------------------------------------------
# 
styles/prosilver/theme/buttons.css

#
#-----[ FIND ]---------------------------------------------
#
.web-icon, .web-icon a			{ background: none top left no-repeat; }

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
.facebook-icon, .facebook-icon a	{ background: none top left no-repeat; }

#
#-----[ FIND ]---------------------------------------------
#
ul.profile-icons li.web-icon	{ width: {IMG_ICON_CONTACT_WWW_WIDTH}px; height: {IMG_ICON_CONTACT_WWW_HEIGHT}px; }

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
ul.profile-icons li.facebook-icon	{ width: {IMG_ICON_CONTACT_FB_WIDTH}px; height: {IMG_ICON_CONTACT_FB_HEIGHT}px; }

# 
#-----[ OPEN ]---------------------------------------------
# 
styles/prosilver/theme/colours.css

#
#-----[ FIND ]---------------------------------------------
#
.jabber-icon, .jabber-icon a		{ background-image: url("{IMG_ICON_CONTACT_JABBER_SRC}"); }

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
.facebook-icon, .facebook-icon a	{ background-image: url("{IMG_ICON_CONTACT_FB_SRC}"); }

# 
#-----[ OPEN ]---------------------------------------------
# 
styles/prosilver/template/ucp_profile_profile_info.html

#
#-----[ FIND ]---------------------------------------------
#
	<dl>
		<dt><label for="website">{L_WEBSITE}:</label></dt>
		<dd><input type="text" name="website" id="website" maxlength="255" value="{WEBSITE}" class="inputbox" /></dd>
	</dl>

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
	<dl>
		<dt><label for="facebook">{L_UCP_FACEBOOK}:</label></dt>
		<dd><input type="text" name="facebook" id="facebook" maxlength="255" value="{FACEBOOK}" class="inputbox" /></dd>
	</dl>

# 
#-----[ OPEN ]---------------------------------------------
# 
styles/prosilver/template/viewtopic_body.html

#
#-----[ FIND ]---------------------------------------------
#
					<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->

# 
#-----[ AFTER, ADD ]-------------------------------------- 
#
					<!-- IF postrow.U_FACEBOOK --><li class="facebook-icon"><a href="{postrow.U_FACEBOOK}" title="{L_FACEBOOK}"><span>{L_FACEBOOK}</span></a></li><!-- ENDIF -->


#
#-----[ SAVE/CLOSE ALL FILES ]------------------------------------------
#
# EoM 

[mreider]

I just tried installing this but when I go to the UCP nothing appears - shouldn't there be a box or something that says "Facebook Details" or something? Like where you enter in your MSN username and stuff?

EDIT - I'm an idiot and missed a couple edits Works, great mod!

[KellyBean]

This might be a silly question, but did you refresh your template and purge the cache?

ETA: LOL! No problem, I've been known to do that a couple of times!

I still need to get this into MODX... I've been really busy, but I will make time hopefully this week.