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

طريقة اضافة صندوق تعليقات Disqus الي مدونتك

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

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

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

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



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



ثم قوم بحفظ الترتيب  واذهب الي مدونتك وتاكد بنفسك
الشرح الاصلي من انا مدون
 ـــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــــ
الاثنين, يناير 13, 2014

طريقة اضافة اداة معلومات جهاز و ip الزائر لمدونات بلوجر

طريقة اضافة اداة معلومات جهاز و ip الزائر لمدونات بلوجر

طريقة اضافة اداة معلومات جهاز و ip الزائر لمدونات بلوجر
طبعاً اذا دخلت على الرابط فستتفاجئ بعرض نظام جهازك الخاص ( الويندوز ) و علم بلدك و اسمها و رقم الآي بي الخاص بك و نوع المتصفح الذي تزور الموقع باستخدامه ! لكن لا داعي للقلق فانت الوحيد المطلع عليها و الذي بامكانه رؤيتها ^_^ وخير الكلام ما قل و دل فلنبدأ بالشرح و طريقة التركيب على الموقع ..

ادخل على لوحة تحكم المدونة المراد تركيب الإضافة بها..

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

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

 أما اذا كنت تريد اضافته للقالب فقم بالبحث عن :
<data:post.body/>

ثم قم باضافة الكود الآتي بعدها مباشرتاً لكي يظهر أسفل كل موضوع في المدونة

<p><span style="text-align:center; display: block;"><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"><img src="http://www.wieistmeineip.de/ip-address/?size=468x60" border="0" width="468" height="60" alt="IP" /></a><br /><small><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"></a></small></span></p>

وسيكون حجم الاضافة كالآتي :


IP
إضافة تسمية توضيحية


أو يمكنك ان تقوم بإضافتها على رئيسية المدونة على شكل مربع في التخطيط كأداة اضافية لتعطي جمالية للمدونة و الطريقة كالآتي :

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

<p><span style="text-align:center; display: block;"><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"><img src="http://www.wieistmeineip.de/ip-address/" border="0" width="125" height="125" alt="IP" /></a><br /><small><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"></a></small></span></p>

و سيكون حجم الإضافة كالآتي :

IP
تم بحمد الله
ــــــــــــــــــــــــــــــــــــــــــــــــــــ
اضافات بلوجر
,دروس بلوجر, طريقة اضافة اداة معلومات جهاز و ip الزائر لمدونات بلوجر
الجمعة, يناير 10, 2014

اطلب تعريب قوالب بلوجر مجانا

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


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

المطلوب منا
تعريب القالب في دقائق وارسال الرد علي تعليقك برابط القالب
الجمعة, يناير 03, 2014

كود التبادل الإعلاني النصي المميز

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

<style type='text/css'>
#navlist {
    margin: 0px auto 0px auto;
    padding: 0px;
    list-style-type: none;
    float: center;
    display: block;
}
#navlist a {
font-family: "DroidKufi-Regular";
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
    background-color:#B6D721;
    border: 1px solid #B6D721;
    font-size: 10pt;
    text-decoration: none;
    color: #fff;
    display: block;
    text-align: center;
    line-height: 30px;
    padding-right: 0px;
    margin-right: 0px;

}
#navlist a:hover {
font-family: "DroidKufi-Regular";
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
    background-color:#6EA611;
    border:1px solid #6EA611;
    font-size: 12pt;
    text-decoration: none;
    color: #000000;
    display: block;
    text-align: center;
    line-height: 30px;
    padding-right: 0px;
    margin-right: 0px;

}

</style>
<ul id='navlist'>
<table align='center' width='100 %'>
<tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='' target='_blank'>أعلن هنا</a>
</td>
</tr></table>
<table align='center' width='100%'>
<tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td></tr>
<table align='center' width='100%'>
<tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td></tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
</table>
<table align='center' width='100%'>
<tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td></tr>
<table align='center' width='100%'>
<tr>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td>
<td align='center' width='25%'>
<a href='/' target='_blank'>إعلانك هنا</a>
</td></tr>
</table></table></table></ul>
<div class='clear'></div>
وهكذا تكون إنتهيت اتمنى ان يكون الكود قد لاق إعجابكم بالتوفيق للجميع
ودمتم في رعاية الله وحفضه
ــــــــــــــــــــــــــــــــــــــ
 كود التبادل الإعلاني النصي المميز
