‏إظهار الرسائل ذات التسميات دروس بلوجر. إظهار كافة الرسائل
‏إظهار الرسائل ذات التسميات دروس بلوجر. إظهار كافة الرسائل

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

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

كيفية اضافة شريط احدث الاخبار الى مدوناتكم

1- من  لوحة التحكم -> قالب -> تحرير HTML
2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)


وقبله تماما قم بلصق احد اكواد الالوان التاليه حسب رغبتك



كوداللون الازرق
شريط متحرك يقوم بعرض اخ اخبار المدونه





كوداللون الاحمر





كوداللون الاخضر





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


ونلصق الكود التالي قبله تماما / فوقه



أحدث الأخبار
Loading...






الان قم باستبدل الرابط التالي http://alb33dani.com برابط مدونتك 
ستجد الرابط في السطر التاسع من الكود السابق باللون الازرق

وبالاخير قم بحفظ القالب والف مبروووك عليك الاضافه
11/21/2013 05:12:00 م
اقرأ المزيد
مرسلة بواسطة في 11/21/2013 05:12:00 م 0 التعليقات

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

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



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

1- من  لوحة التحكم -> قالب -> تحرير HTML
2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
  
وقم بلصق كود الخط الذي تريده قبله تماما 

 

الخط الاول GESSTwoLight

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






الخط الثاني GESSTwoMediumRegular

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







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


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




الآن بعد ان اضفت كود الخط الذي اخترته  الى القالب تبقى لك خطوه اخيره لكي يظهر هذا الخط في مدونتك  , كل ماعليك الان  هو تغير اسم الخطوط في القالب , وخصوصا الأوسمة المهمه مثل الـ 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;

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

اذا واجهتك اي مشكله في اضافة الخط الى مدونتك قم بكتابة تعليق وسيتم الرد عليك ان شاء الله
8/20/2013 06:50:00 م
اقرأ المزيد
مرسلة بواسطة في 8/20/2013 06:50:00 م 0 التعليقات

افضل موقع لقياس سرعة مدونتك والعمل على تحسينها

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



وللقيام بتحليل موقعك، كل ما عليك هو الذهاب لرابط خدمة GTmetrix، 

ومن ثم كتابة عنوان موقعك في خانة الروابط، وبعد ذلك نقوم بالنقر على زر Go كما في الصوره


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



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

النتيجه النهائيه





وبالاخير اذا قمت بتحليل مدونتك يرجى كتابة تعليق بالناتج الذي حصلت عليه

8/19/2013 01:02:00 م
اقرأ المزيد
مرسلة بواسطة في 8/19/2013 01:02:00 م 0 التعليقات

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

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

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

الشكل الاول

اضافة مواضيع ذات صله مصحوبه بصور الموضوع على شكل قائمه افقيه متحركه

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

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

     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
 
 ** والصق الكود التالي قبله تمامآ (فوقه)






وبالاخير قم بحفظ القالب والمعاينه ومبروك عليك الاضافه


الشكل الثاني

اضافة مواضيع ذات صله  بشكل نصي

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

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

     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
 
 ** والصق الكود التالي بعده قبله تماما (فوقه)



ثم قم بالبحث عن 
** والصق الكود التالي بعده  مباشره (تحته)





 max-results=4   لتحديد عدد المواضيع ذات الصلة المراد عرضها بالأداة

وبالاخير قم بحفظ القالب والمعاينه ومبروك عليك الاضافه
8/08/2013 03:27:00 ص
اقرأ المزيد
مرسلة بواسطة في 8/08/2013 03:27:00 ص 0 التعليقات

إضافة تعريف كاتب الموضوع اسفل التدوينه لمدونات بلوجر

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

كيفية اضافة هذا السلايدر شو الى مدوناتكم

      1- من  لوحة التحكم -> قالب -> تحرير HTML
     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
]]>b:skin>
 ** والصق الكود التالي قبله تمامآ 
#mblrib {
width: 111px;
height: 111px;
margin-right:-15px;
margin-top:-15px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjuzug1nrRwX55wAPyJ6MidZXxrldLRtX6_Y8imIetF3YSphVQw7FyUtfCJIFYkU2SlWhcTmkwDI2DY1fWYnB9EjsGOK6JFF44uEmBldmx5564yZpnuzq9MtSTlKk4ysdgXRXm8jVaLcEez/s109/1rib.png) no-repeat;
z-index: 7;
position:absolute;
}
.mblautbox {border: #4f5966 solid 3px; width:100%;}
.authorinfoname { text-decoration:underline;}
.mblautbox a:hover {
color: #afafaf;
text-decoration: underline;
outline: none;
}
.mblautbox a {
color: #afafaf;
text-decoration: none;
outline: none;
}
.mblautinfo {
border: #f5f5f5 solid 5px;
-moz-border-radius: 74px;
-webkit-border-radius: 74px;
border-radius: 74px;
margin-left:20px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
float:right; padding:4px;margin-right: 0px;height:100px;
}
.mblautobox {
font-size:20px;
margin-top:-20px;
}
.mblautbox{
direction:rtl;
background:#222222;
line-height:1.7em;
float:center;
padding:10px 10px 10px 10px;
margin:20px 5px 5px 0;
color:white;
font-family:GE SS Two Light;
font-size: 14px;
line-height: 24px;
}
.mblautbox-right-min{
border-left:solid 0px #e8e8e8;
height:auto
}
#mycontents {
position:absolute;
width: 111px;
height: 111px;
margin-left:565px;
margin-top:-5px;
}

