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

NC for Hire

One of the questions I get quite often is " How do i keep visitors from copying my community content?"  The truth is, you can't but If you are like me, it frustrates the hell out of you when visitors who stop by simply steal the content from your site without becoming part of the community.   This is where this tip comes in.

What this will do is automatically open a popup which tells the thief that you know they are copying content and makes a suggestion to just link back to the community.

How to Read a Land Survey

DEMO:  Try Copying anything from this page to see the result

This is a simple copy-paste notification, with a couple of effects. 

When visitors copy something from your website, they get a kind message asking them to remember to mention your website if they paste the article on their own.

That's all. Just a kind reminder. It uses Session Storage to avoid spamming the visitor with messages in case they copy more than one article. This means that the message will show once every time they visit your website and try to copy. You can also use Local Storage if you want to show the message only once, untill the visitors reset it with a cleaner or using their browser cleaning tools.

 

Step One:   Edit this block of HTML and add it to the Below Footer HTML box in your Sites and Pages

<!-- Start: The copy notification -->
<div class="copy-notify">
<h3>Hey there! <br/> It looks like you are enjoying the community content. </h3>
<p>That's nice! Please <strong>don't forget</strong> to mention us if you use what you just copied on your website. Help strenthen the community by linking back to us!</p>
<br/>
<p class="thanks"><strong>Thank you very much! Have a nice day! :)</strong></p>
<div class="close-it">Ok. Don't bother me again, for this session.</div>
</div>
<!-- End: The copy notification -->

 

Step Two:  Add This Block of Jquery Code to your Custom Code bottom section in the backend  

<script type="text/javascript">
x$(function() {
x$(document).bind('copy', function() {
//Check Session Storage and show the message
if (sessionStorage.getItem('copyNotify') != 'off') {
x$('.copy-notify')
.removeClass('hideDown')
.addClass('showUp')
.css('opacity', '1');
x$('.site-wrapper').addClass('blur-it')
}
});
//Check Session Storage and show the message
x$('.close-it').click(function() {
x$('.copy-notify')
.removeClass('showUp')
.addClass('hideDown')
.css('opacity', '0');
x$('.site-wrapper').removeClass('blur-it')
sessionStorage.setItem('copyNotify', 'off');
});
});
</script>

 

 

Step Three:  Add this to your Design Studio CSS

.copy-notify {
font-family: Roboto, Arial, Helvetica, sans-serif;
background: #fff;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
padding: 20px;
position: fixed;
left: 50%;
margin-left: -150px;
bottom: 10px;
width: 300px;
border: 1px solid rgba(0, 0, 0, 0.2);
font-size: 15px;
bottom: -200px;
opacity: 0;
z-index: 9999999;
}

.copy-notify h3 {
font-weight: bold;
margin-bottom: 10px;
font-size: 19px;
}

.copy-notify p {
line-height: 20px;
}

.copy-notify .thanks {
text-align: center;
}

.close-it {
font-size: 12px;
margin-top: 20px;
background: #0288D1;
color: #fff;
padding: 10px;
text-align: center;
cursor: pointer;
-webkit-transition: all ease-out 1s;
transition: all ease-out 1s;
}

.close-it:hover {
background: #03A9F4;
}

.showUp {
-webkit-transition: all ease-out 0.300s;
transition: all ease-out 0.300s;
bottom: 0;
}

.hideDown {
-webkit-transition: all ease-out 0.300s;
transition: all ease-out 0.300s;
bottom: -200px;
opacity: 0;
}

.blur-it {
-webkit-transition: -webkit-filter ease-out 0.5s, filter ease-out 0.5s;
transition: -webkit-filter ease-out 0.5s, filter ease-out 0.5s;
-webkit-filter: blur(5px);
filter: blur(5px);
}

 

Of course, this does not totally protect your from people copying or stealing your content. It is just a friendly message to remind them to give you some credit. It also subtly lets them know that you know that they are copying your content. Enjoy! Let me know if you need help with your Ning Community!

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

Join Ning Creators Social Network

Votes: 0
Email me when people reply –

Replies

  • You can add a little code to stop the copying off content for visitors. You can disable it for the whole site of just for certain pages if you prefer.

    For instance here is code I added to disable the copy and paste of my forum

    <script>
    x$(document).ready(function () {
    if (ning.CurrentProfile === null){
    x$('.page-general-forum').bind('cut copy paste', function (e) {
    e.preventDefault();
    });
    }
    });
    </script>

     

    To stop copying from the whole site you would just add the body instead of pages like this

    <script>
    x$(document).ready(function () {
    if (ning.CurrentProfile === null){
    x$('body').bind('cut copy paste', function (e) {
    e.preventDefault();
    });
    }
    });
    </script>

    Hope that helps JF  :-)

    • NC for Hire

      interesting Bizz.. ill check it out... thank you

    • Hi Bizz where do I put that code?  I will use the one about copying from my whole site.  That will include photos?

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

Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"I agree with you, but I want it rounded, on the square it gives no problem,this is an impossible…"
9 hours ago
Bizz replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"It's because you are using the ridge as a border, to create the ridge the border property adds the…"
10 hours ago
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"I don't want to go below 13 px I know all would be ok but it's too logical"
13 hours ago
Rosas † Negras replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
"#xg_masthead /*Top Image*/ {margin: auto;display: block;height:600px;width: auto…"
13 hours ago
Bizz replied to Rosas † Negras's discussion
After many years of experience, I would like to know from you designers how I can solve this problem and a ridge
" show the css you have used for the border"
13 hours ago
Rosas † Negras posted a discussion
15 hours ago
Anam replied to George H. Compton IV's discussion
(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"OH MY GOD!!!! :D :D :D It worked!!!
 
I am so pleased. Thank you Bizz and Rosas for your help. I…"
20 hours ago
Anam replied to George H. Compton IV's discussion
(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"Thank you Rosas and Bizz.
I am afraid I do not understand these instructions.
I will see if I can…"
20 hours ago
Anam and Rosas † Negras are now friends
20 hours ago
Pam Givens replied to ⚡JFarrow⌁'s discussion
TIP: 😳Friendly Reminder for Visitors Who Copy Your Content in 3 Easy Steps
"Hi Bizz where do I put that code?  I will use the one about copying from my whole site.  That will…"
yesterday
Bizz replied to George H. Compton IV's discussion
(TIP N3.0 & N2.0) let's hang some Christmas lights..CSS.. Happy holidays :-) updated 12-04-14
"I would do it this way instead of using the ningbar, this way it does not matter how tall your ning…"
yesterday
Rosas † Negras replied to Steve C's discussion
Ning 2 new member welcome image: Can I remove or replace it?
"I read later, the link to delete the whole box was missing"
yesterday
More…

Meanwhile, you can check our social media channels