我公司開發的內容更衣室在JavaScript中,具有以下特點:
- SEO(搜索引擎優化):因爲我們希望搜索引擎是 能閱讀內容併爲它們編制索引,我們只會隱藏它們。
- 標準社交小工具:我們將把這些內容鎖定功能添加到Facebook,Twitter,Google +和LinkedIn本地源代碼 。
- 軟性行爲:因爲我們不想打擾我們的忠實讀者,所以一旦內容被解鎖,解鎖將影響網站上所有被阻止的 內容。
- 源代碼是JavaScript,因此可以將它集成到每個網頁上的 (我們將僅將jQuery用於視覺效果)。
該實現與上面引用的工具類似,即使用cookie。
下面的代碼,如果你想看到它在行動或它與更多的社會整合的小部件,請訪問 How to dramatically increase social media LIKEs to your web site
<head>
<script src="contentslocker.js" type="text/javascript"></script>
</head>
<body>
...
<div class="irBodyLocker">
<p>The rest of the article is locked</p>
<p>To continue reading, become our friend pressing one of the buttons</p>
...put here the social widgets
</div>
<div class="irLockedBody" style="display:none;">
...put here the locked contents
</div>
</body>
The IdeaR.ContentsLocker.lockContents function is invoked by the script.
IdeaR.ContentsLocker.lockContents = function()
{
$(function()
{
if (IdeaR.ContentsLocker.socialActivity() == true)
{
$('div.irBodyLocker').hide();
$('div.irLockedBody').show();
}
// Add social handlers only if contents are locked
else
$(function()
{
// Facebook
var exsistingFbAsyncInit = window.fbAsyncInit;
if (exsistingFbAsyncInit == null)
window.fbAsyncInit =
IdeaR.ContentsLocker._subscribeFacebookLike();
else
window.fbAsyncInit = function()
{
exsistingFbAsyncInit();
IdeaR.ContentsLocker._subscribeFacebookLike();
};
// Twitter
twttr.ready(function (twttr)
{
twttr.events.bind('tweet',
IdeaR.ContentsLocker.ontwitteraction);
twttr.events.bind('follow',
IdeaR.ContentsLocker.ontwitteraction);
});
});
});
};
IdeaR.ContentsLocker.socialActivity = function()
{
return IdeaR.ContentsLocker._getCookie(
IdeaR.ContentsLocker._socialAction, 'false') == 'true' ? true : false;
};
IdeaR.ContentsLocker._getCookie = function (name, defaultValue)
{
var docCookies = document.cookie.split(";");
for (var i = 0; i < docCookies.length; i++)
{
var equalPos = docCookies[i].indexOf('=');
var currentName = unescape(docCookies[i].substr(0, equalPos));
currentName = currentName.replace(/^\s+|\s+$/g, '');
if (currentName == name)
{
var value = docCookies[i].substr(equalPos + 1);
return unescape(value);
}
}
return defaultValue;
};
IdeaR.ContentsLocker._socialAction = 'SocialAction';
IdeaR.ContentsLocker._subscribeFacebookLike = function()
{
FB.Event.subscribe('edge.create', function (targetUrl)
{
IdeaR.ContentsLocker.unlockContents();
});
};
IdeaR.ContentsLocker.ontwitteraction = function (intent_event)
{
if (intent_event)
IdeaR.ContentsLocker.unlockContents();
};
IdeaR.ContentsLocker.unlockContents = function()
{
$('div.irBodyLocker').slideUp(400, function()
{
$('div.irLockedBody').fadeIn();
});
IdeaR.ContentsLocker.saveSocialAction();
};
IdeaR.ContentsLocker.saveSocialAction = function()
{
IdeaR.ContentsLocker._setCookie(
IdeaR.ContentsLocker._socialAction, true, 10000);
};
IdeaR.ContentsLocker._setCookie = function (name, value, expirationDays)
{
var cookieString = escape(name) + '=' + escape(value);
if (expirationDays != null)
{
var expirationDate = new Date();
expirationDate.setDate(expirationDate.getDate() + expirationDays);
cookieString += '; expires=' + expirationDate.toUTCString();
}
document.cookie = cookieString;
};