Jump to content

Invision Community Blog


Managing successful online communities

Andy Millne
Sign in to follow this  
 

New: Social Sign In Streamlining

This entry is about our IPS Community Suite 4.2 release.

Social Sign In has long been a feature of the IPS Community Suite but we are always looking for ways to make interaction easier for your visitors. A small but significant improvement we are able to add for 4.2 is to include social sign in links directly at the point where your customers are ready to contribute.

 

socialsign.png

Hassle free inline sign in brings your customers right back where they need to be to comment

Visitors are much more likely to comment when the registration process is as fluid as possible and social sign in has fast become a familiar and efficient way of doing so. After signing up via these methods users are logged in and brought right back to where they started ready to comment.

Feedback from our testers has already shown that this change has an immediate effect on the volume of new registrations and we look forward to making it widely available with 4.2.

Sign in to follow this  

Comments

Recommended Comments

7 hours ago, Janiszewski said:

@Sergey your version looks like more thoughtful 

Thanks))

My code

guestCommentTeaser

<ips:template parameters="$item, $login, $isReview=FALSE" />

{{$ref = base64_encode( $item->url() . '#replyForm' );}}
{{if \IPS\Settings::i()->allow_reg}}
	<div class='ipsType_center ipsPad'>
		{{if $isReview}}
			<h2 class='ipsType_pageTitle'>{lang="teaser_review_title_reg"}</h2>
			<p class='ipsType_light ipsType_normal ipsType_reset'>{lang="teaser_review_desc_reg"}</p>
		{{else}}
			<h2 class='ipsType_pageTitle'>{lang="teaser_title_reg"}</h2>
			<p class='ipsType_light ipsType_normal ipsType_reset'>{lang="teaser_desc_reg"}</p>
		{{endif}}

		<div class='ipsGrid ipsGrid_collapsePhone ipsSpacer_top' data-ipsgrid data-ipsgrid-equalheights="row" {{/*this added data-ipsgrid */}}>
			<div class='ipsGrid_span6 ipsAreaBackground_light ipsPad'>
				<h2 class='ipsType_sectionHead'>{lang="teaser_account"}</h2>
				<p class='ipsType_normal ipsType_reset ipsType_light'>{lang="teaser_account_desc"}</p>
				<br>
				<a href='{url="app=core&module=system&controller=register" seoTemplate="register" protocol="\IPS\Settings::i()->logins_over_https"}' class='ipsButton ipsButton_primary ipsButton_small'>{lang="teaser_account_button"}</a>
			</div>
			<div class='ipsGrid_span6 ipsAreaBackground_light ipsPad'>
				<h2 class='ipsType_sectionHead'>{lang="teaser_signin"}</h2>
				<p class='ipsType_normal ipsType_reset ipsType_light'>{lang="teaser_signin_desc"}</p>
				<br>
				<a href='{url="app=core&module=system&controller=login&ref={$ref}" seoTemplate="login" protocol="\IPS\Settings::i()->logins_over_https"}' data-ipsDialog data-ipsDialog-size='medium' data-ipsDialog-title="{lang="teaser_signin_button"}" class='ipsButton ipsButton_primary ipsButton_small'>{lang="teaser_signin_button"}</a>
			</div>
		</div>
		{{/*this added*/}}
		<div class='ipsAreaBackground_light ipsPad ipsSpacer_top'>
			<p class='ipsType_reset ipsType_small ipsType_center'><strong>{lang="sign_in_with_these"}</strong></p>
			<ul class="ipsList_inline ipsType_center ipsSpacer_top ipsSpacer_half">
			{{foreach $login->forms( FALSE, TRUE ) as $k => $form}}
				{{if $k !== '_standard'}}
					<li class='ipsType_center'>
						{$form|raw}
					</li>
				{{endif}}
			{{endforeach}}
			</ul>
		</div>
		{{/*this added*/}}
	</div>
{{else}}
	<div class='ipsType_center ipsPad'>
		<h2 class='ipsType_pageTitle'>{lang="teaser_title_noreg"}</h2>
		<p class='ipsType_light ipsType_normal ipsType_reset'>{lang="teaser_desc_noreg"}</p>
		<br>
		<br>
		<a href='{url="app=core&module=system&controller=login&ref={$ref}" seoTemplate="login"}' data-ipsDialog data-ipsDialog-size='medium' data-ipsDialog-title="{lang="teaser_signin_button"}" class='ipsButton ipsButton_alternate ipsButton_large'>{lang="teaser_signin_button"}</a>
	</div>
{{endif}}

custom css


