Current status of the Ning Platform is always available on the Ning Status Blog.

 

 HERE IS ALL THE CODE ETC

You can also find the code here: https://jr-images.ning.com/general-forum/sharing-feature

Here is the code used for the Sharing Feature that I created and how to set it up.

Pages this will work on: Articles, Forum, Blog, Photos, Videos, Events and Groups ( note: for the groups it will not work on the pages in the group but will share the group from the group list page )

Note: If a page is marked for members only etc and not public then it will still be shared to the activity feed but content or images will not be visible as in the example below

Private Post Example

10091002297?profile=RESIZE_584x

First thing we need to do is add the code, first will be the CSS then we will add the main custom code, there are two options to add the main code so please only choose one of them.

Once the code is added it only needs to be done once so no need to add the code for each page instance. To add the share to the pages we will be adding modules for that.

Ok so let's add the CSS first which goes in your Design Studio > Custom CSS

 

/******* NEW SHARING LAYOUT V10.0 *******/

@media screen and (max-width: 769px) {
.feed-story .media-frame > .media-body {
overflow: visible!important;
}
}
.sharingContainer-Actual .activityFeed-close.activity-close{
display:none!important;
}
.sharingContainer-Actual .activityFeed-headline,
.sharingContainer-Actual .activityFeed-content.media-frame,
.sharingContainer-Actual .activityFeed-avatar{
pointer-events:none;
}
.sharingOverlay{
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background-color: rgba(0,0,0,0.5);
overflow:hidden;
z-index:9999;
}
.sharingOverlay.active{
display:block!important;
}
.sharingWrapper-container{
width: 100%;
height: 100%;
position: relative;
z-index: 10000;
overflow:auto;
}
.sharingWrapper-inner{
width:100%;
max-width: 500px;
background-color: white;
padding: 10px;
display: block;
border-radius: 6px;
border: solid 10px cornflowerblue;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
height: auto;
}
.sharingWrapper-inner h1{
background-color: royalblue;
color: white;
padding: 10px;
margin-bottom: 10px;
font-size:16px;
font-family: 'Roboto', sans-serif;
}
.sharingFooter{
padding: 10px;
border-top: solid 1px lightgray;
margin-top: 10px;
}
.sharing-footerButtons{
display: flex;
align-items: center;
align-content: center;
justify-content: space-between;
}
.sharingComplete-footer .sharing-footerButtons{
justify-content: flex-end;
}
.sharingButtons{
width: 100px;
border: none;
border-radius: 4px;
border:solid 3px #e3e3e3;
margin:4px;
font-family: 'Roboto', sans-serif;
}
.sharingButtons:hover{
background-color:royalblue;
color:white;
}
/* This is the title taken from the page or group being shared*/
.sharingPage-title,
.sharingPage-title a,
.sharingPage-title .groupHub-groupTitle,
.sharingPage-title .groupHub-groupTitle > span{
pointer-events:none;
background-color:transparent;
display:block;
font-size:20px;
color:#5336bb;
padding: 0px 4px;
text-align:left;
font-weight:bold;
font-family: 'Roboto', sans-serif;
}
.sharedTitle{
display:none;
}
.sharingPage-title .entry-title{
margin-bottom:15px;
}
.saySomething-div{
margin-top:15px;
}
.saySomething-div > h3{
font-size:12px;color: gray;
margin-bottom: 3px;
}
.saySomething{
width:100%;
}
.shareTools{
display: flex;
align-content: center;
align-items: center;
justify-content: flex-end;
margin-bottom:10px;
z-index:2;
position:relative;
}
/*The share button*/
.shareTools-share, .shareTools-share-group{
font-size: 12px;
background-color: #f0f2f0;
color: #606f5f!important;
padding: 4px 5px;
margin: 0;
border: solid 1px lightblue;
transition:0.2s;
display: flex;
align-content: center;
align-items: center;
justify-content: center;
font-family: 'Roboto', sans-serif;
}
.shareTools-share >span, .shareTools-share-group >span{
font-size: 16px;
margin-left: 5px;
}
.shareTools-share:hover, .shareTools-share-group:hover{
background-color:royalblue;
color:white!important;
text-decoration:none!important;
transition:0.2s
}
.shareTools-share-group{
margin-top:4px;
margin-right:4px;
}
.shared-Group .activityFeed-headline .groupHeader-groupName {
margin-top:10px;
font-size:20px;
line-height:1;
}
/** hide the default site image so it doesn't show when loading the group image **/
.shared-Group .activityFeed-content a.media-img img{
display:none;
}
.shared-Group .groupHeader-image{
background-size:cover;
width:180px;
height:180px;
}
.shared-Group .activityFeed-detailTitle.create_status a + br{
display:none;
}
.shared-Group .activityFeed-detailTitle.create_status > a:first-of-type{
padding-bottom:2px;
}
.shared-Group .activityFeed-detail{
display:none;
}
.shared-Group .eventPage-image-wrapper{
text-align:center;
}
.sharedPost-activity .activityFeed-detailTitle.create_status {
display:block;
width:100%;
padding-top: 15px;
font-weight:600;
font-family:arial;
font-size:15px;
letter-spacing:0.02em;
}
.sharedPost-noImage .eventPage-image-wrapper img{ display:none!important }
.sharedPost-hasImage .eventPage-image-wrapper img{ display:block!important }

