اضافة شريط المتابعه عبرالمواقع الاجتماعيه بشكل انيق وجذاب

بسم الله الصلاة والسلام على رسول الله , السلام عليكم اخواني اخواتي متابعي مدونة جلال البعداني , كثير من المدونين يعتقدون أن مدونات بلوجر  تفتقر الى الاضافات الجيده والمنسقه بشكل انيق , التي يمكن أن تضاف إلى منصات أخرى مثلووردبريس وجوملا،ولكن هذا الاعتقاد خاطئ.فهناك كثير من الاضافات الاحترافيه التي تمكنك من تخصيص مدونتك وتطويرها لتظهر بشكل جذاب واحترافي,واليوم باذن الله سوف نكسر هذا المعتقد بهذه الاضافه الاحترافيه والتي هي عباره عن شريط جانبي على شكل قائمه عموديه  تتضمن خمس من اشهر مواقع التواصل الاجتماعي  (twitter ,Facebook ,Google+, feedburner, tumblr  )والتي تتميز بشكلها الرائع والانسيابي والذي بدوره يزيد من جمالية المدونه واحترافيتها

 

مثال حي للاضافه

۞ معاينه ◄

كيفية اضافة هذه القطعه الى مدوناتكم

1- انتقل إلى لوحة تحكم مدونتك
2- إختر "تخطيط" ثم إضافة أداة ثم اخترHTML/Javascript
3- والآن الصق داخل المستطيل الكود التالي 

<div id='social-sidebar'>
<ul><li>
<a class='entypo-twitter' href='https://twitter.com/albaadani1' target='_blank'>
<span>Twitter</span>
</a></li><li>
<a class='entypo-gplus' href='https://plus.google.com/u/0/b/115387305017738790650' target='_blank'>
<span>google+</span>
</a></li><li>
<a class='entypo-tumblr' href='http://www.tumblr.net/albaadani' target='_blank'>
<span>tumblr</span>
</a></li><li>
<a class='entypo-facebook' href='http://www.facebook.net/alb33dani' target='_blank'>
<span>facebook</span>
</a></li><li>
<a class='entypo-rss' href='http://feeds.feedburner.com/albaadani' target='_blank'>
<span>feedburner</span>
</a></li></ul></div>
<style type='text/css'>
/*<![CDATA[*/
@charset "utf-8";
/* CSS Document */
/* ---------- ENTYPO ---------- *//* ---------- Digital Hub Inc : /---------- */
@import url(http://weloveiconfonts.com/api/?family=entypo);
[class*="entypo-"]:before {
font-family: 'entypo', sans-serif;
}
/* ---------- GENERAL ---------- */
#social-sidebar a { text-decoration: none; }
#social-sidebar ul {
list-style: none;
margin: 0;
padding: 0;
}
/* ---------- Social Sidebar ---------- */
#social-sidebar {
left: 0;
margin-top: -75px; /* (li * a:width) / -2 */
position: fixed;
top: 50%;
}
#social-sidebar ul li:first-child a { border-radius: 0 5px 0 0; }
#social-sidebar ul li:last-child a { border-radius: 0 0 5px 0; }
#social-sidebar ul li a {
background: #121212;
color: #fff;
display: block;
height: 50px;
font-size: 18px;
line-height: 50px;
position: relative;
text-align: center;
width: 50px;
}
#social-sidebar ul li a:hover span {
left: 130%;
opacity: 1;
}
#social-sidebar ul li a span {
border-radius: 3px;
line-height: 24px;
left: -100%;
margin-top: -16px;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
padding: 4px 8px;
position: absolute;
-webkit-transition: opacity .3s, left .4s;
-moz-transition: opacity .3s, left .4s;
-ms-transition: opacity .3s, left .4s;
-o-transition: opacity .3s, left .4s;
transition: opacity .3s, left .4s;
top: 50%;
z-index: -1;
}
#social-sidebar ul li a span:before {
content: "";
display: block;
height: 8px;
left: -4px;
margin-top: -4px;
position: absolute;
top: 50%;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
width: 8px;
z-index: -2;
}
#social-sidebar ul li a[class*="twitter"]:hover,
#social-sidebar ul li a[class*="twitter"] span,
#social-sidebar ul li a[class*="twitter"] span:before { background: #6CDFEA; }
#social-sidebar ul li a[class*="gplus"]:hover,
#social-sidebar ul li a[class*="gplus"] span,
#social-sidebar ul li a[class*="gplus"] span:before { background: #E34429; }
#social-sidebar ul li a[class*="tumblr"]:hover,
#social-sidebar ul li a[class*="tumblr"] span,
#social-sidebar ul li a[class*="tumblr"] span:before { background: #1769ff; }
#social-sidebar ul li a[class*="facebook"]:hover,
#social-sidebar ul li a[class*="facebook"] span,
#social-sidebar ul li a[class*="facebook"] span:before { background: #234999; }
#social-sidebar ul li a[class*="rss"]:hover,
#social-sidebar ul li a[class*="rss"] span,
#social-sidebar ul li a[class*="rss"] span:before { background: #f57b05; }
/*]]>*/
</style>

