مدونة علمني

نصائح عن كيفية زيادة امكانية الربح من برنامج الادسنس

noreply@blogger.com (soufian) — Mon, 4 Feb 2013 14:34:00 GMT

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

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

كثيرة هي الاسئلة التي تطرح عن كيفية الربح من وراء الانترنت وخصوصا برنامج جوجل ادسنس الشهير

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

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

اليكم ست طرق لتسريع عملية الربح من برنامج غوغل ادسنس هي مجرد عبار عن نصائح :.

هل اعلاناتك في المكان المناسب ؟

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

======================================================================

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

بشكل عام حجم الاعلانات قد لا يهم لكن احياننا يجب الاهتمام كثيرة بحجم الوحدات الاعلانية خصوصا في تنسيق هاته الواحدات مع تصميم القالب الخاص بالموقع او المدونة فمثلا الوحدات الاكثر شيوعا هي ذات حجم 728*90 بكسل 300*250 بكسل و 386*280 بكسل لانها واضحة ويمكن ان تقع عين الزائر عليها بوضوح لكن الاهم ان تكون بمطقة السبوت spot

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

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

======================================================================

اضف صندوق محرك البحث
======================================================================

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

======================================================================

ضع اعلاناتك فمناطق استهداف
======================================================================

يقصد بمناطق الاستهداف تلك المناطق التي يسهل على المتصفح رؤيتها دون ان يقوم بحركة او لنقل منطاق تستهدف العين بسهولة وهاته المنطاق غالبا تكون في وسط المحتوى او اعلى الموقع او في السايدبار او تحت نافر البار لذى عليك ان تنتبه الى هاته المناطق وكيفية توزيع وحداتك الاعلانية

======================================================================

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

======================================================================

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

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

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

اذا كان لديك اي ستفسار او اي سؤال تفضل وسنيجبك على الفور

كيفية إستخدام جهاز الايفون لأول مرة

noreply@blogger.com (soufian) — Tue, 25 Dec 2012 15:15:00 GMT

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

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

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

01 لندبا على بركة الله بعد تشغيلك للهاتف او شيئ حرك السهم كما في الصورة الى يمينك

حتى يتم فتح قفل الهاتف.

02 ثم اختر اللغة التي تناسبك ولغتك الام ثم اضغك على التالي "السهم الابيض"

03 اختر منطقتك ودولتك ثم اضغط التالي

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

او ااختر use cellular connection

05 ادخل اسم المستخدم والرقم السري فحالة ان كانت الشبكة مشفرة واختر join

06 الان انت متصل بالشبكة اختر next

07 نأتي لخاصية Location Services هذه الخاصية تمكن تطبيقات كمتصفح سفاري والخرائط وتطبيقات الصور الخ من تحديد موقعك الجغرافي اعتمادا على اتصال الانترنت الذي انت مرتبط به كما يمكنك من الاعدادت تحديد اي تطبيقات يمكنك مشاركتها الموقع الجغرافي الخاص بك اختر Enable Location Services and ثم اختر next

08 اختر Set Up as New iPhone ثم next

09 الان نصل الى مرحلة حساب ابل على الاب ستور ان كان لك حساب اختر Sign In with an Apple ID وان لم يكن لك حساب اختر Create a Free Apple ID وتابع الخطوات حتى تنشئ حساب خاص بك

10 أدخل معلومات حسابك " غالبا ما يكون بريد الكتروني ثم next

11 هذه المرحلة كثير من يكرها من يريد قراء هاته الوثيقة الضخمة ههه لذى اختر موافق agree

12 مرة اخرى موافق agree

13 الان ننتظر دقيقة او ثلاث كما في الصورة

14 في يوم من الايام ستحتاج الى خدمة الاي كلود حتى ولو لم تردها .. يمكنك اختيار use icloud لو الغاء ذلك

15 ثم اضغط على next

16 بالنسبة لي انا أفضل ان أحفظ النسخة الاحتياطية للهاتف عبر الايتيونز على حاسبي الشخصي عوض خدمة الاي كلود لذى اختر Create a Free Apple ID ثم next

17 اما الان نصل الى خاصية ربما يستاء الكثير منها لأنها ربما تنهك الخصوصية الخ لكن من وجهة نظر فهي تساعدك على تحديد موقع هاتفك اذ تمت سرقته او صاع منك فالبيت او غير ماكن اخر ويمكن بهاته الخاصية مسح محتوى هاتفك اذا تمت سرقته حتى لا يستعمل السارق معلوماتك الشخصية من صور وقوائم المكالمات الخ اختر Use Find My iPhone ثم next

18 من الاشياء الجميلة التي قدمتها ابل في ابدعاتها للأيفون خاصية السيري او ما يعرف بالسكريتير الشخصي بك اختر use siri ثم next

19 الان قرر اذا كنت تريد ارسال معلومات الى مركز ابل من اجل تحسين خدمات منتاجتهم ام لا انا اخترت لا ثم اختر next

20 قرر اذا كنت تريد التسجيل مع ابل ام لا ثم next

21 اخر مرحلة اختر البدء في استعمال الايفون

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

22 الان الهاتف يبحث عن اي تحديثات جديدة في الاب ستور

23 اختر اي تحديث تود البدء به ثم اضغط agree ثم Download and Install فور سماعك لصوت سيبدأ عملية التنصيب

24 مرة اخرى مع تحديث اخر نفس العملية agree ثم تحميل ثم install

25 التحميل يتم ...

26 طبعا سيطهر لك نافذة التحديث متوفر اختر OK

27 جد محظوظ ههه مرة اخرى الهاتف سيبحث عن تحدثاث اخرى لا تقلق فهذا الامر ليس دائما ...

28 اختر تحميل وتنصيب

29 مرة اخرى موافق

30 لا تتفاجي مرة اخرى من اي تحديثاث اضغط Continue

31 ومبروك عليك

انتهينتا وبحمد الله

قالب facesocial v0.1 بنسخته العربية

noreply@blogger.com (soufian) — Fri, 9 Sep 2011 13:14:00 GMT

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

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

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

صورة للقالب

معلومات عن القالب :

مصمم القالب : سفيان القمصاوي " مؤسس علمني"

تكويد القالب : سفيان القمصاوي

القالب تحت ترخيص : GPL

بتاريخ : 25/08/2011

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

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

اضافة هاك تعليقات الفيسبوك واضافة خاك الفيس بوك

عرض للمقالات بشكل مميز

والمزيد ......

للتعديل على القالب :
منطقة الناف بار:
إبحث عن الكود التالي

<div class='menu-primary-container' id='submenu'>
<ul>
<li><a expr:href='data:blog.homepageUrl' id='homeButton'>Home</a></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/p/about-us.html'>About Us</a></span></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/contact-us.html'>Contact Us</a></span></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/'>3alymni</a></span></li>
</ul>

منطقة اللوغو :

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