السبت, ديسمبر 28, 2013

كيفية انشاء وحدة وصلات اعلانية من جوجل ادسنس

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

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





مثال حي للوصلة الاعلانية

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

ثم اعلانتى

ثم الوحدات الاعلانية

ثم وحدة اعلانية جديدة

اكتب الاسم الوحدة

لعمل وحدة وصلات وليس وحدة اعلان عادية

افتح حجم الإعلان
 واختر حجم اعلان من المقاسات الموجودة تحت كلمة
وحدات الوصلات - قائمة المواضيع ذات الصلة

وهى بالاحجام التالية

(120×90)
(160×90)
(180×90)
 (200×90) 
(468×15)
 (728×15)
اختر حجم للوحدة
اختر نمط والوان الاعلان

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

ثم اضغط حفظ والحصول علي الشفرة وأضفها داخل مواضيعك
واذا كانت لديك اي مشكلة فأضفها في تعليق ولمزيد من دروس ادسنس من هنا
ــــــــــــــــــــــــــــــــــــــــ
اضافة اعلانات ادسنس صغيرة، كيفية انشاء وحدة وصلات اعلانية من جوجل ادسنس
السبت, ديسمبر 28, 2013

طريقه وضع اعلانات ثابته على جانبى المدونه

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

<div class='clear'>

</div>
<span class='widget-item-control'> <span class='item-control blog-admin'> <a class='quickedit' href='//www.blogger.com/rearrange?blogID=6978282028189964955&widgetType=HTML&widgetId=HTML20&action=editWidget§ionId=main' onclick='return _WidgetManager._PopupConfig(document.getElementById("html20"));' target='configHTML20' title='تحرير'> <img alt='' height='18' src='http://img1.blogblog.com/img/icon18_wrench_allbkg.png' width='18'/> </a> </span> </span> <div class='clear'>
</div>
<div id='rsidebar-wrapper'>
<div class='sidebar section' id='sidebarleft'>
<div class='widget HTML' id='HTML15'>
<div class='widget-content'>
<div class="angular_advertisement angadver_bottom angadver_right">
 <a href="#">  </a>  </div>
<div class="angular_advertisement" style="right: 0px; top: 0px; position: fixed;">
 كود ادسنس هنا  <div dir="rtl" style="text-align: right;" trbidi="on">
<strong></strong></div>
</div>
</div>
</div>
</div>
</div>

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

<div class="angular_advertisement" style="left: 0px; top: 0px; position: fixed;">
 كود ادسنس هنا  <div dir="rtl" style="text-align: right;" trbidi="on">
<strong></strong></div>
<div class='clear'>
</div>
<span class='widget-item-control'> <span class='item-control blog-admin'> <a class='quickedit' href='//www.blogger.com/rearrange?blogID=6978282028189964955&widgetType=HTML&widgetId=HTML15&action=editWidget§ionId=sidebarleft' onclick='return _WidgetManager._PopupConfig(document.getElementById("html15"));' target='configHTML15' title='تحرير'> <img alt='' height='18' src='http://img1.blogblog.com/img/icon18_wrench_allbkg.png' width='18'/> </a> </span></span></div>


طريقه تركيب الاعلان

بدل كلمة = ضع كود ادسنس هنا (قم بوضع الكود الخاص بك)
 

طريقة تركيب الكود :
 
تصميم > عناصر الصفحة > إضافة أداة > اداة الـ HTML/JavaScript
 
واحفظ الاداة ومبروك عليك الاعلانات مزبوطة 
ـــــــــــــــــــــــــــــــــــــــــ
دروس ادسنس’ اعلانات ثابتة’ طريقه وضع اعلانات ثابته على جانبى المدونه
الجمعة, ديسمبر 27, 2013

احصل على معلومات أي قالب يعجبك لبلوجر

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

 اولا: توجه الي المدونة التى ترغب في ان تعرف اسم القالب الخاص به وضغط 

علي ctrl+u

سوف تظهر لك القائمة التاليه : 

احصل على معلومات أي قالب يعجبك لبلوجر

 

ابحث دخل القالب عن : هذه الكلمة : 


Blogger Template Style