@media screen and (min-width: 969px) {
.sharedPost-activity .activityFeed-detailTitle.create_status {
padding-top:5px;
}}
@media screen and (max-width: 481px) {
.sharedPost-activity .activityFeed-detailTitle.create_status {
padding-top:40px;
}}
.sharedPost-activity .feedEvent-createStatus .activityFeed-headline{
padding-right:2px;
}
/* Stops the status link from being clicked **/
.sharedPost-activity header:nth-child(1) > a:nth-child(2){ pointer-events:none}
.shared-Group header:nth-child(1) > a:nth-child(2){ pointer-events:none}
/*Removes the add comment link for shared items **/
.sharedPost-activity .activityFeed-commentFormDisplay,
.shared-Group .activityFeed-commentFormDisplay{
display:none;
}
.sharedPost-activity.sharedEvent .eventPage-image-wrapper img{
width:180px;
height:180px;
}

 

For the custom code we have two options, as there is quite a bit of code. The first option is just to add straight into your custom code box. The second option is to add the code to your file manager then link to it from the custom code box which will save space.

OPTION 1  This code goes into your Social Site Builder > Custom Code > End Of Page  ( do not copy this line with the code )

 

<script>
//SHARING VER10 CODE JBIZLEY 2022
x$(document).ready(function(){
x$('.discussionDetailPage .entry-content,.articleDetailPage .entry-content, .blogDetailPage .entry-content').each(function() {
if (x$(this).find('img').length <= 0) {
x$(this).closest('body').addClass('sharing-noImage');
} else {
x$(this).closest('body').addClass('sharing-hasImage').removeClass('sharing-noImage');
}
});
x$('.blogDetailPage .blogDetailPage-image').closest('body').addClass('sharing-hasImage');
x$('.articleDetailPage .articleDetailPage-image').closest('body').addClass('sharing-hasImage');
x$('.photoDetailPage').closest('body').addClass('sharePhoto sharing-hasImage');
x$('.videoDetailPage').closest('body').addClass('shareVideo sharing-hasImage');
x$('.eventDetailPage').closest('body').addClass('shareEvent sharing-hasImage');
if (ning.CurrentProfile === null){
x$('body').addClass('visitor');
}else {
x$('body').addClass('isMember');
}
const sharingWrapperContainer = x$('<div class="sharingOverlay"><div class="sharingWrapper-container"><div class="sharingWrapper-inner"><section class="sharingContainer-Part1"><header class="sharingHeader"><h1 class="sharingTitle">Sharing</h1></header><div class="sharingStart-container"><h3 class="sharingPage-title"></h3><span class="sharedTitle"></span><span class="sharingLink"></span><div class="saySomething-div"><h3>Say Something About This ?</h3><textarea class="saySomething" placeholder="You can add a short message about the post here..."></textarea></div><footer class="sharingStart-footer sharingFooter"><div class="sharing-footerButtons"><button class="shareCancel sharingButtons" title="Cancel">Cancel</button><button class="shareThis-button sharingButtons" title="Share This">Share</button></footer></section><section class="sharingFinish"><h1 class="finishTitle">Sharing Complete</h1><footer class="sharingComplete-footer sharingFooter"><div class="sharing-footerButtons"><button class="sharingFinish-close sharingButtons" title="Finish Sharing">Finish</button></div></section></div></div>').prependTo('body').hide();
let shareContainerActual = x$('.module-name:contains("sharingContainer-page")').closest('.section-activity').addClass('sharingContainer-Actual').hide();//this is the actual activity section
let hasSharing = x$('.sharingContainer-Actual').closest('body').addClass('sharingAvailable'); // if an activity has been added to a page for sharing
let shareActivitySection = x$('.sharingContainer-Actual .feed-story, .sharingContainer-Actual .activityFeed-updateButton,.sharingContainer-Actual .activityFeed-moreOldItemsButton').hide();
let attachActivity = x$('.sharingContainer-Actual').appendTo('.sharingActivity-container');
let shareOptions = x$('<div class="shareTools"><a class="shareTools-share" title="Share Post" href="#/" >Share This<span>&#8634</span></a><a class="shareTools-share-group" title="Share Group" href="#/" >Share Group<span>&#8634</span></a></div>').insertBefore('.discussionDetailPage-mainSection .entry-headline, .videoDetailPage .entry-headline, .photoDetailPage .entry-headline, .articleDetailPage .entry-headline, .blogDetailPage .entry-headline, .eventDetailPage .entry-headline,.pollDetailPage .entry-headline, .groupHub-groupTitleContainer').hide();
x$('body.sharing-noImage .sharedTitle').text("Shared Post....");
x$('body.sharing-hasImage .sharedTitle').text("Shared Post.....");
x$('body.sharePhoto.sharing-hasImage .sharedTitle').text("Shared Photo.....");
x$('body.shareVideo.sharing-hasImage .sharedTitle').text("Shared Video.....");
x$('body.shareEvent.sharing-hasImage .sharedTitle').text("Shared Event.....");
x$('body.visitor .shareTools').remove();
x$('.sharingLink').hide();
x$('.sharingAvailable .shareTools').show();
x$('.sharingAvailable .shareTools-share-group ').hide();
x$('.sharingAvailable .groupHub-group .shareTools-share').hide();
x$('.sharingAvailable .groupHub-group .shareTools-share-group').show();
x$('.sharingFinish').hide();
// Share Button
x$('.shareTools-share').click(function(){
x$(this).closest('.section-primaryContent').addClass('isSharing');
var PostsUrl = window.location.href;
x$('.sharingLink').append(PostsUrl);
x$('.isSharing .entry-title').clone().appendTo('.sharingPage-title');
x$('.sharingOverlay').addClass('active');
});
//Share Group Button
x$('.shareTools-share-group').click(function(){
x$('.groupHub-group').removeClass('sharingGroup');
var GroupUrl=x$(this).closest('a.matrix-media-1-1').attr('href');
x$(this).closest('.groupHub-group').addClass('sharingGroup');
x$('.sharingGroup .groupHub-groupTitle').clone().appendTo('.sharingPage-title');
x$('.sharingLink').append(GroupUrl);
x$('.sharingOverlay').addClass('active');
x$('.sharedTitle').text("Shared Group.....");
});
// Share Cancel Button
x$('.shareCancel').click(function(){
x$('.sharingOverlay').removeClass('active');
x$('.section-primaryContent').removeClass('isSharing');
x$('.shareTools-share').hide();
x$('.sharingGroup .shareTools-share-group').hide();
});
// Share This Button
x$('.shareThis-button ').click(function(){
var sharingPost =x$('.sharedTitle').text();
var sharingValue = x$('.sharingLink').text();
var sharingAddTitle =x$('.isSharing .entry-title').text().toUpperCase();
var saySomethingTxt = x$('.saySomething').val();
x$('.js-statusForm .input-full').append(sharingPost +"\n"+ sharingValue +"\n"+ sharingAddTitle +"\n"+ saySomethingTxt);
x$('.js-statusForm .button-primary').trigger('click');
x$('.sharingContainer-Part1').hide();
x$('.sharingFinish').show();
});
// Share Finish Button
x$('.sharingFinish-close').click(function(){
x$('.sharingLink, .sharingPage-title').text('');
x$('.sharingWrapper-container').removeClass('active');
x$('.sharingAvailable .shareTools, .sharingAvailable .shareTools-share-group').hide();
x$('.sharingOverlay').removeClass('active');
x$('.section-primaryContent').removeClass('isSharing');
});
// Sharing Into Activity Feed
x$('.activityFeed-detailTitle.create_status:contains("Shared Group.....")').closest('.feed-story').addClass('sharedPost-activity shared-Group ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post.....")').closest('.feed-story').addClass('sharedPost-activity sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post...")').closest('.feed-story').addClass('sharedPost-activity sharedPost-noImage');
x$('.activityFeed-detailTitle.create_status:contains("Shared Photo.....")').closest('.feed-story').addClass('sharedPost-activity sharedPhoto sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Video.....")').closest('.feed-story').addClass('sharedPost-activity sharedVideo sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Event.....")').closest('.feed-story').addClass('sharedPost-activity sharedEvent sharedPost-hasImage ');
x$('.sharedPost-activity .activityFeed-headline').html(function() {
return x$(this).html().replace("posted a", "is sharing a");
});
x$('.sharedPost-activity.sharedEvent .activityFeed-headline').html(function() {
return x$(this).html().replace("is sharing a", "is sharing an");
});
x$('.sharedPost-activity header:nth-child(1) > a:nth-child(2)').text('post');
x$('.sharedPost-activity.sharedPhoto header:nth-child(1) > a:nth-child(2)').text('photo');
x$('.sharedPost-activity.sharedVideo header:nth-child(1) > a:nth-child(2)').text('video');
x$('.sharedPost-activity.sharedEvent header:nth-child(1) > a:nth-child(2)').text('event');
x$('.shared-Group header:nth-child(1) > a:nth-child(2)').text('group');
x$('.feedEvent-createStatus.shared-Group a.media-img').each(function() {
var url=x$(this).attr('href');
x$(this).load(url + " .groupHeader-image, .groupHeader-groupName");
});
// Sharing Into Activity Feed updating the new items with code on click of the update buttons rather than the code running all the time on the activity feed
x$('.activityFeed-updateButton.activityFeed-moreOldItemsButton, .activityFeed-updateButton.activityFeed-moreNewItemsButton').click(function(){
x$('.activityFeed').ajaxStop(function() {
x$('.activityFeed-detailTitle.create_status:contains("Shared Group.....")').closest('.feed-story').addClass('sharedPost-activity shared-Group ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post.....")').closest('.feed-story').addClass('sharedPost-activity sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post...")').closest('.feed-story').addClass('sharedPost-activity sharedPost-noImage');
x$('.activityFeed-detailTitle.create_status:contains("Shared Photo.....")').closest('.feed-story').addClass('sharedPost-activity sharedPhoto sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Video.....")').closest('.feed-story').addClass('sharedPost-activity sharedVideo sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Event.....")').closest('.feed-story').addClass('sharedPost-activity sharedEvent sharedPost-hasImage ');
x$('.sharedPost-activity .activityFeed-headline').html(function() {
return x$(this).html().replace("posted a", "is sharing a");
});
x$('.sharedPost-activity header:nth-child(1) > a:nth-child(2)').text('post');
x$('.sharedPost-activity.sharedPhoto header:nth-child(1) > a:nth-child(2)').text('photo');
x$('.sharedPost-activity.sharedVideo header:nth-child(1) > a:nth-child(2)').text('video');
x$('.sharedPost-activity.sharedEvent header:nth-child(1) > a:nth-child(2)').text('event');
x$('.shared-Group header:nth-child(1) > a:nth-child(2)').text('group');
x$('.feedEvent-createStatus.shared-Group a.media-img').each(function() {
var url=x$(this).attr('href');
x$(this).load(url + " .groupHeader-image, .groupHeader-groupName");
});
});
});
});
</script>

 