<h1 class='logo'><a expr:href='data:blog.homepageUrl'><img src='your-logo-here'/></a></h1>

منطقة البلوغ ستوري:

اضف هذا الكود الى الاداة الوسطية في القالب :

<table cellspacing="0" cellpadding="0" id="blog_stories" class="uiGrid mvm"><tbody><tr><td class="vTop"><div class="blog_story_image"><a href="/here-likn-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-likn-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td><td class="vTop"><div class="blog_story_image"><a href="/here-likn-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-likn-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td><td class="vTop"><div class="blog_story_image"><a href="/here-link-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-link-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td></tr></tbody></table>

منطقة الاعلانات

<center>
<a title="ads" height="111" target="blank" href="http://www.3alymni.info" width="125"><img height="125" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS5UJL-Fa363pRuVODDjVV-XS_Fyc9YqZjZR1NoV6inMkSE7G87T0jFIvXqEQVFf9fuXDILgxwHDtgBpdkRfR5mREDtj6WHwvJv1IskMAr-oj0YkYN1ksBul4YEzlmLeMmdSu_epyf1w8/s1600/ads125.jpg" alt="ads" class="rsociales-sobre" /></a>
<a title="ads" height="111" target="blank" href="http://www.3alymni.info" width="64"><img height="125" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS5UJL-Fa363pRuVODDjVV-XS_Fyc9YqZjZR1NoV6inMkSE7G87T0jFIvXqEQVFf9fuXDILgxwHDtgBpdkRfR5mREDtj6WHwvJv1IskMAr-oj0YkYN1ksBul4YEzlmLeMmdSu_epyf1w8/s1600/ads125.jpg" alt="ads" class="rsociales-sobre" /></a>
<a title="ads" height="111" target="blank" href="http://www.3alymni.info" width="125"><img height="125" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS5UJL-Fa363pRuVODDjVV-XS_Fyc9YqZjZR1NoV6inMkSE7G87T0jFIvXqEQVFf9fuXDILgxwHDtgBpdkRfR5mREDtj6WHwvJv1IskMAr-oj0YkYN1ksBul4YEzlmLeMmdSu_epyf1w8/s1600/ads125.jpg" alt="ads" class="rsociales-sobre" /></a>
<a title="ads" height="111" target="blank" href="http://www.3alymni.info" width="64"><img height="125" width="125" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS5UJL-Fa363pRuVODDjVV-XS_Fyc9YqZjZR1NoV6inMkSE7G87T0jFIvXqEQVFf9fuXDILgxwHDtgBpdkRfR5mREDtj6WHwvJv1IskMAr-oj0YkYN1ksBul4YEzlmLeMmdSu_epyf1w8/s1600/ads125.jpg" alt="ads" class="rsociales-sobre" /></a>
</center>

(إضغط على صورة لتظهر بشكل اكبر)

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

facesocial v0.1 blogger template

noreply@blogger.com (soufian) — Thu, 8 Sep 2011 16:34:00 GMT

After an absence for a long time for my blog Today I back and with my a very pleasant surprise for all visitors of 3alymni-blog.
Today we announce the official launch of the facesocial templat v0.1 for Blogger platform.

more information about it :
Designer: soufian elkamsaoui "owner of 3alymni "
coding : soufian elkamsaoui
date : 25/08/2011
friendly seo template
facebook comment box
facebox hack
and more ..............

How to modify the tempalte
nav-bar section:
search in the template this code:

<div class='menu-primary-container' id='submenu'>
<ul>
<li><a expr:href='data:blog.homepageUrl' id='homeButton'>Home</a></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/p/about-us.html'>About Us</a></span></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/contact-us.html'>Contact Us</a></span></li>
<li class='page_item'><span class='menu_bg'><a href='http://yourblog.blogspot.com/'>3alymni</a></span></li>
</ul>

logo section:

search in the template this code:

<h1 class='logo'><a expr:href='data:blog.homepageUrl'><img src='your-logo-here'/></a></h1>

blog story section:

search in the template this code:

<table cellspacing="0" cellpadding="0" id="blog_stories" class="uiGrid mvm"><tbody><tr><td class="vTop"><div class="blog_story_image"><a href="/here-likn-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-likn-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td><td class="vTop"><div class="blog_story_image"><a href="/here-likn-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-likn-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td><td class="vTop"><div class="blog_story_image"><a href="/here-link-of-post"><img alt="" src="here-post-pic" class="img"></a><h2><a href="/here-link-of-post" class="uiLinkSubtle">here-post-title</a></h2></div></td></tr></tbody></table>

(click in img to see them on large)

The End
for more information plz contact my: forum161@htomail.com or @os161 "twitter"

تنويه: النسخة العربية من القالب ستنزل في الايام القادمة

أول قالب رمضاني من تصميم مدونة علمني

noreply@blogger.com (soufian) — Mon, 1 Aug 2011 18:38:00 GMT

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

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

معلومات القالب :

مصمم القالب : سفيان المغربي

تكويد التصميم : www.3alymni.info and www.ar-bl.net

صورة للقالب :

(اضغط على الصورة لتظهر بشكلها الطبيعي)

تم بحمد الله

هل ازعجك الشكل الجديد لمحادثة فيسبوك ؟ عندنا الحل

noreply@blogger.com (soufian) — Thu, 28 Jul 2011 19:30:00 +0100

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

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

اليوم بحول الله سنشرح طريقة سهلة وفعالة للإنتهاء من هذا الاشكال

للنتتبع الخطوات التالية :

اولا قم بزيارة الموقع التالي :

https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/

ثاينا اضغط على زر الاضافة الى فايرفوكس :

ننتظر انتهاء التحميل ثم نضغط تنصيب :

بعد الانتهاء من التنصيب تغلق المتصفح ثم نفتحه مرة اخرى

بعد ذلك نتوجه الى الموقع لتالي :

http://userscripts.org/scripts/show/107159

نضغط على تنصيب :

ثم نضغط على تنصيب مرة اخرى في النافذة التالية

بعد ذلك ادخل الى صفحتك على الفيسبوك وإضغط على زر f5

والنتيجة :

تم بحمد الله

قالب كريسميس معرب

noreply@blogger.com (soufian) — Fri, 15 Jul 2011 15:18:00 +0100

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

اليوم نعرض لزوارنا الكرام تعريبا للقالب المميز كريسميس قالب هادئ التصميم وانيق وجد جداب
نبذة عن القالب :

مصمم القالب :

محول ال القالب : --------------

معرب القالب : Soufian elmagribi

المنصة التشغيلية :blogger

تاريخ الاصدار: نونبر 2011

رخصة القالب : Creative Commons Attribution 3.0

لنستعرض اهم مميزات القالب :

ازرار المشاركة بالشبكات الاجتماعية

عرض للمقالات بشكل مميز

ترقيم للصفحات

مناطق مميز للإعلانات وبانرات 125x125

والكثير .....