ثم قم بالبحث عن 



** والصق الكود التالي بعده  مباشره (تحته)











بقلم:
اسم الكاتب


اكتب هنا نبذه قصيره عن الكاتب


يمكنك متابعتي على:
فيس بوك | تويتر | جوجل بلس | يوتيوب | الموقع.





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

 2- استبدال ماباللونalbaadani1 باسم حسابك في تويتر
 3- استبدال ماباللونalb33dani باسم صفحتك في فيس بوك
 4- استبدال ماباللون115387305017738790650 باسم حسابك جوجل بلس
 5- استبدال ماباللونalb33dani باسم قناتك في يوتيوب
 5- استبدال ماباللونhttp://alb33dani.blogspot.com برابط مدونتك
  6- اسم الكاتب استبدله باسمك او الاسم الذي تحب
  7- اكتب هنا نبذه قصيره عن الكاتب استبدله بنبذه قصيره عنك او عن خدمات مدونتك

 وبالاخير قم بحفظ القالب ومبروك عليك الاضافه ولا تنسى ان تشاركنا ارائك بتعليق 
8/04/2013 03:06:00 ص
اقرأ المزيد
مرسلة بواسطة في 8/04/2013 03:06:00 ص 0 التعليقات

اضافة كود التبادل الاعلاني النصي بشكل جديد واحترافي لمدونات بلوجر

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

صورة الاضافه


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

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


width="320px" id="table1" dir="rtl" style="border: 1px solid #ccc" >





       
       





















ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا


ضع هنا رابط المعلن">
ضع اعلانك هنا


ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا


ضع هنا رابط المعلن">
ضع اعلانك هنا


ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا



ضع هنا رابط المعلن">
ضع اعلانك هنا


تخصيص القطعه

  • استبدل ماباللون ضع هنا رابط المعلن  برابط مدونة المعلن لديك
  • استبدل ماباللون   ضع اعلانك هنا      بأسم مدونة المعلن لديك
  • width="320px    لتغيير عرض الاضافه
  •  

 الان قم بحفظ القطعه مبروك عليك الاضافه 

7/21/2013 03:21:00 م
اقرأ المزيد
مرسلة بواسطة في 7/21/2013 03:21:00 م 0 التعليقات

الطريقه الصحيحه لاضافة سلايدرشو المحترف لمدونات بلوجر باحترافيه


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

اضافة سلايدر شو مدونة المحترف لمدونات بلوجر


كيفية اضافة هذا السلايدر شو الى مدوناتكم

      1- من  لوحة التحكم -> قالب -> تحرير HTML
     2- خذ نسخه احتياطيه لـ قالب المدونه قبل إجراء أية تغييرات 
     3- قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F)
]]>

 ** والصق الكود التالي قبله تمامآ

#alwansd{
height: 428px;
margin: 0 0 0px 0px;
padding: 15px 28px 15px 16px;
width: 672px;
background: #373737;
}
.alwanw{
position: relative;
height:385px;
}
.alwanw .contentdiv{
visibility: hidden;
position: absolute;
opacity: 1;
}
.alwan-ps{
text-align: right;
float: left;
width: 670px;
height: 11px;
margin-left:-43px;
}
.alwan-ps .toc{
font-size: 0px;
width: 102px;
height: 11px;
float: right;
background: #5b5b5b;
margin-left: 1px;
}
.alwan-ps a.selected{
background:#dfdfdf;
}
.alwan-ps .prev, .alwan-ps .next {display:none; }
.alwanip{
width: 618px;
padding: 10px !important;
bottom: 0;
float: left !important;
position: absolute;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsEOwQ4onuYwDUi6DtWaApx_jKs1O_-gvn6krtCLy7iM4kof0sUxTZpYIoQ53ugN3a9xkdXqiXG1cORYKNpQ5qOZsDwhyhsBk299Judb3HfRLXkQhFwnCSWtzpCxcx_CAmgZC_N_7dAd8/s1600/backslide.png);
}
.alwanip a{
color:#dcdcdc;
font: 12px droidkufi-bold;
margin:0;
padding:0;
line-height: 19px;
}
.alwanip h6{margin: 0;}
.alwanip h6 a:hover {color:#c2df00;}
.alwanip .alwand{font:12px arial; margin:4px 0; color:#a5a5a5; }
.alwanip p{font-size: 13px;
margin: 0;
color: #a5a5a5;
line-height: 23px;
}
.alwansf a img{float: right !important; }
.alwansf {float: right !important; width:680px!important;}
.column-center-outer {
width: 680px;
}
قم بتغيير ماباللون الاحمر بكود اللون المناسب لمدونتك

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

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

بعد ذلك قم بالبحث عن 

 ** والصق الكود التالي قبله مباشره (فوقه)

 




وبالاخير قم بالبحث عن 

 

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

    او

    او

    او

** و الصق الكود التالي بعده/أسفله :








 

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

















6/20/2013 05:07:00 م






اقرأ المزيد











مرسلة بواسطة





في
6/20/2013 05:07:00 م


0
التعليقات



























        

      










الاشتراك في:
الرسائل (Atom)

































 





























  جميع الحقوق محفوظة   ©  2013 أساحبى كوميكس






تطوير: أمصطفى حمادة