/***========= guestCommentTeaser  =========***/
div[data-role="replyArea"] > div.ipsType_center.ipsPad > h2.ipsType_pageTitle {
	font-size: 20px;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad > h2.ipsType_pageTitle + p {
	font-size: 12px;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad h2.ipsType_sectionHead {
	font-size: 18px;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad h2.ipsType_sectionHead + p {
	font-size: 12px;
	margin-bottom: 5px;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad h2.ipsType_sectionHead + p + br {
	display: none;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad span.ipsSocial_icon {
	min-width: 48px;
}

div[data-role="replyArea"] > div.ipsType_center.ipsPad span.ipsSocial_text {
	display: none;
}
/***========= end guestCommentTeaser  =========***/

 

Edited by Sergey Kuzin

Share this comment


Link to comment
Share on other sites
1 minute ago, Charles said:

Same as now when people sign up.

Hmmm. Maybe I had it set up wrong originally. We turned off social sign ups because people were somehow bypassing the validation process. They were signing up using Facebook and posting immediately.

Maybe my situation is different. We limit who can join our community. We actually send an email to validate additional information. I know this may sound silly to most here, but it seems to be the only way to limit spammers and trolls.

Share this comment


Link to comment
Share on other sites
20 minutes ago, Michael R said:

Hmmm. Maybe I had it set up wrong originally. We turned off social sign ups because people were somehow bypassing the validation process. They were signing up using Facebook and posting immediately.

Maybe my situation is different. We limit who can join our community. We actually send an email to validate additional information. I know this may sound silly to most here, but it seems to be the only way to limit spammers and trolls.

One one of my sites I do the same, email and admin validation.  I don't want people signing up with social media logins and posting spam.

Can we have both?  Let users sign in with social media, but still require admin validation, along with a couple of custom fields too?

Share this comment


Link to comment
Share on other sites
1 hour ago, Michael R said:

Hmmm. Maybe I had it set up wrong originally. We turned off social sign ups because people were somehow bypassing the validation process. They were signing up using Facebook and posting immediately.

Maybe my situation is different. We limit who can join our community. We actually send an email to validate additional information. I know this may sound silly to most here, but it seems to be the only way to limit spammers and trolls.

 

46 minutes ago, Square Wheels said:

One one of my sites I do the same, email and admin validation.  I don't want people signing up with social media logins and posting spam.

Can we have both?  Let users sign in with social media, but still require admin validation, along with a couple of custom fields too?

You still have total control over who joins your community even if you enabled social media logins. Don't be afraid to experiment with new technology :)

Share this comment


Link to comment
Share on other sites
43 minutes ago, Charles said:

You still have total control over who joins your community even if you enabled social media logins. Don't be afraid to experiment with new technology :)

So, if I allow people to sign up with FB, or Google... I can still moderate them?  Also, I currently use your spam service, email and admin validation and I add an Occupation field they must fill in - it's a unique site and it would be hard to make up an occupation.  Can I do this with 4.1?

Share this comment


Link to comment
Share on other sites
45 minutes ago, Square Wheels said:

So, if I allow people to sign up with FB, or Google... I can still moderate them?  Also, I currently use your spam service, email and admin validation and I add an Occupation field they must fill in - it's a unique site and it would be hard to make up an occupation.  Can I do this with 4.1?

These buttons don't change anything.  They're literally just buttons that IPS slapped onto another part of the community.  

Everything you asked is unaffected and still the same as before.  So if you want to moderate your sign ups, use the IPS spam service, email and admin verification and an occupational field, those all stay the same.  

Share this comment


Link to comment
Share on other sites

The point of this one was that having the sign in buttons in-context where the editor box normally is increases signups. We have tested this on live sites and saw an immediate increase in signups so we know it works.

But ... I think you are right on the cosmetic presentation. We will modify the design before final. Thanks for the feedback!

Share this comment


Link to comment
Share on other sites
1 hour ago, Joel R said:

These buttons don't change anything.  They're literally just buttons that IPS slapped onto another part of the community.  

Everything you asked is unaffected and still the same as before.  So if you want to moderate your sign ups, use the IPS spam service, email and admin verification and an occupational field, those all stay the same.  

I also require additional profile info. I allow social sign in but I also used the Required Info plug-in to make them add the additional required info before they can post...

Share this comment


Link to comment
Share on other sites
2 hours ago, Joel R said:

These buttons don't change anything.  They're literally just buttons that IPS slapped onto another part of the community.  

Everything you asked is unaffected and still the same as before.  So if you want to moderate your sign ups, use the IPS spam service, email and admin verification and an occupational field, those all stay the same.  

Thanks, to not sidetrack this any further I created a new topic.

https://invisionpower.com/forums/topic/436717-social-sign-in-still-want-additional-info/

Share this comment


Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Add a comment...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...