تنويه : عند تحميل ملف القالب ستجد ملف بصيغة psd الملف يحتوي على صورة الهيدر يمكنك التعديل عليها كما شئت

تم بحمد الله

شروط الأستخدام"
1- عدم نزع حقوق التعريب أو التصميم .
2- ذكر المصدر عند نقل مقال القالب
إن كان هناك أي مشاكل بالقوالب فأرجو إرسالها على بريدي الألكتروني

في نهاية الموضوع أشكركم و أتمنى منكم متابعة جديدي دائماً

المنصة الجديد متاحة للجميع على مسودة بلوجر

noreply@blogger.com (soufian) — Fri, 8 Jul 2011 12:00:00 +0100

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

قبل مدة كان فريق بلوجر قد اعلن عن تحديث الشامل لمنصة بلوجر واعادة صياغة البرنامج من الصفر.

ومنذ ايام تم فتح المنصة الجديدة لعدد قليل حتى يتم تجربها من طرفهم لكن اليوم اعلن الفريق المسؤول عن تطوير المنصة بفتح المنصة الجدية لجميع المدونين بدون أسثناء على مسودة بلوجر draft blogge.

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

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

صورة لتصميم الجديد

(اضغط على الصورة لتظهر بحجمها الحقيقي)

يتبع ......

اضف زر facebook send boutton بشكل صحيح

noreply@blogger.com (soufian) — Thu, 7 Jul 2011 17:21:00 +0100

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

من اليوم فصاعدا لن تواجهو مشاكل بنسبة الى زر facebook send

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

والان لنبدا على بركة الله

أولا ابحدث عن هذا السطر

xmlns:expr='http://www.google.com/2005/gml/expr'>

ثم اضف اليه هذا السطر :

xmlns:fb='http://www.facebook.com/2008/fbml'

ليصبح هكذا :

<html ...... xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'>

ثم ابحث هن الوسم التالي :

<body>

بعد الوسوم اعلاه نضيف

<div id='fb-root'/>
<script>
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js#xfbml=1';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>

ثم نصل الى تحديد ماكن تموضع الزر يمكننا وضعه في اي مكان مثلا :

نبحث عن :

<data:post.body/>

مباشرة بعد هذا السطر نضيف :

<b:if cond='data:blog.pageType != "static_page"'>
<div class='fb-like'>
<fb:send expr:href="data:post.url" font="arial"></fb:send>
</div>
</b:if>

تحديث :

لمن ارد تغيير لون الاضافة الى الاسود يستعمل الكود الموالي :

<b:if cond='data:blog.pageType != "static_page"'><div class='fb-like'>
<fb:send expr:href="data:post.url" font="arial" colorscheme="dark"> </fb:send>
</div>
</b:if>

تم بحمد الله

الان أضف صندوق الاعجاب بتصميم جديد معدل

noreply@blogger.com (soufian) — Wed, 6 Jul 2011 15:41:00 +0100

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

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

الان لنبدأ على بركة الله

أولا نبحث عن السطر التالي ثم نلصق كود css فوقه

]]></b:skin>

كود css

/* ------ Custom Like Box ----- */

    .fan_box a:hover{
      text-decoration: none;
    }


    .fan_box .full_widget{
      height: 200px;
      border: 0 !important;
      background: none !important;
      position: relative;
    }


    .fan_box .connect_top{
      background: none !important;
      padding: 0 !important;
    }


    .fan_box .profileimage, .fan_box .name_block{
      display: none;
    }


    .fan_box .connect_action{
      padding: 0 !important;
    }


    .fan_box .connections{
      padding: 4px !important;
      margin:3px 0px 5px 0px!important;
      border: 0 !important;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 11px;
      font-weight: bold;
      color: #666;
    }


    span.total{
      color: #365899;
      font-weight: bold;
      background:#ECEEF5;
      padding:4px !important;
      margin:3px 0px 5px 0px!important;
      border:1px solid #E1E4ED;
     -moz-border-radius:3px;
     -webkit-border-radius:3px;
    }

span.total:hover{
     border:1px solid #6383C1;
    }

    .fan_box .connections .connections_grid {
      padding-top: 10px !important;
    }


    .fan_box .connections_grid .grid_item{
      padding: 0 10px 10px 0 !important;
    }


    .fan_box .connections_grid .grid_item .name{
      font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
      font-weight: normal;
      color: #289728 !important;
      padding-top: 1px !important;
    }


    .fan_box .connect_widget{
    position: absolute;
    bottom: 0;
    left: 0px;
    margin: 0 !important;
    }


    .fan_box .connect_widget .connect_widget_interactive_area {
    margin: 0 !important;
    }


    .fan_box .connect_widget td.connect_widget_vertical_center {
    padding: 0 !important;
    }


    /*--------------- Custom Like Box End--------------*/

في حالة اردت تغيير لون اسم البروفايل من اللون الاخضر الى اي لون تريد غير الكود التالي : 289728

الان يمكنك وضعه الصندوق اي شئت في القالب او عن طريق اضافة أداة بوضع الكود الموالي :

<style>
        #mbtlikebox{
          color: #365899;
          font: bold 11px arial;
          background:#ECEEF5;
          padding:3px !important;
          margin:5px 0px!important;
          border:1px solid #E1E4ED;
         -moz-border-radius:3px;
         -webkit-border-radius:3px;
          width:290px;
        }

    #mbtlikebox:hover{
         border:1px solid #6383C1;
        }
    </style>
    <script type="text/javascript" src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php/en_US"></script>
        <script type="text/javascript">FB.init("");</script>
        <fb:fan profile_id="128605887189860" stream="0" connections="8" width="300px" height="200px" header="0" logobar="0"   css="https://sites.google.com/site/3alymni/css/3.css"></fb:fan>
    <div id="mbtlikebox"><a rel="nofollow" target="_blank" style="text-decoration:none; color:#365899;" href="ضع هنا رابط الصفحة">Visit the Like Page »</a></div>

== غيره برقم id الخاص بصفحتك

== عرض الصندوق

== طول الصندوق

== رابط الصفحة

والان استمتع بالتصميم الجديد لصنوق الاعجاب الخاص بصفحتك وكما يمكنك التعديل عليه ايضا عبر التعديل على كود css

تم بحمد الله

قالب globe design معرب

noreply@blogger.com (soufian) — Mon, 27 Jun 2011 13:54:00 +0100

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

اليوم نعرض لزوارنا الكرام تعريبا للقالب المميز: globe design

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

ازرار المشاركة بالشبكات الاجتماعية

عرض للمقالات بشكل مميز

ترقيم للصفحات

مناطق مميز للإعلانات
هاك نبذة عن المدون
هاك ترقيم التعليقات
والكثير ....
اي استفسار عن القالب نحن في الخدمة

"شروط الأستخدام"
1- عدم نزع حقوق التعريب أو التصميم .
2- ذكر المصدر عند نقل مقال القالب
إن كان هناك أي مشاكل بالقوالب فأرجو إرسالها على بريدي الألكتروني