وسوف تجد اسفله جميع بيانات القالب 

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

 


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

ملاحظة : لا تعمل هذه الطريقة مع جميع المدونات فثمة قوالب مدفوعة

فالان يمكنك الحصول علي معلومات اي قالب بلوجر ولمزيد من دروس بلوجر blogger    من هنا

بلوجر، blogger، دروس بلوجر، احصل على معلومات أي قالب يعجبك لبلوجر

الثلاثاء, ديسمبر 24, 2013

اضافة صفحة اتصل بنا لمدونة بلوجر

السلام عليكم اخواني


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


سيتم الشرح علي 3 مواقع توفر هذه الخدمة وهم :-
foxyform
freedback
emailmeform
أولا موقع : foxyform
اضغط علي الرابط التالي  للدخول إلي الموقع
اختر التفاصيل التي تريد أن تظهر في الصفحة , وإختر لون الخلفية ولون الكتابة ونوع الخط وحجمه , وقم بإدخال بريدك الإلكتروني الذي ترغب في تلقي الرسائل من خلاله , ثم اضغط  Greate Formular .
- انسخ الكود الناتج
من لوحة التحكم قم بإنشاء صفحة جديدة ( الصفحات  .. صفحة جديدة .. صفحة فارغة ) .
اكتب في العنوان راسلني أو تواصل معنا او أي إسم أخر , ثم اختر وضع HTML وقم بلصق الكود , وأخيرا إضغط نشر .
- لمنع التعليقات علي هذه الصفحة  {  خيارات .. تعليقات القراء .. عدم السماح .. تم } .
 
- قم بترتيب الصفحات ثم إضغط " حفظ الترتيب " .
- سيكون شكل الصفحة بهذا الشكل
ثانيا موقع : freed back
للدخول الي الموقع قم بالضغط علي الصورة التالية
بعد الدخول الي الموقع اضغط Create aFree Form Now
- ستفتح صفحة التسجيل , قم بالتسجيل في الموقع والتفعيل عبر الإيميل
- بعد تفعيل حسابك , قم بالضغط علي Login
- قم بتحديد الشكل المناسب , ثم إضغط Continue
- انسخ الكود الناتج , وطبق نفس الخطوات السابقة مع موقع  Foxy Form
تم بحمد الله
أي سؤال أو إستفسار لا تتردد في طرحه .
ــــــــــــــــــــ
اضافة صفحة اتصل بنا لمدونة بلوجر 
الاثنين, ديسمبر 23, 2013

عمل باك لينك بطريقة آلية لكلمات معينة داخل مدونتك

عمل باك لينك بطريقة آلية لكلمات معينة داخل مدونتك

عمل باك لينك بطريقة آلية لكلمات معينة داخل مدونتك

 وصف سريع : 

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

و دة بيساعد على :

1. عمل روابط داخلية متعددة و بطريقة آلية
2. عمل روابط آلية بأشهر المواقع ثل : جوجل , ياهو . الفايس بوك , و غيرها
3. كل دة هيساعد في جعل محتوى اي مواضي غني بالروابط مما يقوي الارشفة و يساعد عناكب البحث على جعل موقعك في اوائل محركات البحث .
4. بديل رائع عن وضع الروابط الداخلية اليدوي .. و سهولة اكبر
5. ربط محتوى المدونة ببعضها .. مما يجعل محتواها غني بالمعلومات

كود عمل باك لينك بطريقة آلية لكلمات معينة داخل مدونتك
طريقة اضافة الكود :

1. تصميم
2. تحرير HTML
3. توسيع عناصر واجهه المستخدم
4. ابحث عن : </head>

اضف الكود التالي قبله مباشرة :

<script src='http://sites.google.com/site/javacodehtml/auto-backlink.js' type='text/javascript'/>

5. و الان ابحث عن : <data:post.body/>

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

و قم بأستبدالة بـ :

<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>

<script type='text/javascript'>

highlightSearchTerms('google',true,'http://www.google.com','summary'); highlightSearchTerms('جوجل',true,'http://www.google.com','summary');

</script>

 شرح الكود :
الكود يقوم بالبحث بداخل الموضوع عن الكلمات الملونة باللون الازرق ( جوجل و google ) و عمل لها ارتباط و هو ما تراة باللون الاحمر ..
** لأضافة المزيد من الروابط قم بتكرار :

