تبادل اعلاني جديد من الوليد نت مجانا

أدخل كلمات بحثك

تعلم طريقة اختيار نص و نشره علي تويتر
،،،،،،،،، لقد تم تغير اسم الموقع من موقع الوليد نت الي موقع الوليد نت 2 ,والرابط من alwalednet.blogspot.com الى alwalednet2.blogspot.com , , اتمنى ان ينال اعجابكم ×

تعلم طريقة اختيار نص و نشره علي تويتر


طريقة اختيار نص و نشره علي تويتر


بسم الله الرحمن الرحيم

مرحبا بكم في موقع الوليد نت..
 اليوم موضوعنا عن طريقة اختيار نص و نشره علي تويتر How to Select Text and Share it to Twitter ...


طريقة اختيار نص و نشره علي تويتر
سنتعرف اليوم علي طريقة اختيار نص و نشره علي تويتر لموقع بلوغسبوت الخاص بك و هي طريقة فريدة من نوعها وفعالة بما يكفي لمساعدتك في الحصول على مزيد من الزوار إلى موقع الويب الخاص بك مع مساعدة من تويتر. في هذه المقالة، سوف نقوم بشرح كيفية اختيار نص و نشره إلى تويتر.

ما هو تحديد النص و نشره في تويتر؟

هي اضافة تساعد بفاعلية بحيث تعطي للمستخدمين القدرة على تحديد أي نص على المدونة الخاصة بهم أو موقع لمشاركته في الموقع الاجتماعي تويتر المفضل لديهم. فمن السهل للغاية تثبيتها واستخدامها.
Share it to Twitter

في الصورة أعلاه، لقد أظهرنا كيف تعمل هذه الاضافة. عند اختيار جزء صغير من هذا النص تظهر أيقونة تويتر، عند النقر علي هذه الايقونة يمكنك مشاركة تلك القطعة من النص إلى حساب تويتر الخاص بك، مما يجعل عملية المشاركة أسهل.

كيفية تثبيت هذه الاضافة؟


طريقة التركيب او التثبيت لهذه الاضافة بسيطة للغاية، وسوف تأخذ بالكاد بضع ثوان لإكمالها. أول شيء، تحتاج إلى القيام به هو تسجيل الدخول إلى حسابك في بلوجر وتحديد المدونة التي تريد تثبيت الاضافة عليها.

اذهب الي القالب >> تعديل HTML >> ابحث عن ]]></b:skin> و فوقها مباشرة قم باضافة الكود التالي:

.MBLSharetip {
display:none;
top:0;
background:#333;
color:#f16786;
width:40px;
height:32px;
position:absolute;
margin-left:-20px;
opacity:0;
filter:alpha(opacity=0);
z-index:99;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease-in-out;
-o-transition:all .3s ease;
transition:all .3s ease-in-out;
}
.MBLSharetip span {
position:absolute;
content:" ";
border:solid rgba(0,0,0,0);
height:0;
width:0;
top:100%;
border-top-color:#333;
left:50%;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease-in-out;
-o-transition:all .3s ease;
transition:all .3s ease-in-out;
border-width:7px;
margin:0 0 0 -7px;
}
.MBLSharetip a {
color:#f16786;
}
.MBLSharetip:hover {
background:#3D566E;
}
.MBLSharetip:hover span {
border-top-color:#3D566E;
}
.tooltipContainer {
position:relative;
display:block;
width:100%;
height:100%;
top:0;
left:0;
}
.tooltipContainer a {
width:100%;
background:transparent url(http://4.bp.blogspot.com/-HCutv6Nw8iM/VK_Q-v7WT1I/AAAAAAAAFTY/rbxVAhvs_dM/s1600/sprites.png) 0 0 no-repeat;
left:0;
top:0;
height:100%;
text-decoration:none;
display:block;
padding:0;
}
.sharingLink {
display:block;
position:absolute;
text-indent:-9999px;
}

بعد اضافة الكود السابق ... ابحث عن هذا الكود </head> و فوقها مباشرة قم باضافة الكود التالي:
<script type='text/javascript'>
/*<![CDATA[*/
$(document).ready(function() {
textToShare = '';
$(document).mousemove(function(m) {
generateTooltipPosition();
});
});
$(document).mouseup(function() {
$(document).mousemove(function(m) {
generateTooltipPosition()
});
var textToShare = getTextToShare();
var MBLSharetip = document.getElementById("MBLSharetip");
if (textToShare != '') showMeTooltip();
});
$(document).click(function() {
var textToShare = getTextToShare();
var tooltipTitle = null;
var newTooltipTitle = $("#MBLSharetip").attr("title");
if (newTooltipTitle == "") return;
if (newTooltipTitle !== tooltipTitle) $('#MBLSharetip').animate({
opacity: 0
}, 30);
if (textToShare != "") showMeTooltip();
});
$(window).resize(function() {
if ($('#MBLSharetip').show()) {
$('#MBLSharetip').animate({
opacity: 0
}, 30);
}
});
function showMeTooltip() {
var pageURL = window.location.toString();
var twitterLink = "https://twitter.com/intent/tweet?text=" + getTextToShare() + "&via=" + twitterAccount + "&url=" + pageURL;
$('#MBLSharetip').show();
$('#MBLSharetip').animate({
opacity: 1
}, 30);
$('#sendToTwitter').attr('href', twitterLink);
}
function getTextToShare() {
shareTxt = '';
if (window.getSelection) {
shareTxt = window.getSelection();
generateTooltipPosition();
} else if (document.getSelection) {
shareTxt = document.getSelection();
generateTooltipPosition();
}
return shareTxt;
}
function generateTooltipPosition() {
var selection = window.getSelection && window.getSelection();
if (selection && selection.rangeCount > 0) {
range = selection.getRangeAt(0);
pos = $(window).scrollTop();
selection_text = selection.toString(), rect = range.getBoundingClientRect();
$('#MBLSharetip').css({
top: (rect.top + pos - 20) - 32 + 'px',
left: rect.left + (rect.width / 2) + 'px',
});
}
}
/*]]>*/
</script>

و اخيرا ... لظهور الاضافة يجب وضع كود HTML في القالب ... ابحث عن هذا الكود </body> وفوقه مباشرة قم باضافة هذا الكود:
<script>var twitterAccount = "mybloggerlab";</script>
<div class="MBLSharetip" id="MBLSharetip">
<div class="tooltipContainer"><a id="sendToTwitter" href="" class="sharingLink twitter"><span></span></a></div>
</div>

و الان احفظ القالب ... و مبروك عليك الاضافة الجديدة ... اذهب الي المدونة الخاصة بك و اختار اي نص و قم بتظليله و ستري ماذا سيحدث بعد ذلك ...










تعلم طريقة اختيار نص و نشره علي تويتر تعلم طريقة اختيار نص و نشره علي تويتر Reviewed by walid al Bana on 12:47:00 ص Rating: 5
اظهار التعليقات
اخفاء التعليقات

يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لاضافة كود حوله اولا بمحول الاكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة
محول الأكوادمحول الأكواد الإبتساماتالإبتسامات

   
تجدونا هنا

إنضم إلينا


Join on this site

للحصول على كل جديد المدونة

Mohon Aktifkan Javascript!Enable JavaScript