في نهاية الموضوع أشكركم و أتمنى منكم متابعة جديدي دائماً

تم بحمد الله

كيفية اضافة هاك colorbox الى بلوجر

noreply@blogger.com (soufian) — Sun, 26 Jun 2011 13:11:00 +0100

بعد انقضاء فترة الامتحانات اعود الى مدونتي واعود اليكم احبائي الكرام ان شاء الله الايام القادمة حاملة لعديد من المفاجات التي نود عبرها بارضاء زوارنا وتقديم الافضل لهم

اما اليوم فسيكون لنا موعد مع درس : "كيفية اضافة هاك colorbox الى منصة بلوجر "

طبعا تعددت الهاكات المتخصصة في عرض الصور كإطار منبثق وطبعا كل واحدة لها مميزاتها الخاص

ما يميز colorbox هو تعدد مهاهمها من عرض الصور الى عرض الفيديو الى عرض الفلاشات الخ ......

لنبدأ على بركة الله :

مثال حي :

اولا نضيف نص javascript قبل نهاية وسوم </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://sites.google.com/site/3alymni/colorbox/jquery.colorbox.js"></script>

ثم نضيف نص css قبل نهاية وسوم

]]></b:skin>

<style type='text/CSS'>



#colorbox, #cboxOverlay, #cboxWrapper {

position:absolute;

top:0;

left:0;

z-index:9999;

overflow:hidden;

}

#cboxOverlay {

position:fixed;

width:100%;

height:100%;

}

#cboxMiddleLeft, #cboxBottomLeft {

clear:left;

}

#cboxContent {

position:relative;

}

#cboxLoadedContent {

overflow:auto;

}

#cboxTitle {

margin:0;

}

#cboxLoadingOverlay, #cboxLoadingGraphic {

position:absolute;

top:0;

left:0;

width:100%;

}

#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {

cursor:pointer;

}

.cboxPhoto {

float:left;

margin:auto;

border:0;

display:block;

}

.cboxIframe {

width:100%;

height:100%;

display:block;

border:0;

}



#cboxOverlay {

background:#000;

}

#colorbox{}

#cboxTopLeft {

width:14px;

height:14px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) no-repeat 0 0;

}

#cboxTopCenter {

height:14px;

background:url(https://sites.google.com/site/fowziey/colorbox_border.png) repeat-x top left;

}

#cboxTopRight {

width:14px;

height:14px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) no-repeat -36px 0;

}

#cboxBottomLeft {

width:14px;

height:43px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) no-repeat 0 -32px;

}

#cboxBottomCenter {

height:43px;

background:url(https://sites.google.com/site/fowziey/colorbox_border.png) repeat-x bottom left;

}

#cboxBottomRight {

width:14px;

height:43px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) no-repeat -36px -32px;

}

#cboxMiddleLeft {width:14px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) repeat-y -175px 0;

}

#cboxMiddleRight {

width:14px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) repeat-y -211px 0;

}

#cboxContent {

background:#fff;

overflow:visible;

}

#cboxLoadedContent {

margin-bottom:5px;

}

#cboxLoadingOverlay {

background:url(https://sites.google.com/site/fowziey/colorbox_loading_background.png) no-repeat center center;

}

#cboxLoadingGraphic {

background:url(https://sites.google.com/site/fowziey/colorbox_loading.gif) no-repeat center center;

}

#cboxTitle {

position:absolute;

bottom:-25px;

left:0;

text-align:center;

width:100%;

font-weight:bold;

color:#7C7C7C;

}

#cboxCurrent {

position:absolute;

bottom:-25px;

left:58px;

font-weight:bold;

color:#7C7C7C;

}



#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow {

position:absolute;

bottom:-29px;

background:url(https://sites.google.com/site/fowziey/colorbox_controls.png) no-repeat 0px 0px;

width:23px;

height:23px;

text-indent:-9999px;

}

#cboxPrevious {

left:0px;

background-position: -51px -25px;

}

#cboxPrevious.hover {

background-position:-51px 0px;

}

#cboxNext {

left:27px;

background-position:-75px -25px;

}

#cboxNext.hover {

background-position:-75px 0px;

}

#cboxClose {

right:0;

background-position:-100px -25px;

}

#cboxClose.hover {

background-position:-100px 0px;

}



.cboxSlideshow_on #cboxSlideshow {

background-position:-125px 0px;

right:27px;

}

.cboxSlideshow_on #cboxSlideshow.hover {

background-position:-150px 0px;

}

.cboxSlideshow_off #cboxSlideshow {

background-position:-150px -25px;

right:27px;

}

.cboxSlideshow_off #cboxSlideshow.hover {

background-position:-125px 0px;

}

</style>

ثم نضيف بعض من حركات الجي كوري

<script type='text/javascript'>

//<![CDATA[



$(document).ready(function(){



$("a.color-elastic").colorbox();

$("a.color-fade").colorbox({transition:"fade"});

$("a.color-slideshow").colorbox({slideshow:true});

$(".color").colorbox();

$(".color-video").colorbox({iframe:true, innerWidth:425, innerHeight:344});

$(".color-iframe").colorbox({width:"80%", height:"80%", iframe:true});

$(".color-inline").colorbox({width:"50%", inline:true, href:"#Description"});



$("#click").click(function(){ 

$('#click').css({"background-color":"#f00", "color":"#fff", 
"cursor":"inherit"}).text("Open this window again and this message will 
still be here.");

return false;

});

});



//]]>

</script>

كيفية الاستعمال :

عند كتابة احدى المقالات نتجه الى المحرر ونضع المحرر تحت وضع edit html

لصورة واحدة :

<a class='color' href="رابط" title="تعليق لصورة"><img border='0' height='90' width='120' src="رابط الصورة"/></a>

لمعرض صور

<a class="color-elastic" href="رابط 1" rel="GALLERYTITLE" title="تعليق لصورة"><img border="0" height="90" src="رابط الصورة" width="120" /></a>
<a class="color-elastic" href="رابط2" rel="GALLERYTITLE" title="تعليق لصورة"><img border="0" height="90" src="رابط الصورة" width="120" /></a>

عارض السلايد شو

<a class="color-slideshow" href="IMAGE_01 URL" rel="GALLERYTITLE" title="IMAGE_01 CAPTION"><img border="0" height="90" src="IMAGE_01 URL" width="120" /></a>
<a class="color-slideshow" href="IMAGE_02 URL" rel="GALLERYTITLE" title="IMAGE_02 CAPTION"><img border="0" height="90" src="IMAGE_02 URL" width="120" /></a>
<a class="color-slideshow" href="IMAGE_03 URL" rel="GALLERYTITLE" title="IMAGE_03 CAPTION"><img border="0" height="90" src="IMAGE_03 URL" width="120" /></a>

لعرض الفيديو من اليوتيوب

<!--For Youtube-->
<a class='color-video' 
href="YOUTUBE EMBED CODE URL" title="VIDEO TITLE"><img border='0' 
height='90' width='120' src="YOUTUBE LOGO URL"/></a>

<!--Same for Vimeo-->
<a class='color-video' 
href="VIMEO EMBED CODE URL" title="VIDEO TITLE"><img border='0' 
height='90' width='120' src="VIMEO LOGO URL"/></a>

<!--OR use simple link-->
<a class='color-video' href="YOUTUBE/VIMEO EMBED CODE URL" title="VIDEO TITLE">WATCH THE VIDEO</a>

اضف الان تعليق الى الصور بالــcss3 وبدون اوامر javascript

noreply@blogger.com (soufian) — Sun, 22 May 2011 14:16:00 +0100

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

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

مثال حي :

ضع هنا التعليق
وضف الصورة هنا.

لمستخدمي منصة بلوجر :

اتجه صوب Edit HTML ثم ابحث عن

]]></b:skin>