highlightSearchTerms('جوجل',true,'http://www.google.com','summary');
highlightSearchTerms('جوجل',true,'http://www.google.com','summary'); 
highlightSearchTerms('جوجل',true,'http://www.google.com','summary');

 و هكذااااااااااااا ........... بنفس الشكل الموجود بالكود ... و استبدل الكلمات و الروابط بما يناسبك ....

و بعد الانتهاء قم بحفظ القالب 

و المعاينة داخل اي موضوع مكتوب مسبقا يحتوي على الكلمات التي اضفتها ...
ارجو ان يكون الكود قد نال اعجابكم
ــــــــــــــــــــــــــــ
السبت, ديسمبر 21, 2013

إعادة تحويل إتجاه مدونة بلوجر إلى مدونة أخرى أو موقع آخر

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

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


انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F ).
تذكير:لا تنسى أخي المدون أن تأخد نسخة إحتياطية لمدونتك تجنبا لأي أخطاء.

كود إعادة تحويل إتجاه مدونة بلوجر إلى مدونة أخرى أو موقع آخر

  • الطريقة الأولى :
<head>
ثم قم بوضع الكود التالي بعده ،ثم قم بكتابة رابط المدونة المراد التوجه اليها في المكان المخصص بالون الاحمر
<meta HTTP-EQUIV='REFRESH' content='0; url=رابط المدونة الجديدة'/>
  • الطريقة الثانية :
انتقل إلى لوح تحكم مدونتك،إختر "تصميم" ثم إضافة أداة ثم اختر HTML/Javascriptولآن الصق الكود التالي :
<html>

<head>

<title>
المرجو الانتظار قليلا سوف يتم التوجيه الى المدونة الجديدة وشكرا
</title>

<script>
location.replace("رابط المدونة الجديدة")
</script>

</head>

<frameset cols="0,*">
</frameset>

<noframes>

<body>

<a href="رابط المدونة الجديدة">
المرجو الانتظار قليلا سوف يتم التوجيه الى المدونة الجديدة وشكرا</a>

</body>

</noframes>

</html>
بعد ذلك قم بوضع هذه الأداة تحت 'اداة رأس الصفحة' لتحويل سريع كما هو موضح في الصورة
إعادة تحويل إتجاه مدونة بلوجر إلى مدونة أخرى أو موقع آخر

أتمنى أن تكونو قد استفدتم من هذا الدرس البسيط ،في انتظار تشجيعاتكم
ـــــــــــــــــــــــــــــــ
كلمات للبحث 
إعادة تحويل إتجاه مدونة بلوجر إلى مدونة أخرى أو موقع آخر
الجمعة, ديسمبر 20, 2013

شرح طريقة وضع الروابط في تعليقات البلوجر بطريقة احترافية

طريقة وضع الروابط في تعليقات البلوجر,جعل الروابط فعالة في تعليقات البلوجر
بسم الله الحمان الرحيم و الصلاة و السلام على أشرف المرسلين سيدنا محمد صلى الله عليه و سلم
أهلا بكم أخواني زوار ومتابعي مدونة ثعلوب درسنا اليوم درس بسيط جدا وهو طريقة وضع الروابط في تعليقات البلوجر بطريقة جميلة أي امكانية الضغط على الرابط فهي طريقة بسيطة جدا ومفيدة للذين يحبون وضع وابط مدوناتهم في تعليقات المدونات الاخرى
الروابط في تعليقات البلوجر
مثال عن الروابط:
مدونة ثعلوب 
اذا أعجبتك طريقة وضع الروابط ما عليك:
<a href="http://www.arabever.blogspot.com">عرب ايفر</a>  
فقط غير اسم المدونة والربط وضعها في صندوق التعليقات و مبروك عليك
الخميس, ديسمبر 19, 2013

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

صندوق الإعجاب للشبكات والصفحات الإجتماعيه

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

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

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

