نشر مواضيع المدونه والمواقع تلقائياً على الفيس بوك و تويتر
الزيارات:
الزيارات:
Unknown
|
الخميس, فبراير 21, 2013
|
اضافات بلوجر
|
الشبكات الأجتماعية
|
دروس بلوجر
1
تعليقات حتى الآن
بسم الله الرحمن الرحيم ،اليوم سوف نتعلم كيفية نشر تدوينات بلوجر على تويتر و الفيس بوك معا
و في وقت واحد بطريقة أوتوماتيكية، وهذا يعني أنك عند إضافة أي موضوع جديد
في مدونتك سوف يتم نشره أوتوماتيكيا على موقعي "تويتر" و "فيس بوك" من دون
الحاجة الى نشره بطريقة يدوية ،وهذه العملية جد فعالة بالنسبة لاصحاب
المواقع و المدونات
سوف اقدم الشرح بشكل مبسط مع الاعتماد على الصور التوضيحية
ادخل من هنا للتسجيل
ادخل من هنا للتسجيل
تابع الصور ومعها الشرح :
ويمكنك تسجيل الدخول
مباشره من دون ان تقوم بالتسجيل وذلك بإستخدام حسابك في OpenID اي في اي حساب تملكه مثل Google أو Flickr
او اي حساب آخر تملكه .
و مبروك عليك من الآن جميع المواضيع المدرجة في مدونتك او موقعك سوف يتم نشرها بصفة اوتوماتيكية على مواقع المفضلات الاجتماعية فيسبوك و تويتر
إذا اعجبك الموضوع ، قم بنشره على الازرار المفضلات الاجتماعية اسفله و لك جزيل الشكر في انتظار تشجيعاتكم
السلام عليكم ورحمة الله تعالى وبركاته سوف نشرح في هذه التدوينة كيفية إضافة الأزرار الجانبية للمواقع الإجتماعية مثل :- الفيسبوك ، جوجل بلس ،
تويتر ، والبريد RSS ,وهي عبارة عن إضافة واحدة تحتوي على 4 إضافات حيث أنها تتميز في كونها لا تأخذ حيزا كبيرا في تنسيق المدونة .
قم بالبحث عن الكود التالي :
ثم قم بلصق الكود التالى قبله :]]></b:skin>
img,a{border:0}#on{visibility:visible}#off{visibility:hidden}#facebook_div{width:196px;height:340px;overflow:hidden}#twitter_div{width:246px;height:353px;overflow:hidden}#google_plus_div{width:152px;height:97px;overflow:hidden;margin-left:50px;margin-top:10px}#knfeedburner_div{width:300px;height:97px;overflow:hidden;margin-top:5px;margin-left:-4px}#kakinetwork_div{width:300px;height:97px;overflow:hidden}#facebook_right{z-index:10005;border:2px solid#3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;right:-200px}#facebook_right img{position:absolute;top:-2px;left:-35px}#facebook_right iframe{border:0px solid#3c95d9;overflow:hidden;position:static;height:360px;left:-2px;top:-3px}#twitter_right{z-index:10004;border:2px solid#6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;right:-250px}#twitter_right_img{position:absolute;top:-2px;left:-35px;border:0}#google_plus_right{z-index:10003;background-color:#F2F2F2;border:2px solid#006ec9;border-top:2px solid#0056a0;border-bottom:2px solid#0056a0;border-right:2px solid#0056a0;border-left:hidden;width:152px;height:97px;position:fixed;right:-154px}#google_plus_right_img{position:absolute;top:-2px;left:-33px;border:0}#feedburner_right{z-index:10003;background-color:#fefefe;border:2px solid#5b5b5b;border-top:2px solid#5b5b5b;border-bottom:2px solid#5b5b5b;border-right:2px solid#5b5b5b;border-left:hidden;width:300px;height:97px;position:fixed;right:-303px}#feedburner_right_img{position:absolute;top:-2px;left:-33px;border:0}#kakinetwork_right{z-index:10003;border:2px solid#303030;background-color:#fff;width:300px;height:97px;position:fixed}#kakinetwork_right img{position:absolute;top:-2px;left:-101px}#facebook_left{z-index:10005;border:2px solid#3c95d9;background-color:#fff;width:196px;height:353px;position:fixed;left:-200px}#facebook_left img{position:absolute;top:-2px;right:-35px}#facebook_left iframe{border:0px solid#3c95d9;overflow:hidden;position:static;height:360px;right:-2px;top:-3px}#twitter_left{z-index:10004;border:2px solid#6CC5FF;background-color:#6CC5FF;width:246px;height:353px;position:fixed;left:-250px}#twitter_left_img{position:absolute;top:-2px;right:-35px;border:0}#google_plus_left{z-index:10003;background-color:#006ec9;border:2px solid#006ec9;border-top:2px solid#0056a0;border-bottom:2px solid#0056a0;border-left:2px solid#0056a0;border-right:hidden;width:152px;height:97px;position:fixed;left:-154px}#google_plus_left_img{position:absolute;top:-2px;right:-33px;border:0}#feedburner_left{z-index:10003;background-color:#fefefe;border:2px solid#5b5b5b;border-top:2px solid#5b5b5b;border-bottom:2px solid#5b5b5b;border-left:2px solid#5b5b5b;border-right:hidden;width:300px;height:97px;position:fixed;left:-303px}#feedburner_left_img{position:absolute;top:-2px;right:-33px;border:0}#kakinetwork_left{z-index:10003;border:2px solid#303030;background-color:#fff;width:300px;height:97px;position:fixed}#kakinetwork_left img{position:absolute;top:-2px;right:-101px}.box-title1{border:1px solid#ddd;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:5px 5px 5px#CCCCCC;-moz-box-shadow:5px 5px 5px#CCCCCC;box-shadow:5px 5px 5px#CCCCCC;padding:10px;margin:10px 0}.enteryouremail{background:#fff!important;border:1px solid#d2d2d2;padding:0px 8px 0px 8px;color:#a19999;font-size:12px;height:25px;width:165px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;margin:0px}.submitbutton{background:#F2F2F2;border:1px solid#F66303;-webkit-box-shadow:3px 3px 3px#666;box-shadow:3px 3px 3px#666;font:bold 12px Arial,sans-serif;color:#000000;height:25px;padding:0 12px 0 12px;margin:0 0 0 5px;-webkit-border-radius:5px;border-radius:5px;cursor:pointer}
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ثم إضافة أداة ثم اختر HTML/Javascript
والآن الصق الكود التالي :
تغييرات :-<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script> <script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script> <script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); }); jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); }); jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); }); jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); }); });</script><div id="on"><div id="facebook_right" style="top: 18%;"><div id="facebook_div"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirdRHtlZ8PtjJou1fU9QpPhDZ4OOOti4RXJB-hk5FreKKRlw9r_4q9BrkOo2YGmGanPjP8-ZukDzUmT3nR1O10Fo9EeWdmP2cB4jkPEDMSIyq1YphZ0qko6De38AYXxbWFsSS9xr4dHq4/s1600/facebook-icon.png" alt=""/><iframe src="//www.facebook.com/plugins/likebox.php? href=http%3A%2F%2Fwww.facebook.com%2Fstart4cash&width=200&height=346&colorscheme=light&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:200px; height:346px;" allowtransparency="true"></iframe></div></div></div><div id="on"><div id="twitter_right" style="top: 35%;"><div id="twitter_div"><img id="twitter_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzFRDyaiTgCw4feA7OSg5Tbr6XZnN0fZ2SxkMp-kT2zdNkMDF6CbqhzmbA93-bp0nzdiamV0LJz8RILFEsafQekhkzVmuqiGC6TEUYOOoKbOULOTnJ4UWh5xBdTcTznBF3LOgZT6h-8os/s1600/twitter-icon.png"/> <script src="http://widgets.twimg.com/j/2/widget.js"></script> <script>new TWTR.Widget({version: 2,type: 'profile',rpp: 4,interval: 1000,width: 246,height: 265,theme: {shell: {background: '#63BEFD',color: '#FFFFFF'},tweets: {background: '#FFFFFF',color: '#000000',links: '#47a61e'}},features: { loop: false,live: true,scrollbar: false,hashtags: false,timestamp: true,avatars: true,behavior: 'all' }}).render().setUser('start4cash').start();</script></div></div></div><div id="on"><div id="google_plus_right" style="top: 52%;"><div id="google_plus_div"><img id="google_plus_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4qxNMDcJkHtFeQOK-xWoaLuKFdrhE1HWH18fPXqk-EZ-VHLqI2y-KSrNHswKH3wq5sBmrYAWP660Fg0b99YlYymDyNbOiu14PjhMMprWTOC3y6RFR8s-MW_5GMXGOKG2zXmnLXNhbP5s/s1600/google-plus-icon.png"/><div style="float:left;margin:10px 10px 10px 0;"><g:plusone size="tall" expr:href="data:post.url"></g:plusone></div></div></div><div id="on"><div id="feedburner_right" style=" top: 69%;"><div id="knfeedburner_div"><center><h4 style="color:#F66303;">سجل إميلك وتوصل بمواضيعنا :</h4><form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open ('http://feedburner.google.com/fb/a/mailverify?uri=start4cash', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><input gtbfieldid="10" class="enteryouremail" name="email" value="" onblur="if (this.value == '') {this.value = 'أدخل إميلك هنا ...';}" onfocus="if (this.value == 'أدخل إميلك هنا ...') {this.value = '';}" type="text"/><input value="start4cash" name="uri" type="hidden"/><input value="أرسل" class="submitbutton" type="submit"/></form></center><img id="feedburner_right_img" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEims1fw1VUn4wbXZJEBjTtzVUSmJxuJdYilADuJlXCU28gVYVIg_98UawzD2GPGo_UVcWr6NUghozmz-J54P_dXVkq2Kwuvkpgmzjk4b-piw3o7SqMx9CQw7VYInmcNZHQr0tGyczkjzw/s1600/rssfeed.png"/></div></div></div></div>
إستبدل ما باللون البرتقالي بحسابك علي الفيسبوك
إستبدل ما باللون الأزرق بحسابك على التويتر
إستبدل ما باللون الاحمر بحسابك علي الفيدبيرنر
اليوم سنشرح موقع sharethis الموقع
يقدم خدمة ازرار النشر للشبكات الأجتماعية مما يساعد فى نشر مواضيع موقعك
من الزوار اذا اعجبهم الموضوع سينشروه على صفحاتهم الضغط على أزرار النشر
الخاصه بكل شبكة اجتماعية هم مشتركون بها
الشرح
أولاً قم بالدخول إلى الموقع أضغط هنا
1 - قم بأختيار الشكل الذى تريد ان تظهر به مجموعة أزرار الشبكات الاجتماعية و قم بالضغط على Get The Code
2- اما اذا كنت تريد الأعدادات المتقدمة أضغط على more ptions
بعد الضغط على More Options
- ثم قم باختيار نوع موقعك اذا كان وسط هذه الخيارات و ان لم يكن موجود
فأختار website كما انه يفضل هذا الاختيار لان به العديد من الأدوات أكثر
من أى خيار أخر
- أضغط على Next مكان أشارة السهم فى الصورة
ثم سيظهر ثلاث أنواع من ادوات النشر
المصدر : الأكاديمية الألكترونية
- أضغط على Next مكان أشارة السهم فى الصورة
ثم سيظهر ثلاث أنواع من ادوات النشر
1 - Buttons
ستجد بها ثلاث خيارات