الان ضف كود css التالي فوق الوسم اعلاه

/* Post images with CSS animated captions */

#post-image {
}

#figure {
position:relative;
float:left;
margin:10px;
overflow:hidden;
padding: 1px;
}

#figure:hover {
-moz-box-shadow:0 0 20px rgba(0,0,0,0.75);
-webkit-box-shadow:0 0 20px rgba(0,0,0,0.75);
box-shadow:0 0 20px rgba(0,0,0,0.75);
}

#figure .caption {
position:absolute;
bottom:0;
left:0;
opacity: 0.75;
margin-bottom:-115px;
-webkit-transition: margin-bottom;
-webkit-transition-duration: 400ms;
-webkit-transition-timing-function: ease-out;
-moz-transition-property: margin-bottom;
-moz-transition-duration: 400ms;
-moz-transition-timing-function: ease-out;
-o-transition-property: margin-bottom;
-o-transition-duration: 400ms;
transition: margin-bottom;
transition-duration: 400ms;
transition-timing-function: ease-out;
}

#figure:hover .caption {
margin-bottom:0px;
}

#post-image .caption {
width:100%;
height:90px;
padding:10px;
background:#111;
color:#fff;
font-family: Arial, Helvetica, sans-serif;
}

#post-image .caption b {
text-shadow: 0px 2px 0px #000;
}
#post-image .caption {
color: #ddd;
line-height: 24px;
font-size: 14px;
text-shadow: 0px 2px 0px #000;
}

الان اتجه الى المحرر وغيره الى وضعية HTML mode

وضع هذا الكود الموالي :

<div id="post-image">
 <div id='figure'>
 <img src="هنا ضع رابط الصورة"/>
 <span class='caption'>
 <b>ضع هنا التعليق</b>
وضف الصورة هنا.
 </span>
 </div>
</div>

لمستخدمي الوردبريس اتجه نحو Appearance > Editor > Stylesheet

انسخ كود css والصقه في ملف style.css

ثم احفظ

تحديثات واصلاحات جديدة لمنصة بلوجر

noreply@blogger.com (soufian) — Fri, 6 May 2011 16:51:00 +0100

بدأنا نشتم نسيم التغيير في منصة بلوجر
من الان فصاعدا اصحبت ميزة Geotagging اي تحديد الموقع الجغرافي متاحة لجميع المدونين العاملين على منصة بلوجر

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

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

ثم تحدد المكان عبر البحث عنه ثم اضغط حفظ :

كما اشرت الميزة تعتمد على خرائط غوغل يمكنك عمل زوم للخريط الخ

لتظهر كتالي :

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

ولمن اراد اضافتها الى قالب غير مدعوم من بلوجر :

ابحث عن السطر التالي :

<div class='post-footer-line post-footer-line-3'>

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

<span class='post-location'>
        <b:if cond='data:top.showLocation'>
          <b:if cond='data:post.location'>
            <data:postLocationLabel/>
            <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
          </b:if>
        </b:if>
      </span>

ايضا تم تحديث واجهة رفع الصور والفيديو كما تم ترقيع بعض المشاكل التي كانت تحدث اثناء رفع الصور :

(اضغط على الصورة حتى تشاهدها بحجمها الاصلي)

قالب infrared معرب

noreply@blogger.com (soufian) — Mon, 18 Apr 2011 21:20:00 +0100

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

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

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

اليوم نعرض لزوارنا الكرام تعريبا للقالب المميز انفراريد قالب المتألق بتصميمه الجذاب وتقنايته الرائعة

نبذة عن القالب :

مصمم القالب :

محول ال القالب : Lasantha Bandara

معرب القالب : Soufian elmagribi

المنصة التشغيلية :blogger

تاريخ الاصدار: نونبر 2010

رخصة القالب : Creative Commons Attribution 3.0

لنستعرض اهم مميزات القالب :

عارض الشرائح او ما يعرف بسلايدشو

ازرار المشاركة بالشبكات الاجتماعية

عرض للمقالات بشكل مميز

ترقيم للصفحات

مناطق مميز للإعلانات

والكثير .....

نأتي الان الى كيفية تعديل القالب :

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

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>

لتعديل الفافإيكون

<link href='YOUR-FAVICON-URL' rel='shortcut icon' type='image/vnd.microso

لتعديل السلايد شو :

<div id='feature-56'>
<div class='inpost'>
<h3>ضع هنا عنوان المقالة</h3>
<p>وضف مختصر لها </p>
</div>
<a href='رابط المقالة'>
<img class='sidim' src='رابط الصورة'/>
</a>
</div>

لتعديل ازارار المشاركة بالاجتماعية :

<div class='feedlist'>
<ul>

<li><a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;'><img alt='RSS' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiL83Q3QOAwa9vokkx12PQ-urHvN1zNWRm3G3BLDQrxkJJwPpXi1pB2bwAuiMUpxj_RWzEbPP6u9jX3bZrTD5OzOLgJMkA0Xv_krOKD2o_4LGWBV7b-2N6Rxi-wnibQZ448hfQFVwEysWU/s1600/rss.png' title='subscribe'/></a></li>

<li><a href='http://www.delicious.com/USERNAME'><img alt='Delicious' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXv8mNXZGy4qj6nSXB25NCXsAKuyOqKw0ZdP0Y1LEtPBE2MFUKL8k6GdR045KVNwaRbdWIK-K91wDYvx9T36QmsVlS6t62LnGjWzMX6aXE_tvSpPpc_rU54owvTEt_rzucsqMBCV1snw8/s1600/delicious.png' title='Delicious'/></a> </li>

<li><a href='http://digg.com/USERNAME'><img alt='Digg' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQnhl6MAGpLiiZB8sxFSTA3duo501KiO0JMQmwEUh2AOCTbC5hnqU-3204sV5yL6QAVsOnoKFcvB7z9yWj8TrUXic-TI9ESrio9EFaLKEXlHUdDiudjH-nhQ917j_nPHSUDasV5vvUf9o/s1600/digg.png' title='Digg'/></a></li>