OPTION 2 Linking to the code ( do not copy this line with the code )

To link the code we first need to copy the code to a text editor like wordpad or something like that. The code does not have the begining Script tags or the end tags. Code is below without the tags

//SHARING VER10 CODE JBIZLEY 2022
x$(document).ready(function(){
x$('.discussionDetailPage .entry-content,.articleDetailPage .entry-content, .blogDetailPage .entry-content').each(function() {
if (x$(this).find('img').length <= 0) {
x$(this).closest('body').addClass('sharing-noImage');
} else {
x$(this).closest('body').addClass('sharing-hasImage').removeClass('sharing-noImage');
}
});
x$('.blogDetailPage .blogDetailPage-image').closest('body').addClass('sharing-hasImage');
x$('.articleDetailPage .articleDetailPage-image').closest('body').addClass('sharing-hasImage');
x$('.photoDetailPage').closest('body').addClass('sharePhoto sharing-hasImage');
x$('.videoDetailPage').closest('body').addClass('shareVideo sharing-hasImage');
x$('.eventDetailPage').closest('body').addClass('shareEvent sharing-hasImage');
if (ning.CurrentProfile === null){
x$('body').addClass('visitor');
}else {
x$('body').addClass('isMember');
}
const sharingWrapperContainer = x$('<div class="sharingOverlay"><div class="sharingWrapper-container"><div class="sharingWrapper-inner"><section class="sharingContainer-Part1"><header class="sharingHeader"><h1 class="sharingTitle">Sharing</h1></header><div class="sharingStart-container"><h3 class="sharingPage-title"></h3><span class="sharedTitle"></span><span class="sharingLink"></span><div class="saySomething-div"><h3>Say Something About This ?</h3><textarea class="saySomething" placeholder="You can add a short message about the post here..."></textarea></div><footer class="sharingStart-footer sharingFooter"><div class="sharing-footerButtons"><button class="shareCancel sharingButtons" title="Cancel">Cancel</button><button class="shareThis-button sharingButtons" title="Share This">Share</button></footer></section><section class="sharingFinish"><h1 class="finishTitle">Sharing Complete</h1><footer class="sharingComplete-footer sharingFooter"><div class="sharing-footerButtons"><button class="sharingFinish-close sharingButtons" title="Finish Sharing">Finish</button></div></section></div></div>').prependTo('body').hide();
let shareContainerActual = x$('.module-name:contains("sharingContainer-page")').closest('.section-activity').addClass('sharingContainer-Actual').hide();//this is the actual activity section
let hasSharing = x$('.sharingContainer-Actual').closest('body').addClass('sharingAvailable'); // if an activity has been added to a page for sharing
let shareActivitySection = x$('.sharingContainer-Actual .feed-story, .sharingContainer-Actual .activityFeed-updateButton,.sharingContainer-Actual .activityFeed-moreOldItemsButton').hide();
let attachActivity = x$('.sharingContainer-Actual').appendTo('.sharingActivity-container');
let shareOptions = x$('<div class="shareTools"><a class="shareTools-share" title="Share Post" href="#/" >Share This<span>&#8634</span></a><a class="shareTools-share-group" title="Share Group" href="#/" >Share Group<span>&#8634</span></a></div>').insertBefore('.discussionDetailPage-mainSection .entry-headline, .videoDetailPage .entry-headline, .photoDetailPage .entry-headline, .articleDetailPage .entry-headline, .blogDetailPage .entry-headline, .eventDetailPage .entry-headline,.pollDetailPage .entry-headline, .groupHub-groupTitleContainer').hide();
x$('body.sharing-noImage .sharedTitle').text("Shared Post....");
x$('body.sharing-hasImage .sharedTitle').text("Shared Post.....");
x$('body.sharePhoto.sharing-hasImage .sharedTitle').text("Shared Photo.....");
x$('body.shareVideo.sharing-hasImage .sharedTitle').text("Shared Video.....");
x$('body.shareEvent.sharing-hasImage .sharedTitle').text("Shared Event.....");
x$('body.visitor .shareTools').remove();
x$('.sharingLink').hide();
x$('.sharingAvailable .shareTools').show();
x$('.sharingAvailable .shareTools-share-group ').hide();
x$('.sharingAvailable .groupHub-group .shareTools-share').hide();
x$('.sharingAvailable .groupHub-group .shareTools-share-group').show();
x$('.sharingFinish').hide();
// Share Button
x$('.shareTools-share').click(function(){
x$(this).closest('.section-primaryContent').addClass('isSharing');
var PostsUrl = window.location.href;
x$('.sharingLink').append(PostsUrl);
x$('.isSharing .entry-title').clone().appendTo('.sharingPage-title');
x$('.sharingOverlay').addClass('active');
});
//Share Group Button
x$('.shareTools-share-group').click(function(){
x$('.groupHub-group').removeClass('sharingGroup');
var GroupUrl=x$(this).closest('a.matrix-media-1-1').attr('href');
x$(this).closest('.groupHub-group').addClass('sharingGroup');
x$('.sharingGroup .groupHub-groupTitle').clone().appendTo('.sharingPage-title');
x$('.sharingLink').append(GroupUrl);
x$('.sharingOverlay').addClass('active');
x$('.sharedTitle').text("Shared Group.....");
});
// Share Cancel Button
x$('.shareCancel').click(function(){
x$('.sharingOverlay').removeClass('active');
x$('.section-primaryContent').removeClass('isSharing');
x$('.shareTools-share').hide();
x$('.sharingGroup .shareTools-share-group').hide();
});
// Share This Button
x$('.shareThis-button ').click(function(){
var sharingPost =x$('.sharedTitle').text();
var sharingValue = x$('.sharingLink').text();
var sharingAddTitle =x$('.isSharing .entry-title').text().toUpperCase();
var saySomethingTxt = x$('.saySomething').val();
x$('.js-statusForm .input-full').append(sharingPost +"\n"+ sharingValue +"\n"+ sharingAddTitle +"\n"+ saySomethingTxt);
x$('.js-statusForm .button-primary').trigger('click');
x$('.sharingContainer-Part1').hide();
x$('.sharingFinish').show();
});
// Share Finish Button
x$('.sharingFinish-close').click(function(){
x$('.sharingLink, .sharingPage-title').text('');
x$('.sharingWrapper-container').removeClass('active');
x$('.sharingAvailable .shareTools, .sharingAvailable .shareTools-share-group').hide();
x$('.sharingOverlay').removeClass('active');
x$('.section-primaryContent').removeClass('isSharing');
});
// Sharing Into Activity Feed
x$('.activityFeed-detailTitle.create_status:contains("Shared Group.....")').closest('.feed-story').addClass('sharedPost-activity shared-Group ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post.....")').closest('.feed-story').addClass('sharedPost-activity sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post...")').closest('.feed-story').addClass('sharedPost-activity sharedPost-noImage');
x$('.activityFeed-detailTitle.create_status:contains("Shared Photo.....")').closest('.feed-story').addClass('sharedPost-activity sharedPhoto sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Video.....")').closest('.feed-story').addClass('sharedPost-activity sharedVideo sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Event.....")').closest('.feed-story').addClass('sharedPost-activity sharedEvent sharedPost-hasImage ');
x$('.sharedPost-activity .activityFeed-headline').html(function() {
return x$(this).html().replace("posted a", "is sharing a");
});
x$('.sharedPost-activity.sharedEvent .activityFeed-headline').html(function() {
return x$(this).html().replace("is sharing a", "is sharing an");
});
x$('.sharedPost-activity header:nth-child(1) > a:nth-child(2)').text('post');
x$('.sharedPost-activity.sharedPhoto header:nth-child(1) > a:nth-child(2)').text('photo');
x$('.sharedPost-activity.sharedVideo header:nth-child(1) > a:nth-child(2)').text('video');
x$('.sharedPost-activity.sharedEvent header:nth-child(1) > a:nth-child(2)').text('event');
x$('.shared-Group header:nth-child(1) > a:nth-child(2)').text('group');
x$('.feedEvent-createStatus.shared-Group a.media-img').each(function() {
var url=x$(this).attr('href');
x$(this).load(url + " .groupHeader-image, .groupHeader-groupName");
});
// Sharing Into Activity Feed updating the new items with code on click of the update buttons rather than the code running all the time on the activity feed
x$('.activityFeed-updateButton.activityFeed-moreOldItemsButton, .activityFeed-updateButton.activityFeed-moreNewItemsButton').click(function(){
x$('.activityFeed').ajaxStop(function() {
x$('.activityFeed-detailTitle.create_status:contains("Shared Group.....")').closest('.feed-story').addClass('sharedPost-activity shared-Group ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post.....")').closest('.feed-story').addClass('sharedPost-activity sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Post...")').closest('.feed-story').addClass('sharedPost-activity sharedPost-noImage');
x$('.activityFeed-detailTitle.create_status:contains("Shared Photo.....")').closest('.feed-story').addClass('sharedPost-activity sharedPhoto sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Video.....")').closest('.feed-story').addClass('sharedPost-activity sharedVideo sharedPost-hasImage ');
x$('.activityFeed-detailTitle.create_status:contains("Shared Event.....")').closest('.feed-story').addClass('sharedPost-activity sharedEvent sharedPost-hasImage ');
x$('.sharedPost-activity .activityFeed-headline').html(function() {
return x$(this).html().replace("posted a", "is sharing a");
});
x$('.sharedPost-activity header:nth-child(1) > a:nth-child(2)').text('post');
x$('.sharedPost-activity.sharedPhoto header:nth-child(1) > a:nth-child(2)').text('photo');
x$('.sharedPost-activity.sharedVideo header:nth-child(1) > a:nth-child(2)').text('video');
x$('.sharedPost-activity.sharedEvent header:nth-child(1) > a:nth-child(2)').text('event');
x$('.shared-Group header:nth-child(1) > a:nth-child(2)').text('group');
x$('.feedEvent-createStatus.shared-Group a.media-img').each(function() {
var url=x$(this).attr('href');
x$(this).load(url + " .groupHeader-image, .groupHeader-groupName");
});
});
});
});

