يونيو 2013
 السلام عليكم و رحمة الله و بركاته

الاضافة هذه اكثر من رائعة فهة تمكن الزائر من البقاء على اطلاع بروابط مدونتك على الشبكات الاجتماعية فى اى مكان فى المدونة فهى تتواجد فى مكان فى الصفحة ولعلنا شاهد انتشارا لها فى الاَونة الاخيرة ولكن هذه الاضافة من وجهة نظرى هى الاكثرهم جمالا و فعالية .


معاينة الاضافة


demo 

تركيب الاضافة 


1. ادخل الى لوحة التحكم ثم اختر layout او تخطيط


blog-post-option

2. اضغط على html/javascript
3. الصق الكود التالى

position:relative;
z-index:5;
display:block;
float:none;
margin:5px 0 0;
width:210px;
height:38px;
border-radius:5px; background:url(http://1.bp.blogspot.com/-JKq0eFFwx34/UGx39fhHO_I/AAAAAAAABE4/56i9phAS2do/s1600/NBT+Sprites+Social+Icons.png) no-repeat;
background-color:rgba(217,30,118,.42);
-webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
-moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
box-shadow:rgba(0,0,0,.28) 0 2px 3px;
color:#141414;
text-align:left;
text-indent:50px;
text-shadow:#333 0 1px 0;
white-space:nowrap;
line-height:32px;
-webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-moz-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-ms-transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-transition:width .25s ease-in-out,background-color .25s ease-in-out;
transition:width .25s ease-in-out,background-color .25s ease-in-out;
-o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;
}
#bloggertrix-SexySocialButtons li:after{
position:absolute;
top:0;
left:50px;
z-index:2;
display:block;
height:38px; color:#ffffff;
content:attr(data-alt);
line-height:32px;
}
#bloggertrix-SexySocialButtons .icon{
overflow:hidden;
color:#fafafa;
}
#bloggertrix-SexySocialButtons .facebook{
width:32px;
height:32px;
background-color:rgba(59,89,152,0.42);
background-position:0 0;
}
#bloggertrix-SexySocialButtons .twitter{
width:32px;
height:32px;
background-color:rgba(64,153,255,0.42);
background-position:0 -33px;
}
#bloggertrix-SexySocialButtons .googleplus{
width:32px;
height:32px;
background-color:rgba(228,69,36,0.42);
background-position:-3px -66px;
}
#bloggertrix-SexySocialButtons .YouTube{
width:32px;
height:32px;
background-color:rgba(174,45,39,0.42);
background-position:-2px -95px;
}
#bloggertrix-SexySocialButtons .rss{
width:32px;
height:32px;
background-color:rgba(255,102,0,0.42);
background-position:-3px -126px;
}
#bloggertrix-SexySocialButtons li:hover .icon,
.touch #bloggertrix-SexySocialButtons li .icon{
width:210px;
}
.touch #bloggertrix-SexySocialButtons li .facebook, #bloggertrix-SexySocialButtons li:hover .facebook{
background-color:rgba(59,89,152,1);
}
.touch #bloggertrix-SexySocialButtons li .twitter, #bloggertrix-SexySocialButtons li:hover .twitter{
background-color:rgba(64,153,255,1);
}
.touch #bloggertrix-SexySocialButtons li .googleplus, #bloggertrix-SexySocialButtons li:hover .googleplus{
background-color:rgba(228,69,36,1);
}
.touch #bloggertrix-SexySocialButtons li .YouTube, #bloggertrix-SexySocialButtons li:hover .YouTube{
background-color:rgba(174,45,39,1);
}
.touch #bloggertrix-SexySocialButtons li .rss, #bloggertrix-SexySocialButtons li:hover .rss{
background-color:rgba(255,102,0,1);
}

  • استبدل bloggertrix باسم المستخدم على الفيس بوك
  • استبدل bloggertrix باسم المستخدم على تويتر
  • استبدل 107955298793879607964 بال id الخاص بك على جوجل بلس
  • استبدل Username باسم المستخدم على اليوتيوب
  • استبدل bloggertrix بال id الخاص بك على feedburner
5. اضغط حفظ . ومبروك عليك الاضافة    


 السلام عليكم و رحمة الله و بركاته

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

Css3+Peel+Image+Effect

تركيب الاضافة 


1. ادخل الى لوحة تحكم بلوجر ثم اختار layout او تخطيط


blog-post-option



2. اختر اداة html/javascript
3. الصق الكود التالى

4. اضغط حفظ وبكده نكون انتهينا