<li><a href='http://www.facebook.com/'><img alt='Facebook' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5bARhisp9LbSUuLr7K2UYYNBVqwZATLl7PjTUGLrui7no9ESNpjctw5zSSMSVlE-WB10FWCdm0-M5dk__UM3U0hZTXNSqDGCHAA4g8ccf7XYxf8xAXRbbxEKbAqvz77j6LPQh6KbPEEY/s1600/facebook.png' title='Facebook'/></a></li> 

<li><a href='http://twitter.com/username'><img alt='Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUyS6in0bluipNl1vhFOrzXxEhhNisTfR_fc0j8UfMUTS8CFoyDqFx38Qs5MijzeyEx8nqLzm6IUbVnXSDqtLksfrHV0LEIhjaBeFwsXEWr_-5P3YnTpizziplR55f0N7y4cndpS6eS-I/s1600/twitter.png' title='Twitter'/></a></li> 

<li><a href='Linkedin-Profile-URL'><img alt='Linkedin' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWf7p04hgaIYEHAxubazqjETER-mciVIdDa6fHR3F-Vv4rCYd641Eet8kZAFbi2BgxYMjRz4EcLBZ3WP88Lick_9YmEqSxihpdH7FO9aMfk-UJwpVE9R0kjgtsgUTzGyB1OpyRzIpD12M/s1600/linkedin.png' title='Linkedin'/></a></li>

<li><a href='http://www.youtube.com/user/USERNAME'><img alt='Youtube' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBcVwELTEaj2iOG1-EHtYJ4xtrTXJaBZq7wVJ_ufKHQqzBrwEhLLIlxxq9FrA0lrZxEp__CVGA4nZayUCMs4uVVUjP4LdFPG6u7mEtWXgEtW0rExx3W7xJ0xMBqqP91e9JQ-KOMwwGE4I/s1600/youtube.png' title='Youtube'/></a></li> 

 
</ul>
</div><br/>

تم بحمد الله

قالب businesslead معرب

noreply@blogger.com (soufian) — Sun, 17 Apr 2011 15:08:00 +0100

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

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

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>

لتعديل الفافإيكون

<link href='YOUR-FAVICON-URL' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

لتعديل الاضافات المبوبة :

<ul class='tabs-widget tabs-widget-widget-themater_tabs-1432447472-id'>
<li><a href='#widget-themater_tabs-1432447472-id1'>الاخيرة</a></li>
<li><a href='#widget-themater_tabs-1432447472-id2'>التسميات</a></li>
<li><a href='#widget-themater_tabs-1432447472-id3'>الارشيف</a></li>
</ul>

تم بحمد الله

كيفية اضافة like box بخصائص css

noreply@blogger.com (soufian) — Sat, 16 Apr 2011 16:44:00 +0100

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

بحول الله سنتطرق الى كبفبة اضافة صندوق like box بخصائص css الى منصة بلوجر

وهذه صورة للاضافة :

اول شيئ نتجه صوب : Design > Edit HTML

ثم نوسع القالب عبر الضغط على زر “Expand Widget Templates"

ثم نبحث عن

]]></b:skin>

ثم نضيف كود css التالي :

.fb_like_box {
margin-top:10px;
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background-color:#3B5999;
border:3px solid #2B2B2B;
margin-bottom:10px;
padding:10px 7px;
width:540px;
}
.fb_like_top {
overflow:visible;
padding:0;margin:0 0 5px;
width:349px;
height:24px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgedeJ2VnB7kU7qk93mIh5vVS4tJLz1I0MvMpuGPXf_XBOQchx7ypCv5Vn9s-x9GQVpahU2UNaUXcCutZpWe1LtEIw_us-yQOEmNQxHc4FxoBl-nXpl8BP_-G-fi64XCZE9yz8DnRWmXb8/") no-repeat scroll left top transparent;
}
.fb_like_top a {
height:24px;
width:114px;
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUIMtZYAFZ7aH0I2XbWqmsRZBN-nHtmmzCIP91P1Aeivg-BwoED2Rk9GAOt_K9jflGjVazkT26UDIwdynSi09eqFVYR1S2FZraNWnFa72MchF-DnKyr03ERAM9Q2R-MyoVwEMMK3nRQA/") no-repeat scroll left top transparent;
display:block;
margin-left:425px;
text-indent:-5000px;
}.fb_like_button_holder {
-moz-border-radius:10px 10px 10px 10px;
border-radius:10px;
background:none repeat scroll 0 0 #FFFFFF;
padding:12px 12px 0 12px;
width:515px;
height:42px;
}

ثم نبحث عن :

<data:post.body/>

ونضيف كود html التالي :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='fb_like_box'>
<div class='fb_like_top'><a rel='nofollow' href='http://www.facebook.com/pages/3alymni/128605887189860'>Be a Fan</a></div>
<div class='fb_like_button_holder'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px;height:30px;'/>
</div>
</div>
</b:if>

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

تم بحمد الله

قالب snatch معرب

noreply@blogger.com (soufian) — Sun, 10 Apr 2011 19:26:00 +0100

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

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

<meta content='DESCRIPTION HERE' name='description'/>
<meta content='KEYWORDS HERE' name='keywords'/>

لتعديل الفافإيكون

<link href='YOUR-FAVICON-URL' rel='shortcut icon' type='image/vnd.microsoft.icon'/>

لتعديل الاضافات المبوبة :

<ul class='tabs-widget tabs-widget-widget-themater_tabs-1432447472-id'>
<li><a href='#widget-themater_tabs-1432447472-id1'>فيديو</a></li>
<li><a href='#widget-themater_tabs-1432447472-id2'>التسميات</a></li>
<li><a href='#widget-themater_tabs-1432447472-id3'>الارشيف</a></li>
</ul>

تم بحمد الله

قالب Mimoza معرب

noreply@blogger.com (soufian) — Fri, 8 Apr 2011 21:23:00 +0100

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

سنقدم اليوم قالب Mimoza الذي يتميز بتصمميه الجذاب والوانه لمتناسقة

نبذة عن القالب :
اسم القالب: Mimoza

منصة القالب : بلوجر

مصمم القالب :
themepix

صورة القالب :

لتعديل السلايد شو يرجى البحث عن السطر التالي :

<!-- Featured Content Slider Started -->

ثم تغيير :

  "This is featured post X title"

بعنوان المقالة
تم بحمد الله

شروط الأستخدام"
1- عدم نزع حقوق التعريب أو التصميم .
2- ذكر المصدر عند نقل مقال القالب
إن كان هناك أي مشاكل بالقوالب فأرجو إرسالها على بريدي الألكتروني

في نهاية الموضوع أشكركم و أتمنى منكم متابعة جديدي دائماً