Once you have added the code to your text editor save the file with a .js extension. You can name the file whatever you want but it MUST have this extension. Remember where you saved it as will need to add this later to your file manager

So for instance you would save it something like this      sharingV10.js

When saved it would look like this in the place you saved it:  10090852475?profile=RESIZE_710xNow we have that file we can now add it to our file manager ready for us to link to so head over to your Social Site Builder and select the File Manager from the list.

Next we need to add the file

10090855489?profile=RESIZE_710x10090855880?profile=RESIZE_710x

After you click the Add Files it will now be in your File Manager like this

10090856259?profile=RESIZE_710xWhile we are here we might as well copy the link we need for the file to add to our code box, so go ahead and open a text editor again ready to copy the link to so we can use it later as will be easier to add the link to the line of code we will need.

10090858461?profile=RESIZE_710xNow we have the link we need to insert it into the line of code below

<!-SHARING->
<script Class src="LINK WILL GO HERE"></script>

So copy the above then add you link you saved in the part LINK WILL GO HERE making sure you keep the quotation marks at each end so now it will look something like this but with your link in not mine as in the example below

<!-SHARING->
<script Class src="https://storage.ning.com/topology/rest/1.0/file/get/10075731267?profile=original"></script>

Next we simple add this to our Social Site Builder > Custom Code > End of page