بعد اختيارها أضغط next وستظهر لوحة للتحكم فى أزرار الشبكات الأجتماعية التى تريد ظهورها
2 - Bars
ستجد بها ثلاث خيارات أختر ما يناسبك
![]() |
| الخيار الأول |
![]() |
| الخيار الثانى |
![]() |
| الخيار الثالث |
الخيار الأول : بعد الضغط next يمكنك التحكم فى مكان عرض الاداه على يمين الصفحة أو يسارها و اختيار أزرار الشبكات الأجتماعية
الخيار الثانى : بعد الضغط next يمكنك
التحكم فى العديد من الخيارات كأخر المواضيع متحركة و العديد من أزرار
النشر و الاعجاب و المتابعه كما يمكنك تغيير لون الأداه للون المناسب
لموقعك
الخيار الثالث : بعد الضغط next يمكنك التحكم فى طول الأداة و فى أزار النشر كما يمكنك أضافة لوجو موقعك
3 - Featured
بعد اختيارها أضغط next للتحكم فى أزرار المشاركة التى ستظهر فى الأداة
الأداة تعمل كبيضة تفتح عند مرور الماوس عليها
بعد الانتهاء من أختيار الأداة المناسبة لموقعك و التعديل عليها أضغط Get Code
1 - أدخال البريد الإلكترونى
2 - رابط الموقع
3 - كلمة المرور
4 - اعادة كلمة المرور
5 - الموافقه على أتفاقية الخصوصية و اتفاقية الاستخدام بعد القراءة !
6 - أضغط Register للأشتراك
- بعد ذلك ستظهر الأكواد كما فى هذه الصورة
وقبل أى كود سيظهر فى اى وسم html سنقوم بوضعه به
المصدر : الأكاديمية الألكترونية
مجموعه رائعه من الأيقونات للمواقع و المدونات
الزيارات:
الزيارات:
AboYazan
|
الثلاثاء, ديسمبر 04, 2012
|
الشبكات الأجتماعية
كن أول من يعلق!
هذه
بعض الأيقونات الجميلة الرائعه ، التي حازت إعجابي ، أعرضها عليكم لعلكم تجدون فيها
ما يروقكم و يساعدكم على تحسين مظهر مدوناتكم و مواقعكم . تجدون في هذا الموضوع عشرا
من أجمل المجموعات مرفقة بروابط تحميلها من مواقعها الأصلية و صور لها فقط
اضغط على العنوان او الصورة.
تحياتي!
___________________________
Socialize Icons