لتركيب إضافة صندوق الإعجاب للشبكات الإجتماعية عليك إتباع الخطوات التالية :
  1. لابد أن تنشأ لمدونتك صفحة فى الفيس بوك تنشر فيها مقالاتك الحصرية .
  2. قم بعمل صفحة بإسم المدونه على تويتر .
  3. قم بعمل قناة لك على اليوتيوب تضع فيها فيديو الشرح لموضوعاتك .
  4. قم بتسجيل الدخول إلى لوحة التحكم الخاصة بمدونتك .
  5. إضغط على تخطيط أو "Layout".
  6. قم بإضافة عنصر جديد أو "Add a Gadget" .
  7. قم بإختيار "Add HTML/Java Script" .
  8. قم بنسخ الكود بعد تحميله من الروابط بالأسفل ثم ضعه فى الصندوق وذلك بعد وضع روابط صفحاتك الإجتماعية .
  9. قم بعمل حفظ ثم حفظ التعديلات أو "Save arrangement".
  10. قم بفتح صفحة مدونتك وشاهد الإضافة الجميلة .
  11. يمكنك متابعة الخطوات فى الصور التالية .
اضافة عنصر جديد
تركيب صندوق اللايك للفيس بوك

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

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

 

<div class="Ayoub-Etmaiti-center">
<a href="أكتب رابط صفحة الفيس هنا" target="_blank" title="?فيسبوك!"><img class="Azrar-Ayoub-Etmaiti" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjU9HkoDyMbGB5hyphenhyphenDc_UUzgr1UVVM4pPn9NRIJe-eTrn19VuSy2V9OiP_4dgx-flj0VovID-hJ1N7omEL5wGhWy7WnA-uqeWQHV3XBxtHwgp-DfUkCcm_V2BAkbFyihhbm5ADqREFFrtvYI/s1600/sus-Ayoub-Etmaiti-facebook.png" /></a>
<a href=" أكتب رابط صفحة التويتر هنا" target="_blank" title="?تويتر!"><img class="Azrar-Ayoub-Etmaiti" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiImOkcuJ95qTlPvL4SQsqmfITpLov9H_pZVLoxBLYJFRbYmqDh-RGknWA4j1xc51K8BC8eKcgqQKXipWwwZvVJny-XqbgeQ91FltSvnxRnJM4noc3y57M2MX4LJpnXeuSzWc0g6MWOBfq9/s1600/sus-Ayoub-Etmaiti-twitter.png" /></a>
<a href="أكتب رابط قناة اليوتيوب هنا" target="_blank" title="?يوتيوب!"><img class="Azrar-Ayoub-Etmaiti" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6uCSq4x8g6O-_EzsROd_cLOuO7JZ0HfD8SShVgTYX9dSZ_gms_0k2pizMOSpQufXmMd2QGx1_7CZyIkI7Vl_l3pEWMb4kvEIo6l80z53Yy6Da_KpTtaA62IhPmRt89_Y0oWebAI4Fcdxc/s1600/sus-Ayoub-Etmaiti-youtube.png" /></a>
<a href="أكتب رابط الخلاصه لمدونتك هنا" target="_blank" title="?الخلاصة!"><img class="Azrar-Ayoub-Etmaiti" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwRptG4M-RPWPQlhJzKEfsoE2o-HzjO44-JwpWQuXHz3lPhSKCwI1Q6iKpiJ2gjQFD1H105XTUdFSCL75gh9U-yK48irdLjOPvmtjTls0wt-hKCpium3RmUyRuv_tenTgjsnC9Xd8nUHwf/s1600/sus-Ayoub-Etmaiti-rss.png" /></a>
</div>

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

الخميس, ديسمبر 19, 2013

طريقة إضافة ألعاب الفلاش إلى مدونة البلوجر

 add flash games to blogger
اليوم سوف أشرح لكم كيفية إضافة ألعاب الفلاش إلى مدونات البلوجر عن طريق مواقع تضم العديد من هذه الألعاب و تعطيك أكواد الألعلب لتضعها في موقعك بكل سهولة كل ما عليك فعله هو نسخ الكود و لصقه ,  يمكنك إضافة لعبة لكي يستمتع بها زوار مدونتك أو إنشاء مدونة كاملة للألعاب , يمكنك مشاهدة مثال لمدونة كاملة للألعاب الفلاشية .
نمر إلى الشرح :

  • أولا اتجه إلى هذا الموقع : Freeonlinegames.com
  • عند الدخول إلى الموقع ستظهر لك واجهة الموقع كالتالي :