تخصيص الاضافه

   1- استبدال ماباللونalbaadani باسم حسابك في فيدبرنر
 2- استبدال ماباللونalbaadani1 باسم حسابك في تويتر
 3- استبدال ماباللونalb33dani باسم صفحتك في فيس بوك
 4- استبدال ماباللون115387305017738790650 باسم حسابك جوجل بلس
 5- استبدال ماباللونalbaadani باسم حسابك في تمبلر
وبالاخير قم بحفظ القطعه ومبروك عليك الاضافه ولا تنسى ان تشاركنا ارائك بتعليق

النسخه الاكثر احترافيه من قالب يوسف ويب (الاصدار السابع)

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

مميزات القالب

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

وهناك المزيد حقا سيعجبك القالب

معاينة وتنزيل القالب

۞ معاينة القالب ◄ ۞ تحميل القالب ▼

تخصيص القالب

• الشعار

لتغير لوجو المدونه قم بالبحث عن :

http://im32.gulfup.com/EK2xx.png

واستبدله برابط شعار مدونتك

يمكنك تحميل شعار البعداني ويب psd مفتوح المصدر للتعديل عليه حسب رغبتك

۞ تحميل ▼

• تخصيص السلايد شو

لظهور السلايدرشو ابحث عن كلمة

  

نصائح

واستبدلها باسم قسم من اقسام مدونتك ليظهر بالسلايد شو

• ضبط وتعديل أقسام وروابط القائمة العلوية

 قم بالبحث عن 

<div class='menu'> 

ستجد اسف الكود الذي بحثت عنه هذه الاكواد

1 2 3 4 5 6

<div class='menu'><ul> <li><a href='http://ckimo.blogspot.com/'>الرئيسية</a><p>صفحة البداية</p></li> <li><a href='http://ckimo.blogspot.com/'>مدونتي</a><p>مايدور بذهني</p></li> <li><a href='http://ckimo.blogspot.com/'>من أنا</a><p>السيرة الذاتية</p></li> <li><a href='http://ckimo.blogspot.com/'> إشتراك Rss</a><p>صفحة البداية</p></li> </ul>

قم بتغيير التسميات  حسب رغبتك عادتآ تكون (الصفحات & الاقسام)

وقم بتغيير الروابط المبينه باللونhttp://ckimo.blogspot.com/  بروابط اقسام او صفحات مدونتك 

تخصيص اسم وصورة كاتب الموضوع وتاريخ النشر

 قم بالبحث عن الكود التالي

<div class='postauthor'>

ستجد اسف الكود الذي بحثت عنه هذه الاكواد

1 2 3 4 5

<div class='postauthor'> <img alt='' height='97' src='http://im36.gulfup.com/ZcTvu.jpg' width='97'/> <span style="font-size: small;"><h3><a href='http://alb33dani.blogspot.com/'>جلال البعداني</a></h3></span> </div>

استبدل كلمة جلال البعداني   باسمك  