ملحوظة : استبدل روابط الصور فى الكود بروابط الصور الخاصة بك

box email subscribe
عندما تكون تتصفح مدونات عربية أو أجنبية  فإنك تلاحظ أن أغلب هاته المدونات تتوفر على صندوق اشتراك يحتوي  على أيقونة الفايسبوك وتويتر و اليوتوب والإشتراك بالبريد الإلكتروني و رابط التغذية Rss إلخ…. يمكنني القول أن هذا الصندوق ذو أهمية بالغة كونه يساعد في الحفاظ على الزوار فمثلا عند الإشتراك بالبريد الإلكتروني فإن الزائر سيبقى على اطلاع بآخر المواضيع و المستجدات

و كذلك هو الحال بالنسبة  لصفحة الفايسبوك و تويتر و قناة اليوتوب و رابط التغذية RSS. لذلك تطرقت في هذه التدوينة إلى شرح طريقة إضافة هذا الصندوق إلى المدونة و بتأثير جميل مستعينا بتقنية CSS.
تتبع هذه الخطوات لإضافة الصندوق :
  • توجه للوحة التحكم =>اختر تصميم => تحرير HTML
  • قم  بتوسيع القالب
  • وأبحث عن الكود التالي :
]]>
  • قم بإضافة هذا الكود فوق ]]>> مباشرة.
----------------------Social Newsletter Widget  -----------------------------
/* Social &Newsletter Widget *//* Social */.social {
background:#fcfcfc;
height:80px;
padding:0 15px;
border-bottom:1px solid #f0f0f0;
}
.social li {
float:right;
width:52px;
margin-left:15px;
text-align:center;
}
.social li.last {
margin-right:0;
}
.social li a {
opacity:0.6;
filter:alpha(opacity=60);
font-size:11px;
color:#666;
padding-top:42px;
line-height:34px;
}
.social li a:hover {
opacity:1.0;
filter:alpha(opacity=100);
color:#666;
text-decoration:none;
}
.social .social-feed {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnvDuL1gmK8eDDZntoaYhL7FdRdOGgvrsHerO7an-sk8OVIPujiOE5f7MkaU2HKZMi4gCZ2yeIvsQ072oiNozKLwXJsdUSdmvBYiniRbP6D9bm7tErTg-c70PvOtSsoZofOIXo02qNgII/s1600/ico-social-rss.png) no-repeat;
}
.social .social-twitter {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNdJ6yWkwKxG6i2V49fWjsFrY-t_rq6hlhVncd5iBgA0cOXTZhvS6x_ydk7h0JcEFTXeBkLliPQN3SaWJzPjLXDRPd81uUz91WlWjK5DWFFyoSIfdtPSo0ShsezqmZAyMU47q9HO6KSfU/s1600/ico-social-twitter.png) no-repeat;
}
.social .social-facebook {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdwKiQbECLqx3o3VZhjQ5xRHz-LTMQxbFOUOMzlbHupcs1U8z27na01fto8bpmPCYnQ5Y1kdOuNov65dT5qpfSPnFRUduhcxO_leV0XsVF5cJnmgjuObR9w4WLlmFUgELjX_sOWDKOpA8/s1600/ico-social-facebook.png) no-repeat;
}
.social .social-youtube {
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgH-244OK-UcoL4uv1FYh3Ozn9xvXcRRYAcLRr_H-rifux7k3Im0pBBPz_JgLSXCLjYB6RWT2VBnAZYxZ_eS2a1yYHahWNasN4s30rp2oYNQwZP2HoWhHpxFN7gpVjJKItcJVtCKBocdsw/s1600/ico-social-youtube.png) no-repeat;
margin-right:0;
}
form.emailform {
margin:20px 0 0;
display:block;
clear:both;
}
.emailtext {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5xOsYp5WNj7O_whvrUqOOqzstE35l1rO9OYxy_b7M5qGt7rCaa6s0eAZKV-d843QA2gHF7UsSWpuzA8MXODqgN1zsmtBkTjZSw6GkricMo-xSkGwdxcIXOSgpVkdYjkN9-l1MhI-g22d_/s28/w2b-mail.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 33px;
color:#444;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
-moz-box-shadow:1px 1px 2px #CCC inset;
-webkit-box-shadow:1px 1px 2px #CCC inset;
box-shadow:1px 1px 2px #CCC inset;
}
.ebutton {
color:#444;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor:pointer;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-goog-ms-border-radius:4px;
border-radius:4px;
background:#fbfbfb;
background:-moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #fbfbfb), color-stop(100%, #f4f4f4));
background:-webkit-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-o-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background:-ms-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4', GradientType=0 );
background:linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
}

  • الأن قم بحفظ القالب وتوجه بعدها إلى تصميم أو تخطيط.
  • ثم إضافة أداة HTML/JavaScript .
  • قم بنسخ ثم لصق هذا الكود داخل الأداة :


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_eIvdQ0Yqitg_gVfTfKE3qETHAMrBwtAJUkr95bYlsriDTWgLA9E5Nh8LDP_pwAJvciq1NlR4EkkehARRe6mOmEqlwLH6-g3-Qa7AyHaEyf2w0g47gyxN7qeGgKIpOQc0pXv3lMe6qOU/s1600/email-px-png.png" />