Freeonline flash games
  • نختار اللعبة التي نريدها ثم نضغط عليها , ستظهر لنا مثل هاته النافذة :
free flash games
  • نقوم بالضغط على الزر الموجود تحت اللعبة الذي يحمل اسم Embed
  • بعد الضغط عليه سوف يظهر لنا كود مظلل بالأزرق نقوم بنسخه و لصقه في المدونة 
  • يمكنك أن تضيف كل لعبة في تدوينة خاصة بها مرفوقة بوصف للعبة و طريقة اللعب الموجودان تحت اللعبة , كل ما عليك فعله هو نسخ و لصق تلك المعلومات.
انتهى الدرس و السلام عليكم

الخميس, ديسمبر 19, 2013

اضافة كود تظليل الروابط في المدونة


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

ومثال ذلك الموجود في مدونتي والتي تظهر خلف الروابط عند مرور بالماوس عليها 

بالون الازرق الفاتح

هذه الاضافة من خصائص css

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

تصميم

تحرير html

أعمل توسيع للقالب


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

/]]></b:skin>

وألصق قبله مباشرة الكود التالي
a:hover{text-shadow:0 0 20px;}
وأخيرا أعمل حفظ للقالب
الخميس, ديسمبر 19, 2013

اضافة قائمة افقية منسدلة جميلة ورائعة بتنقية css لمدونات بلوجر البلوجر سبوت استجابة لطلبات الاعضاء

Drop-Down-Menu-With-CSS3اهلا بكم وبحضراتكم اليوم...جيبين درس رائع اليوم لمدونات بلوجر البلوج سبوت تابعو معنا الدرس
الدرس رائع جدا ومهم جدا وعو عبارة عن اضافة قائمة افقية منسدلة لمدونات بلوجر بشكل رائع وجميل
والقائمة التي تكون في اعلي الصفحة ويمكنكم تغيير لونها كما شئتم من اكواد الألوان html
والقائمة بتنقية css بأشكالها الرائعة........تابعو معي الشرح....



صورة للمعاينة القالب
Drop-Down-Menu-With-CSS3

تم فحص الكود من خلال موقع w3


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

يمكنك الأطلاع على قائمة أخرى شبيه بهذه القائمة ونظيف 

أضافة رائعة قائمة المنسدلة css3 بدون صور أو Scripts

أو

قائمة أفقية الحمراء الامعة لمدونات البلوجر 

 

 نكمل الأن كيف يمكنك أضافتها للقالب مدونتك البلوجر؟؟ 

توجد طريقتان للتركيب الأضافة للمدونة البلوجر  

الطريقة الأولى

توجه للوحة التحكم >> تصميم>> تحرير html 

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

]]></b:skin>

وأضف قبله مباشر الكود التالي css 

#nav {float : right;
font : bold 13px Arial, Helvetica, Sans-serif;
border : #121314 solid 1px;
border-top : 1px solid #2b2e30;
overflow : hidden;
width : 100%;
background : #3c4042;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
}
#nav ul {
margin : 0;
padding : 0;
list-style : none;
}
#nav ul li {
float : right;
}
#nav ul li a {
float : right;
color : #d4d4d4;
padding : 10px 20px;
text-decoration : none;
background : #3c4042;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
border-right : 1px solid rgba(255, 255, 255, 0.05);
border-left : 1px solid rgba(0, 0, 0, 0.2);
}
#nav ul li a:hover, #nav ul li:hover > a {
color : #252525;
background : #3c4042;
}
#nav li ul a:hover, #nav ul li li:hover > a {
color : #2c2c2c;
background : #5c9acd;
border-bottom : 1px solid rgba(0, 0, 0, 0.6);
border-top : 1px solid #7baed9;
}
#nav li ul {
background : #3c4042;
right : -999em;
margin : 35px 0 0;
position : absolute;
width : 160px;
z-index : 9999;
box-shadow : 0 0 15px rgba(0, 0, 0, 0.4) inset;
border : rgba(0, 0, 0, 0.5) solid 1px;
}
#nav li:hover ul {
right : auto;
}
#nav li ul a {
background : none;
border : none 0;
margin-left : 0;
width : 120px;
box-shadow : none;
border-bottom : 1px solid transparent;
border-top : 1px solid transparent;
}
.nav ul li ul {
position : absolute;
right : 0;
display : none;
visibility : hidden;
}
.nav ul li ul li {
display : list-item;
float : none;
}
.nav ul li ul li ul {
top : 0;
}
.nav ul li ul li a {
font : normal 14px Verdana;
width : 160px;
padding : 5px;
margin : 0;
border-top-width : 0;
border-bottom : 1px solid gray;
}
#nav li li ul {
margin : -1px 160px 0 0;
visibility : hidden;
}
#nav li li:hover ul {
visibility : visible;
}