Example

10090863483?profile=RESIZE_710xOK so now we have all the code added that we need to let's now add the modules to the pages for it all to work. This is how you will add the feature to all your pages where you want sharing available

 For this we are going to use the Activity content type for our shared content to be entered into. This is easy to do so head over to Your Social Site Builder then select on the left one of the pages you want it to be added to like a Forum for example, then click the little Add Content button and in the box which opens choose Content Type Activity

10090896889?profile=RESIZE_710xNext we Need to give it a title THIS IS IMPORTANT TO ADD EXACTLY AS SHOWN

10090904669?profile=RESIZE_710xNow we can remove the ticks from the other box's etc so it looks like this for the options

10090906864?profile=RESIZE_400xHit the Update / Save button and this will now be added to the page, you can have it where ever you want as this will not be seen but I tned to have it below my content as you can see in the Add Title image.

Ok that's it all done and sharing will now be available. To add sharing to more pages you just follow the instructions above for adding the Activity Module.

You need to be a member of Ning Creators Social Network to add comments!

Join Ning Creators Social Network

Votes: 1
Email me when people reply –

Replies

      • Mentions will not work with this as we are using the activity feed and mentions are only available in comments instances

  • Does this share to ALL members?

    • It shares it to the main activity feed of your site so all will be able to see it, if the page is set to view by members only etc then the content will not be shown only the title and link to the post like this

      10055773695?profile=RESIZE_584xIf you want to give it a try I will email you an invite link to my demo site Suzie

  • This is a about ready to share now, if anyone is interested let me know and will post instructions and code

    • NC for Hire

      Bizz  

      I love it, it's perfect to see what a member shares and stays on main, yes I would like the codes thanks
      • Will be adding how to add it and all the code here this weekend my friend 👍

  • The code and Setup for this has now been added :-)