توصل بكل المواضيع الجديدة ،كن السبّاق وقم بإدخال بريدك الإلكتروني و إنتظر الجديد


http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" class="emailform" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=xxxxx', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">









http://Pro-fess-ional.blogspot.com/ target="_blank" title="Blogger Widget">Blogger Widget »



التعديل على الكود :
  1. Facebook Page ==> رابط صفختك على الفايسبوك
  2. Twitter ==> رابط التويتر الخاص بك 
  3. Feedburner Url ==> رابط التغذية Rss الخاص بمدونتك
  4. Youtube Chaine ==> رابط قناتك على اليوتوب
  5. Uri=xxxxx ==> اسم المستخدم الخاص برابط التغذية
  6. http://Pro-fess-ional.blogspot.com/ ==> غير هذا الرابط برابط مدونتك
و بهذا نكون قد ركبنا هذا الصندوق في المدونة و بالتوفيق للجميع

المصدر: http://www.mohamedblog.com/2012/07/css.html#ixzz2WtHbWW8y


مع الاستخدام اليومي لهاتفك الذي يعمل بمنصة الاندرويد للترفيه و الاستفادة و أيضا للتواصل و التفاعل و الكثير تتناقص سرعة هاتفك في معالجة الاوامر المختلفة فتصبح التطبيقات بطيئة في تنفيد مهامها و يأخد منك فتحها أكثر من المدة الطبيعية حينها ستشكوا حثما من بطئ جهازك و قد يدفعك ذلك لصرف أموال أخرى للحصول على هاتف جديد أو لاصلاح الجهاز الحالي بالرغم من أن هناك حلا مجانيا و سهلا و لا يحتاج منك تنفيده اكثر من 5 دقائق

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

1  -      امسح الكاش   Cache  الخاص بالتطبيقات :

clear-cache-settings

كل تطبيق مثبث على جهازك و تقوم باستخدامه يترك بعض المعلومات على جهازك و التي تدعى الكاش Cache حيث لا تظهر لك أنت كمستخدم بين الملفات لكنها مخزنة في جهازك و تستهلك جزء كبير من موارده ما يؤدي الى بطئ في فتح التطبيقات خاصة تلك التي لها كاش كبير و بالرغم من أنه يمكن مسح الكاش لأي تطبيق ضمن صفحة property الا أن عمل ذلك لكل تطبيق على حدا سيؤدي الى ضياع الكثير من وقتك و لن تتحقق رؤيتنا للسرعة التي نود الحصول عليها.
و لذلك وفر العديد من المطورين الكثير من التطبيقات التي تقوم بمسح الكاش لكل التطبيقات بزر واحد و بشكل احترافي و دون مخاطر و أشهر هذه التطبيقات نجد App Cache Cleaner حيث يوفر لك تحديد كل التطبيقات أو بعض منها لمسح الكاش الخاص بها كما يتيح لك ضبط الوقت لمسح الكاش لكل التطبيقات أو لبعضها اوتوماتيكيا .

2-      احدف أو الغي تثبيت التطبيقات التي لا تستعملها و لا تهمك :
الكثير منا يجرب تطبيقات جديدة واحدا تلو الأخر و يجد تطبيقا رائعا يدمن فيما بعد على استخدامه أما البقية فلا يكثرت لها و مع مرور الوقت على هذا النهج يصبح الجهاز ممثلئا بالكثير من التطبيقات التي لا تعد ضرورية و لا يتم استخدامها بل و نجد الكثير منها يؤدي نفس الدور ما ينتج عنه بطء الجهاز و التعامل مع التطبيقات
الحل الذي يجب عليك القيام به في هذه الحالة هو حدف و الغاء تثبيث التطبيقات التي لا تستخدمها أو لا تهمك و سترى تحسنا كبيرا في سرعة جهازك حثما.

3-      تثبيت تطبيق جديد للواجهة الخاصة بجهازك :