ثم أحفظ القالب

توجه الأن للوحة التحكم >>تصميم>>أضافة أداة

أختار

تهيئة HTML/JavaScript

 

وأضف الكود التالي مع تعديل المسميات المشار له بلون الأخضر بمسميات وأقسام مدونتك

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

<div id="nav"> <ul>
  <li><a href="#">الرئيسية</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a>
  <ul>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
  </ul>
  </li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
 </ul>
</div>

الطريقة الثانية

هذه الطريقة تعتبر أسرع وأسهل للمبتدئين مع أن فكرة الطريقة السابقة بسيط

قمت بتعديل على الكود هتمل وخصائص css ودمجها

بحيث يمكنك أضافتها من خلال

تهيئة HTML/JavaScript

دون الحاجة للتعديل على القالب أو لأضافة أليه

من لوحة التحكم >> تصميم >> أضافة أداة >>HTML/JAVA

HTML/JAVA بلوجر

وأضف الكود التالي بداخل الصندوق

 <style> #nav {
float : right;
font : bold 13px Arial, Helvetica, Sans-serif;
border : #121314 solid 1px;
border-top : 1px solid #2b2e30;
overflow : hidden;
width : 100%;
background : #3c4042;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
}
#nav ul {
margin : 0;
padding : 0;
list-style : none;
}
#nav ul li {
float : right;
}
#nav ul li a {
float : right;
color : #d4d4d4;
padding : 10px 20px;
text-decoration : none;
background : #3c4042;
box-shadow : 0 1px 0 rgba(255, 255, 255, 0.1) inset, 0 0 5px rgba(0, 0, 0, 0.1) inset;
border-right : 1px solid rgba(255, 255, 255, 0.05);
border-left : 1px solid rgba(0, 0, 0, 0.2);
}
#nav ul li a:hover, #nav ul li:hover > a {
color : #252525;
background : #3c4042;
}
#nav li ul a:hover, #nav ul li li:hover > a {
color : #2c2c2c;
background : #5c9acd;
border-bottom : 1px solid rgba(0, 0, 0, 0.6);
border-top : 1px solid #7baed9;
}
#nav li ul {
background : #3c4042;
right : -999em;
margin : 35px 0 0;
position : absolute;
width : 160px;
z-index : 9999;
box-shadow : 0 0 15px rgba(0, 0, 0, 0.4) inset;
border : rgba(0, 0, 0, 0.5) solid 1px;
}
#nav li:hover ul {
right : auto;
}
#nav li ul a {
background : none;
border : none 0;
margin-left : 0;
width : 120px;
box-shadow : none;
border-bottom : 1px solid transparent;
border-top : 1px solid transparent;
}
.nav ul li ul {
position : absolute;
right : 0;
display : none;
visibility : hidden;
}
.nav ul li ul li {
display : list-item;
float : none;
}
.nav ul li ul li ul {
top : 0;
}
.nav ul li ul li a {
font : normal 14px Verdana;
width : 160px;
padding : 5px;
margin : 0;
border-top-width : 0;
border-bottom : 1px solid gray;
}
#nav li li ul {
margin : -1px 160px 0 0;
visibility : hidden;
}
#nav li li:hover ul {
visibility : visible;
} </style> <div id="nav">
 <ul>
  <li><a href="#">الرئيسية</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a>
  <ul>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
   <li><a href="#">تعديل قسم فرعي</a></li>
  </ul>
  </li>
  <li><a href="#">تعديل</a></li>
  <li><a href="#">تعديل</a></li>
 </ul>
</div>

 

أحفظ الأداة 

وأجعلها في رأس الصفحة 

كما في الصورة

بلوجر

 

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

 

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

الخميس, ديسمبر 19, 2013