This reply was deleted.
 

Some interesting articles related to community management, digital marketing etc. could be found in our digest. Don't hesitate to leave a feedback so we would know that we should continue :-)

Latest Activity

Lucy Gray posted a discussion
Hi All, Question 1: When I send test broadcasts, they typically end up marked as spam in my Gmail…
13 hours ago
Lucy Gray replied to Lucy Gray's discussion
Search Functionality and Other Frustrations
"Just wanted to update this post and let everyone know that the search functionality is now indeed…"
13 hours ago
Alex - Rosas † Negras replied to ⚡JFarrow⌁'s discussion
Ning for Dummies - Interesting
"a thousand thanks ! I would like to buy the book to put it in a painting at home"
Jul 30
Alex - Rosas † Negras replied to Alex - Rosas † Negras's discussion
ONE TIME WE HAD OUR OLD CLASSIC SITE BADGE AND 2.0 NOW IT IS POSSIBLE TO HAVE IT WITH 3.0 THIS IS WHAT I FOUND.
"thank you so much brother"
Jul 30
⚡JFarrow⌁ replied to Alex - Rosas † Negras's discussion
ONE TIME WE HAD OUR OLD CLASSIC SITE BADGE AND 2.0 NOW IT IS POSSIBLE TO HAVE IT WITH 3.0 THIS IS WHAT I FOUND.
"nice work!"
Jul 30
⚡JFarrow⌁ replied to ⚡JFarrow⌁'s discussion
Ning for Dummies - Interesting
"you're welcome... its a pdf so you can download it.."
Jul 30
Alex - Rosas † Negras liked Alex - Rosas † Negras's discussion ONE TIME WE HAD OUR OLD CLASSIC SITE BADGE AND 2.0 NOW IT IS POSSIBLE TO HAVE IT WITH 3.0 THIS IS WHAT I FOUND.
Jul 29
Alex - Rosas † Negras posted a discussion
AND THIS IS THE VISIBLE RESULT IN HTML https://embed.ly/button
Jul 29
Alex - Rosas † Negras replied to ⚡JFarrow⌁'s discussion
Ning for Dummies - Interesting
"thank you very much for the information, I am really happy that there is a book about Ning,I want…"
Jul 29
Alex - Rosas † Negras liked ⚡JFarrow⌁'s discussion Ning for Dummies - Interesting
Jul 29
⚡JFarrow⌁ posted a discussion
I never realized that there was actually a Ning for Dummies book.   It is quite dated but…
Jul 28
Alex - Rosas † Negras replied to ⚡JFarrow⌁'s discussion
A Curated Collection of Over 250 Ning Tips and Tricks
"finally one is alive and well i hope you will be online for new ideas"
Jul 23
More…

Meanwhile, you can check our social media channels