complete-action-homescreen

قد تقول بأن واجهة الهاتف الذكي ليس لديها أي علاقة بهذا الأمر ؟ للأسف الواجهة الرئيسية , شاشة التطبيقات … ليست مرتبطة بتنظيم العناصر في قالب جميل فقط بل أيضا لها دور في تسريع عملياتك على جهازك .
بعض الواجهات بطيئة منها الواجهات الافتراضية للأجهزة . لكن المطورين يعملون على واجهاتهم الخاصة بهم و التي تأتي تحث مسميات مختلفة بمميزات جديدة و منها سرعة التعامل مع التطبيقات و فتحها و الولوج الى القوائم المختلفة …
و بما أننا وجدنا الكثير منها في متجر قوقل اخترنا لكم منها Lightning Launcher المتوفرة مجانا بقوقل بلاي للتحميل و من مميزاتها الجمالية و الوضوح و لا ننسى بالطبع السرعة و السلاسة .

4-      احدف الاضافات و الاختصارات التي لا تعد ضرورية
remove-widget

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

5-      تقييد أو تعطيل بيانات الخلفية
جيميل, الفايسبوك , تويتر و تطبيقات أخرى كلها تستقبل بيانات من الانترنيت بشكل منتظم و على مدد محددة كل هذه العمليات تستهلك طاقة بطارية جهازك و ليس هذا فقط بل أيضا تستهلك موارد جهازك و منصة الاندرويد و لهذا نلاحظ بطء الجهاز باستمرار
المطلوب منا تقييد أو تعطيل البيانات الخلفية و التي يدخل ضمنها استقبال بيانات و ارسالها من و الى الانترنيت في خلفية جهازك دون الشعور بذلك
و لتعطيل بيانات الخلفية لجميع التطبيقات :
- من اعدادات اضغط على Data usage
- توجه الى context menu بالضغط على النقاط الثلاثة الموجودة في الاطار الاخضر بالصورة التالية :

data-usage

- قم بتعطيل Autosync data و اضغط على Ok بعد خروج رسالة التحدير
و يمكنك أيضا تعطيل بيانات الخلفية لكل تطبيق على حدا فمثلا اذا اردت تعطيل بيانات الخلفية لتطبيق الفايسبوك فسيكون ذلك بالذهاب الى اعداداته و ايجاد خيار عدم تحديث المنشورات اتوماتيكيا و تعيين التحديث اليدوي.
و مع قيامك بهذه الخطوة ستلاحظ زيادة سرعة جهازك أكثر


المصدر :  http://techarabi.com/%D8%B7%D8%B1%D9%82-%D9%81%D8%B9%D8%A7%D9%84%D8%A9-%D9%84%D8%AA%D8%B3%D8%B1%D9%8A%D8%B9-%D9%87%D8%A7%D8%AA%D9%81%D9%83-%D8%A7%D9%84%D8%A7%D9%86%D8%AF%D8%B1%D9%88%D9%8A%D8%AF/

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

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

Custom Blogger Contact Form 

تركيب الاضافة


1. اذهب الى بلوجر > صفحات
2. اختار " صفحة فارغة "
3. قم بتسمية الصفحة و ليكن " اتصل بنا "
4. اختار html code ثم الصق الكود التالى 




































5. احفظ ثم قم بنشر الصفحة

تخصيص الكود 


1. اذهب الى بلوجر > قالب
2. اعمل باك اب للقالب
3. اختار "edit html"
4. ابحث عن و الصق الكود التالى قبلها



     
   
   
  • لتغيير الاوان قم بالتعديل على وسم  .MBT-button-color 
5. احفظ القالب و بكده نكون انتهينا
اتى اليكم اليوم باضافة اكثر من رائعة فكلنا نعلم ان الشبكات الجتماعية اصبح لها تأثير كبير م}خرا فى شهرة المدونات  و المواقع فكل المواقع تحاول وضع الكثير من الاضافات الاجتماعية التى تضمن لها اكبر عدد من المتابعين . ويعتبر تويتر من اهم المواقع الاجتماعية ان لم يكن اهمها لذا اقدم لكم اضافة صنوق لاخر تويتات بلوجر بتقنية css وبشكل رائع ..... بدون اطالة

صورة الاضافة


معاينة الاضافة


demo


طريقة التركيب


1. قم بالدخول الى حسابك فى بلوجر
2. قم بتوليد الكود من النموذج الموجود فى الاسفل
3. قم بادخال معلومات الاضافة فى النموذج
4. اضغط generate 
5. مبروك عليك الاضافة