___________________________
Coquette Icons

___________________________
Vega Icons

___________________________
مجموعة أيقونات المفضلات

___________________________
Icojoy Icons

___________________________
أيقونات صغيرة للمفضلات

___________________________
Onebit free icon set

___________________________
Social Media Bookmark Icons

___________________________
Function Icons Set

___________________________
Xiao Icon

___________________________
تحياتي!
___________________________
Socialize Icons

___________________________
Coquette Icons

___________________________
Vega Icons

___________________________
مجموعة أيقونات المفضلات
___________________________
Icojoy Icons
___________________________
أيقونات صغيرة للمفضلات

___________________________
Onebit free icon set

___________________________
Social Media Bookmark Icons
___________________________
Function Icons Set
___________________________
Xiao Icon
___________________________
درسنا اليوم هو اضافة تضيف لمسة سحرية فى مدونتك وعليها عامل كبير للزوار وهى أزرار المشاركة الإجتماعية بتقنية jQeury للمدونات مثل الموضوعه فى مدونتى المتواضعه
أولا :- " ما هى تقنية jQeury؟ "
تقنية جميلة جدا وسوف تلاحظهما فى الاضافة بعد تركيبها فى مدونتكم او موقعكم
ثانيا :- شرح طريقة التركيب :-
1-انتقل إلى لوح تحكم مدونتك،إختر "قالب" ،ثم "تحريرHTML "
2- نضغط على "متابعة"
3-ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).
أولا :- " ما هى تقنية jQeury؟ "
تقنية جميلة جدا وسوف تلاحظهما فى الاضافة بعد تركيبها فى مدونتكم او موقعكم
ثانيا :- شرح طريقة التركيب :-
1-انتقل إلى لوح تحكم مدونتك،إختر "قالب" ،ثم "تحريرHTML "
2- نضغط على "متابعة"
3-ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).
تذكير:لا تنسى أن تأخد نسخة إحتياطية لمدونتك تجنبا لحدوث أى أخطاء
نبحث عن الكود التالى :
اضف قبله مباشرة الكود التالى :
ثم ابحث عن هذا الكود :
اضف بعده مباشرة هذا الكود
( هذا لوضعه أسفل كل تدوينة .. وبإمكانك أن تضعه أينما شئت .. المهم ان تعرف الطريقة )
نبحث عن الكود التالى :
</head>
اضف قبله مباشرة الكود التالى :
<style type="text/css"> /* Social share buttons By www.egy-grand.blogspot.com */ ul.social { list-style:none; margin:15px auto;display:inline-block; } ul.social li { display:inline; float:left; background-repeat:no-repeat; } ul.social li a { display:block; width:48px; height:48px; padding-right:10px; position:relative; text-decoration:none; } ul.social li a strong { font-weight:normal; position:absolute; left:20px; top:-1px; color:#fff; padding:3px; z-index:9999; text-shadow:1px 1px 0 rgba(0, 0, 0, 0.75); background-color:rgba(0, 0, 0, 0.7); -moz-border-radius:3px; -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); -webkit-border-radius:3px; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5); border-radius:3px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);} ul.social li.facebook { background-image:url("https://lh5.googleusercontent.com/-0zwhBirk998/T7-wLV5MRLI/AAAAAAAAAkM/5_ZDuKM0ebI/s48/facebook.png"); } ul.social li.twitter { background-image:url("https://lh6.googleusercontent.com/-nZtqbw9RyB0/T7-wN8Er73I/AAAAAAAAAk0/-CQCDPgK3r4/s48/twitter.png"); } ul.social li.googlebuzz { background-image:url("https://lh4.googleusercontent.com/-WdnOP76oVsY/T7-wL4HNXHI/AAAAAAAAAkU/mGjaZTY7j3U/s48/googlebuzz.png"); } ul.social li.stumbleupon { background-image:url("https://lh3.googleusercontent.com/-8D0Yfx6GWns/T7-wMXUWyaI/AAAAAAAAAkw/HMsFcC8_ECY/s48/stumbleupon.png"); } ul.social li.digg { background-image:url("https://lh5.googleusercontent.com/-VHozHP5CYyU/T7-wKh3juHI/AAAAAAAAAkA/m2aqKHYVwvE/s48/digg.png"); } ul.social li.delicious { background-image:url("https://lh6.googleusercontent.com/-JUr6QZGLk4Y/T7-wLNOW1vI/AAAAAAAAAkE/T47V8zmijt4/s48/delicious.png"); } ul.social li.linkedin { background-image:url("https://lh5.googleusercontent.com/-aG0EWXKIeu8/T7-wMOK94LI/AAAAAAAAAkg/fGarq2Ket14/s48/linkedin.png"); } ul.social li.reddit { background-image:url("https://lh4.googleusercontent.com/-nozr-wrxBV4/T7-wMDWQZDI/AAAAAAAAAk4/PbCUbyNen5E/s48/reddit.png"); } ul.social li.technorati { background-image:url("https://lh4.googleusercontent.com/-cHT2Fc4Zhpc/T7-wN2v9X-I/AAAAAAAAAlA/jCvR-oISzxE/s48/technorati.png"); } </style> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $("#jqueryanime li").each(function () { $("a strong", this).css("opacity", "0"); }); $("#jqueryanime li").hover(function () { $(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 0.2); $("a strong", this).stop().animate({ opacity: 1, top: "-10px" }, 300); }, function () { $(this).stop().fadeTo(500, 1).siblings().stop().fadeTo(500, 1); $("a strong", this).stop().animate({ opacity: 0, top: "-1px" }, 300); }); }); /* Social share buttons By www.egy-grand.blogspot.com */ </script>
ثم ابحث عن هذا الكود :
<data:post.body/>
اضف بعده مباشرة هذا الكود
( هذا لوضعه أسفل كل تدوينة .. وبإمكانك أن تضعه أينما شئت .. المهم ان تعرف الطريقة )
<b:if cond='data:blog.pageType == "item"'> <ul class='social' id='jqueryanime'> <li class='facebook'> <a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' title='Share this on Facebook'><strong>Facebook</strong></a> </li> <li class='twitter'> <a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' title='Tweet This!'><strong>Twitter</strong></a> </li> <li class='googlebuzz'> <a expr:href='"http://www.google.com/buzz/post?url=" + data:post.url + "&imageurl="' rel='nofollow' title='Post on Google Buzz'><strong>Google Buzz</strong></a> </li> <li class='stumbleupon'> <a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Stumble upon something good? Share it on StumbleUpon'><strong>StumbleUpon</strong></a> </li> <li class='digg'> <a expr:href='"http://digg.com/submit?phase=2&url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Digg this!'><strong>Digg</strong></a> </li> <li class='delicious'> <a expr:href='"http://delicious.com/post?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on del.icio.us'><strong>Delicious</strong></a> </li> <li class='linkedin'> <a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' title='Share this on LinkedIn'><strong>LinkedIn</strong></a> </li> <li class='reddit'> <a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' title='Share this on Reddit'><strong>Reddit</strong></a> </li> <li class='technorati'> <a expr:href='"http://technorati.com/faves?add=" + data:post.url ' rel='nofollow' title='Share this on Technorati'><strong>Technorati</strong></a> </li> </ul></b:if>ثم نضغط حفظ القالب و شاهد النتيجة اتمنى الأضافة تعجبكوا
درس اليوم هو عبارة عن كيفية اضافة زر أعجبني Like متحرك لصفحتك علي الفيس بوك في موقعك
هذه الطريقة يتم استخدامها حاليا في معظم المواقع و المنتديات و المدونات العربية لانها تجذب انتباه العضو أو الزائر الذي يقوم بتصفح موقعك
هذه الطريقة يتم استخدامها حاليا في معظم المواقع و المنتديات و المدونات العربية لانها تجذب انتباه العضو أو الزائر الذي يقوم بتصفح موقعك
مثال
ملاحظة : الصندوق متحرك مع الصفحة
طريقة اضافة الزر
اولا : اضافة الجي كويري لتتمكن من تحريك الاداة للداخل و الخارج :
1. اذهب للوحة التحكم
2. تخطيط
3. تحرير HTML
4. توسيع عناصر القالب
5.. ثم ابحث عن :
</head>
عندما تجده ضع فوقه مباشرة الكود التالى :
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>
ثانيا : لأضافة الأداة :
1. اذهب الى لوحة التحكم
2. تخطيط
3. اضافة اداة
4. اداة HTML
5 انسخ الكود التالي :
<script src='http://egymodern.googlecode.com/files/facebooklike-box.js' type='text/javascript'></script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIfz1rm1_G4QSdW7tueeMqQGef6pTXE-qjC6UBRSPKIvNOtMuzuVRaC5AQOfY1kdKKcAdjt7ZgIgaMlBIt7tS_ey7p0TjMpQqM5M9-P5XGk31trHoEZrOV725pr5HoKJxXv7eveBezDQs/s1600/facebook-page2.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style>
<div class="w2bslikebox" style="z-index: 9999999999;">
<div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/egygrand&width=245&colorscheme=light&show_faces=true&connections=9&stream=false&header=false&height=270" scrolling="no" frameborder="0" scrolling="no" style="z-index: 9999999999; border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;">
</iframe>
</div>
<script type="text/javascript">
writeHTMLasJS();
</script>
</div>
استبدل الرابط باللون الأحمر برابط صفحتك على الفيس بوك
ثم اضغط حفظ يارب تكون عجبتكوا
ثم اضغط حفظ يارب تكون عجبتكوا














Fashionegy
مستشفى سرطان الأطفال
بنك الطعام المصرى
يونيسف
اسم مدونة المعلن