واستبدلhttp://im36.gulfup.com/ZcTvu.jpgبرابط صورتك

*ولضبط تاريخ التدوينه فيتم اضافتها من لوحة التحكم > تخطيط  قم بعمل تحرير لاداة رسائل المدونه الالكترونيه وقم باضافة علامة الصح كما في الصوره

تخصيص اضافة كاتب الموضوع اسفل التدوينه

قم بالبحث عن الكود التالي

<div class='postauthor2'>

وستجد الكود بهذه الطريقه

1 2 3 4 5 6 7 8 9 10

<div class='postauthor2'> <div class='postauthor2-right'> <img alt='' height='97' src='http://im39.gulfup.com/QZfvR.jpg' width='97'/> <h3><a href='رابط صفحتك على الفيس بوك'>اكتب هنا اسمك</a> </h3></div><p> اكتب هنا وصف او نبذه مختصره عن كاتب الموضوع@@@@@@@@@@@@@@@@@@@ @@@@ح <a href='#' target='_blank'>الفيسبوك</a>. <a href='#' target='_blank'>جوجل بلس</a></p> </div>

قم بالتعديل على المسميات والروابط حسب رغبتك
 وبالاخير قم بحفظ القالب ومبروووك عليك القالب الاحترافي

اتمنى ان ينال القالب اعجابكم واذا واجهتكم اي مشكله اترك تعليق وسيتم الردعليه ان شاء الله

حصريا القالب التقني"ليوماجازين" مطور بخمس الوان احترافيه لمدونات بلوجر(تحديث)

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

معاينة وتنزيل القالب بخمس الوان مدمجه بقالب واحد

۞ معاينة القالب ◄ ۞ تحميل القالب ▼

تحميل القالب بخمس الوان كل قالب على حده

1-القالب الازرق

     ۞ تحميل القالب ▼

2-القالب الاحمر

     ۞ تحميل القالب ▼

3-القالب البنفسجي

     ۞ تحميل القالب ▼

4-القالب الاخضر

     ۞ تحميل القالب ▼

5-القالب البرتقالي

     ۞ تحميل القالب ▼

تخصيص المحتوى للقالب

القالب يحتوي على كتير من ألسليدرات كلها متشابهة وتعتمد هذه السلايدرات على عرض مواضيع قسم معين من اقسام المدونه ,  ولكن  يجب ان يتوافر لديك رابط مهم جدا لتشغيل جميع السلايدرات التي في القالب وسوف يكون الرابط كالتالي  :

http://رابط مدونتك/feeds/posts/default/-/اسم القسم?published&alt=json-in-script&callback=labelthumbs

عوض ما باللون الاحمر  برابط المدونة و اسم القسم المراد عرض مواضيعه

مثال

http://www.alb33dani.com/feeds/posts/default/-/اضافات بلوجر?published&alt=json-in-script&callback=labelthumbs

ولنفترض ان لديك 4 اقسام في المدونه وتريد عرضها في القالب في جميع السلايدرات الموجوده , فبهذه الحاله سوف تكرر العمليه السابقه اربع مرات بعدد اقسام المدونه ولكن مع مراعاة تغيير اسم القسم داخل الرابط 

فمثلا انا لدي 4 اقسام هي   اضافات بلوجر , قوالب بلوجر ,دروس بلوجر ,تقنيه

سوف اقوم باضافته للرابط السابق كالتالي

http://www.alb33dani.com/feeds/posts/default/-/اضافات بلوجر?published&alt=json-in-script&callback=labelthumbs 

http://www.alb33dani.com/feeds/posts/default/-/قوالب بلوجر?published&alt=json-in-script&callback=labelthumbs

http://www.alb33dani.com/feeds/posts/default/-/دروس بلوجر?published&alt=json-in-script&callback=labelthumbs

http://www.alb33dani.com/feeds/posts/default/-/تقنيه?published&alt=json-in-script&callback=labelthumbs

الان  بعد ان قمنا بعمل روابط لاقسام المدونه يجب ان نجعل الروابط الذي قمنا بالتعديل عليها مختصره عن طريق الموقع التالي