قالب blogger newspaper صديق ال seo الان معرب

noreply@blogger.com (soufian) — Wed, 30 Mar 2011 13:09:00 GMT

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

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

اليوم انا سعيد لانني سأطرح اجمل القوالب اللاخبارية "من وجهة نظري " ليس قالب عاديا بل من فئة البروميوم

لنستعرض اهم مميزات القالب ونبذة عنه :

اسم القالب : blogger newspaper

مصمم القالب : رجا "spicytricks"

معرب القالب : مدونة علمني

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

القالب صديق لمحركات البحث

القالب يدعم جميع متصفحات الويب

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

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

صورة للقالب :

الان نصل الى شرح كيفية العمل بالقالب :

اولا يلزمنا محرر انا احب وافضل نوت باد++ "notepad ++"

لتعديل النافبار :

<div id='topnav'>

<div id='catnav'>

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

'Featured'

ويمكنك تعديلها كما تشاء ولكن عند نشرك لمقالة عليك وضع نفس الاسم في التمسية " label "

لعرض الفيديو معرض الصور ابحث عن :

//for Photo Gallery section
Labelname7= &quot;Photo%20Gallery&quot;;

//for Video Gallery section
Labelname8= &quot;Video&quot;;

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

لتعديل باقي اقسام القالب :

LabelTitle1 = &quot;سياسية&quot;;
Labelname1 = &quot;سياسية&quot;;

LabelTitle2 = &quot;اقتصادية&quot;;
Labelname2 = &quot;اقتصادية&quot;;

LabelTitle3 = &quot;اخبار العالم&quot;;
Labelname3 = &quot;اخبار العالم&quot;;

LabelTitle4 = &quot;رياضة&quot;;
Labelname4 = &quot;رياضة&quot;;

LabelTitle5 = &quot;ثقافة&quot;;
Labelname5 = &quot;ثقافة&quot;;

LabelTitle6 = &quot;ثكنولوجي&quot;;
Labelname6 = &quot;ثكنولوجي&quot;;

لتعديل صندوق الاشتراك بالقائمة البريدية

<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=هنا ضع اسم الحساب&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> 
<input name='uri' type='hidden' value='مرحبا بك في نشرتنا البريدية'/> <!-- change With your feedburner ID-->
<input name='loc' type='hidden' value='en_US'/>

لتعديل ازرار المشاركة في الشبكات الاجتماعية

<!-- change With your USER IDs-->
 <a href='http://feeds.feedburner.com/WelcometoSpicytricks' title='Subscribe via RSS Feed'>
 <img align='top' alt='Subscribe via RSS Feed' class='rss-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyvuiCZf-sFeT_bjCxpEaM3f53xSz8FPgXmtoEyei85nR-gHgyxNNcaWKPMBm8ZPO0pOF6saepGX6j9lGA4nr_0BgbY_xPbqKPHo7PETfNcuV8W-ISNoyk4lCINFzq1Vcl5eKclHlv5wU/s1600/feedi.png'/></a>

 <a href='http://www.twitter.com/your-id' rel='external' target='_blank' title='Follow Me on Twitter'><img align='top' alt='Follow Me on Twitter' class='twitter-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSvqEVIf5aerYyn7I7zXA69CtAGftD30L7yQxKZQNcLGKyK3FM9q2aP6lO2E5qeXrbw70vEo_o6nAkewNFQhL6504hog85U4eCV-k_odyNmxeC4GC2dQXB8XpyVFsoHsX9gvxdjj_WZp8/s1600/twitterwe.png'/></a>

 <a href='http://www.facebook.com/your-id' rel='external' target='_blank' title='Connect on Facebook'><img align='top' alt='Connect on Facebook' class='facebook-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3U1QQwgsutizXqPRLDRXGuF-YYf6IUh2MwwFa2iFVHLT2VLWeoLPsbcKEdGi8Em0aWcnvUMCtQwYUBj5Dv77-k2NVjvYi9adi_45iGPd7rqu6V85GhA760e1b0pUcr5uHHy88Y1ztjOo/s1600/facebookvy.png'/></a>

 <a href='http://www.google.com/profiles/your-id' rel='external' target='_blank' title='Connect on Google Buzz'><img align='top' alt='Connect on Google Buzz' class='gbuzz-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFySaK2TS5LmifgVtFa9u8zhOyJLCBL3Q4SQKUC7FhwT8H8T7T7PYbh3OMTI3m0-lVSiESSqOPkNN9GmpphS0aQ8kofvH4AAVmsos_8vlQ5qWF1OhKsXqDeSnrC2luajkWPZl7W78PvDE/s1600/googlebuzzb.png'/></a>

 <a href='http://www.linkedin.com/in/your-id' rel='external' target='_blank' title='Connect on LinkedIn'><img align='top' alt='Connect on LinkedIn' class='linkedin-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXKSkje4Sle2wcUmV0Q44CBX0z-4Lc9PjGslMMzFEWTmHIU68yymkt2KqMYvddrAohBCGaVCdS_hCfwSPnPDUf3bNYNa0NfXIERhRzzdnxICRiuKmo1K5Phr-nUokGMcri0kPLYnHiUGw/s1600/linkedine.png'/></a>

 <a href='http://www.flickr.com/your-id/' rel='external' target='_blank' title='Connect on Flickr'><img align='top' alt='Connect on Flickr' class='flickr-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsZsUtGWGuwogRr8pnG-vCnoQ9IDqywwdZjbUl6yNpfWzb4sFdgJ0lfl8hMSgK6Reqeb3hoNsTAmJ1R29_mQYXTtoE4KXfrqMqu4jqR4A6VsJoEk15vAvZC-qddQUFCJlD1CvhqUhACoo/s1600/flickrd.png'/></a>

 <a href='http://www.youtube.com/user/your-id' rel='external' target='_blank' title='Connect on YouTube'><img align='top' alt='Connect on YouTube' class='youtube-sub' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinxultNAXM8OcrlImCLO1y5mys-4XEQ5ktN3AxKRm7Z4iwUseScYVXF2aAW5R1lRL48zPy4ZLYqElChLZyx3Ll_2zdQSw79XxVtKPpJwRzIjocvlYp7Ci4oGCtgwlm9dulLtMn8GsPhos/s1600/youtubem.png'/></a>
</div>
 </div>
</div>
</b:includable>
</b:widget>
</b:section>
<!-- subscribe box ends-->

سلايدشو جد مميزة بــ css3

noreply@blogger.com (soufian) — Sun, 27 Mar 2011 17:56:00 GMT

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

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

اليوم بحول الله سنقدم حيل من حيل تقنية css3 اللغة القادمة بقوى في مجال تصميم الويب.