http://goo.gl/

 قم بادخال الربط داخ المستطيل واضغط على SHORT URL لتحصل الى الرابط المحتصر


الان بعد ما حصلنا على 4 روابط مختصره سوف نحتفظ بها لاننا سنحتاجها فيما بعد

• نقوم اولا بتخصيص السلايدر شو الاساسي 

  
  قم بالبحث عن الرابط التالي

  http://goo.gl/hZfeln

 ستجد هذا الرابط مكرر مرتين في القالب  قم باستبدال الرابطين  بالرابط المختصر للقسم الاول  الذي انشأته مسبقا  واحتفظت به

ثانيا تخصيص اداة احدث التدوينات 

قم بالبحث عن الرابط التالي

http://goo.gl/tm6lDZ

 

 واستبدله بالرابط المختصر للقسم الثاني الذي اضفته مسبقا

  تخصيص السلايدر الافقي اسفل اداه احدث التدوينات

قم بالبحث عن الرابط التالي

http://goo.gl/8PM3pP

 

 واستبدله بالرابط المختصر للقسم الثالث الذي اضفته مسبقا

  تخصيص قائمة المواضيع اسفل السلايد الافقي

قم بالبحث عن الرابط التالي

http://goo.gl/bhbgON

 

 ستجد هذا الرابط مكرر مرتين في القالب  قم باستبدال الرابطين بالرابط المختصر للقسم الرابع  الذي انشأته مسبقا  واحتفظت به

  تخصيص قائمة عرض المواضيع حسب التسميات اسفل القالب

هذا المستطيل يعتمد على عرض المواضيع حسب التسميات ( الاقسام ) لذا كل ماعليك هو اولا وضع اسم للقسم الذي تحب ان تعرض مواضيع داخل هذا المستطي وايضا الرابط المختصر للقسم (الذي انشئناه مسبقا في اول الشرح)

اولا نقوم بتغيير عناوين التسيمات التي في القائمه الافقيه اعلى المستطيل  ولتغييرها نبحث عن الكود التالي

<ul class='maintabNav'>

ستجد الكود بهذا الشكل

1 2 3 4 5 6 7

<ul class='maintabNav'>      <li class='firstTab active' style=''>     <a href='#maintabs-1' title='اسم القسم 1'><span class=''>اسم القسم 1</span></a></li> <li><a href='#maintabs-2' title='اسم القسم 2'><span class=''>اسم القسم 2</span></a></li> <li><a href='#maintabs-3' title='اسم القسم 3'><span class=''>اسم القسم 3</span></a></li> <li><a href='#maintabs-4' title='اسم القسم 4'><span class=''>اسم القسم 4</span></a></li> </ul>

قم بكتابة اسماء التسميات(الاقسام) الخاصه بك داخ الكود السابق  كما هو موضح كل قسم ستكتب اسمه مرتين

الان ننتقل  الى كيفية اضافة روابط هذه الاقسام

قم بالبحث عن الكلمات التالي 

الرابط المختصر للقسم 1

الرابط المختصر للقسم 2

الرابط المختصر للقسم 3

الرابط المختصر للقسم 4

واستبدل كل جمله  بالرابط  المختصر   للقسم الذي تريد عرضه  >ويجب ان يكون ترتيبها حسب ترتيبك لاسماء مواضيع التسميات  التي اضفتها في الكود السابق

الان قم بحفظ القالب واستمتع بالقالب الاحترافي الجديد في مدونتك

اتمنى ان اكون قد وفقت لتوصيل المعلومه وفي حاله حصول اي مشكله عند التركيب قم بوضع تعليق

تحديثات وإصلاحات

23/11/2013

• إعادة تنسيق صفحات التدوينات وضبط البادينج لكي يتم عرض التدوينه بشكل منسق.
• اعادة رفع ملفا الاستايل css لاستضافة Google Drive.
• إعادة تنسيق واصلاح اضافة مواضيع ذات صله.
• إعادة رفع جميع القوالب الى استضافة box.com .