كما نعرف لغة css هي اختصار Cascading Style Sheets هي لغة تنسيق لللصفحة تتهتم بشكل وتصميم المواقع، صممت خصيصا لعزل التنسيق(الألوان - الخطوط....) عن محتوى المستند المكتوب(بلغة مثلا html) وينطبق ذلك على الألوان والخطوط والصور والخلفيات التي تستخدم في الصفحات، بمرونة وسهولة تامه.

نعود الان الى موضوعنا

صورة للإضافة :

للمشاهدة الحية :

نأتي الان الى كيفية اضافته سواء لمنصة بلوجر او موقع عادي

نضيف الكود الموالي قبل اغلاق وسم head tag

<!-- http://www.3alymni.info -->
<style> 
  .slide-up-boxes a { 
   display: block; 
   margin: 0 0 20px 0; 
   background: rgba(215, 215, 215, 0.5); 
   border: 1px solid #ccc; 
   height: 85px; 
   overflow: hidden; 
  }
  
  .slide-up-boxes h5 { 
   color: #333; 
   text-align: center;
   height: 65px; 
   font: italic 18px/65px Georgia, Serif;    /* Vertically center text by making line height equal to height */
    opacity: 1;
    -webkit-transition: all 0.2s linear; 
    -moz-transition: all 0.2s linear; 
    -o-transition: all 0.2s linear;
  }
  
  .slide-up-boxes a:hover h5 { 
   margin-top: -65px; 
   opacity: 0; 
  }
  
  .slide-up-boxes div { 
   position: relative; 
   color: white; 
   font: 12px/15px Georgia, Serif;
   height: 65px; 
   padding: 10px; 
   opacity: 0; 
   -webkit-transform: rotate(6deg); 
   -webkit-transition: all 0.4s linear; 
   -moz-transform: rotate(6deg); 
   -moz-transition: all 0.4s linear; 
   -o-transform: rotate(6deg); 
   -o-transition: all 0.4s linear; 
  }
  .slide-up-boxes a:hover div { 
   opacity: 1; 
   -webkit-transform: rotate(0); 
   -moz-transform: rotate(0); 
   -o-transform: rotate(0); 
  }
  .slide-up-boxes a:nth-child(1) div { background: #c73b1b url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhB255pYKzY4f2ZzUvXH9TuJ2UfDOpe-KftQSDp3dRo79ht2RkL10kAndFFotk2TMwtzNUhMU5OxQIfQpELYMjN4-4oV6IAF3CHw-TN0nf_oIsOWauCc2WI81rv9TQg6GLAUrU1YWVgUFmx/s1600/wufoo.png) 17px 17px no-repeat; padding-left: 120px; }
  .slide-up-boxes a:nth-child(2) div { background: #367db2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjH9a0UEzMAH-F9CRw_xo1GaPkaf6TOOREOuCrcEHnK3ukEtWSmCLGOAaIm7SkVyUYru4f3KIxOQobrOA-FPqs8hFSAtuPQsyz1n9I9RuELSS8u4a94yVV2cbJYm29AwLiAu1cMQ3Of3uGA/s1600/diw.png) 21px 10px no-repeat; padding-left: 90px; }
  .slide-up-boxes a:nth-child(3) div { background: #393838 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEir-qZQK2srMeE0UfP73tnmh81ROk81YADkgHMG-hoNbiUmByadK0aJqAOB6r-l2c9oJIi6kx8eD7l3p5n6luApDaq5ePcnGW9CzR8GcDTO4gx0DNTd-vATxOEolAShzuLTyk5G1OmibRhY/s1600/qod.png) 14px 16px no-repeat; padding-left: 133px; }
 </style>
<!-- http://www.3alymni.info -->

ثم نضيف الكود التالي في اي مكان نحدده تصميم الموقع حسب حجياتنا

<!-- http://www.3alymni.info -->
<div id="page-wrap"> 
 
  <section class="slide-up-boxes"> 
 
   <a href="http://********.com"> 
    <h5>هنا العنوان </h5> 
    <div>Wufoo is an online form builder that makes building even the most complex forms so easy, it's fun!</div>    
   </a> 
    
   <a href="http://********.com"> 
    <h5>هنا العنوان</h5> 
    <div>Digging Into WordPress is a book and blog I co-author with Jeff Starr about the world's #1 publishing platform.</div>    
   </a> 
   
   <a href="http://**********.com"> 
    <h5>هنا العنوان</h5> 
    <div>Quotes on Design is a collection of design related quotes. With an API for your integration ideas!</div>    
   </a> 
 
  </section> 
   
 </div>

<!-- http://www.3alymni.info -->

تم بحمد الله

رسميا أداة الاشتراك بالنشرة البريدية من بلوجر

noreply@blogger.com (soufian) — Sat, 26 Mar 2011 13:31:00 GMT

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

Follow by Emai اي تابعني عبر الايمبل وهي اداة تمكن المستخدم من التسجيل في القائمة البريدية للمدونتك حتى يصله كل تحديث الى بريده

لتفعيل الأداة توجه الى Design | Page Elements

ثم اضف Add a Gadget ثم Follow by Email

ثم اضغط حفظ

الشكل النهائي

Blogger Buzz: Engage your audience with Follow by Email

قالب Eureka نسائي ومعرب

noreply@blogger.com (soufian) — Fri, 18 Mar 2011 16:07:00 GMT

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

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

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

اسم القالب : Eureka

صدر في : 16 مارس 2011

مصمم القالب : New WP Themes

مطور القالب لمنصة بلوجر : Lasantha Bandara

معرب القالب : مدونة علمني

صورة للقالب :

لتعديل السلايد شو يرجى البحث عن السطر التالي :

<!-- Featured Content Slider Started -->

ثم تغيير :

  "This is featured post X title"

بعنوان المقالة

تم بحمد الله

في نهاية الموضوع أشكركم و أتمنى منكم متابعة جديدي دائماً

Blogger Buzz: جديد منصة بلوجر

noreply@blogger.com (soufian) — Mon, 14 Mar 2011 20:20:00 GMT

اعلنت اليوم غوغل في مدونة صدى بلوجر عن جديدها لمنصة التدوين الشهيرة " بلوجر"

المنصة التي تعتبر احد ابرز منافسي وردبريس وتمبلر

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

فيديو عن التحديثات

ادعكم مع الصور

المحرر الحالي

المحرر الجديد

لوحة التحكم الحالية

لوحة التحكم الجديدة

اختراق عرب بلوجر

noreply@blogger.com (soufian) — Sat, 5 Mar 2011 14:19:00 GMT

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

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

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

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

لكن الحمد الله ان الاخ اسامة قد استدرك الامر وقد اعلن في الصفحة الرئيسية انه سيتم اصلاح المشكل

صورة الاختراق :

اعلان الاخ اسامة

مثل هذه النوعية من المخترقين مرضى ولا هدف لهم من تعلم دروس الاختراق سوى التخريب فعوض استعمال هذا العلم فما يرضي الله نجدهم يخربون في مواقع اخوانهم عوض المواقع الغربية السئية وهم من مستعمليها

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