القارئ محمود خليل الحصري mp3

 
القارئ محمود خليل الحصري استمع للقرآن بصوت محمود خليل الحصري تلاوات قرآنية بصوت محمود خليل الحصري جودة عالية mp3

برنامج الكودك K-Lite Mega Codec Pack 10.1.5

افضل كوداك على الاطلاق K-Lite Mega Codec Pack 10.1.5 لتشغيل جميع صيغ الميديا في اصداره الاخير








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


K-Lite Mega Codec Pack is a collection of codecs, DirectShow filters and tools. Codecs and DirectShow filters are needed for encoding and decoding (playing) audio and video formats. The K-Lite Mega Codec Pack is designed as a user-friendly solution for playing all your movie files. With the K-Lite Mega Codec Pack you should be able to play all the popular audio and video formats and even some rare formats. K-Lite Mega Codec Pack always very up-to-date with the newest (and/or best) versions of the components. The installation is fully customizable, meaning that you are able install exactly those components that you really want. Uninstallation removes all files and registry entries created by the pack. It is extremely easy to make a fully customized unattended installation. It tries to avoid potential problems with existing codecs and even fixes some problems. The pack is able to detect broken codecs and filters on your system, and remove them for you.


تاريخ الاصدار
15.11.2013





30 ميجا









http://adf.ly/5713330/5

اضافة افضل ثلاثة خطوط في الويب لمدونات بلوجر باحترافيه

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

كيفية اضافة هذا الخط الى مدوناتكم

1- من  لوحة التحكم -> قالب -> تحرير HTML

2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 

3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)

</head>

  

وقم بلصق كود الخط الذي تريده قبله تماما 

 

الخط الاول GESSTwoLight

كود الخط الاول

<link href='https://dl.dropboxusercontent.com/s/a2i96u2mu00z22n/GESSTwoLight.css' rel='stylesheet' type='text/css'/>

الخط الثاني GESSTwoMediumRegular

كود الخط الثاني

<link href='https://dl.dropboxusercontent.com/s/ga9ipblygtdebw8/GESSTwoMediumRegular.css' rel='stylesheet' type='text/css'/>

الخط الثالث DroidKufi-Bold

كود الخط الثالث

<link href='https://dl.dropboxusercontent.com/s/0saazd998wx8vpn/DroidKufi-Bold.css' rel='stylesheet' type='text/css'/>

الآن بعد ان اضفت كود الخط الذي اخترته  الى القالب تبقى لك خطوه اخيره لكي يظهر هذا الخط في مدونتك  , كل ماعليك الان  هو تغير اسم الخطوط في القالب , وخصوصا الأوسمة المهمه مثل الـ h2 , h3 , h1 , باسم الخط الذي اخترته ولتغيير اسم الخطوط في مدونتك قم بعمل الاتي:

قم بالبحث داخل القالب عن الكود التالي    

Font-family:

 

Font-family:Arial, Tahoma,vardana;       ستجده غالبا بهذا الشكل 

  font-family: كل ماعليك الان هو  استبدال اسم الخط الذي يلي كود الــــ

باسم الخط المطلوب الذي  سبق واضفته لمدونتك 

         GESSTwoLight   وفي مايلي مثال لاضافة الخط الاول المسمى بـ

قبل

Font-family:Arial, Tahoma,vardana;

بعد

Font-family:GESSTwoLight, Tahoma, vardana;

لاحظ هنا اننا قمنا باستبدال اسم الخط Arial   باسم الخط الجديد الذي اضفناه الى المدونه وهو  GESSTwoLight

الان قم بتكرار العمليه على باقي اكواد font-family 

واذا اردت تغيير خط المدونه بالكامل فقم بالبحث عن الكود التالي

body{

واضف الكود التالي بعده مباشره

Font-family:GESSTwoLight, Tahoma, vardana;

وبالاخير قم بحفظ القالب ومعاينة المدونه ومبروك عليك اشهر ثلاثه خطوط في الويب

اذا واجهتك اي مشكله في اضافة الخط الى مدونتك قم بكتابة تعليق وسيتم الرد عليك ان شاء الله

 مصدر   البعداني