المشاركات الأخيرة

اختبار إظهار الأكواد بشكل أجمل

ليل المدينة وجسر أفضل التصوير الفوتوغرافي
ليل المدينة
و عن عبدالله بن عمر بن الخطاب أن عمر لقي أبا موسى الأشعري رضي الله عنه، فقال له: يا أبا موسى، أيسرك أنَّ عملك الذي كان مع رسول الله صلى الله عليه وسلم خَلَص لك، وأنك خرجت من عملك كفافاً، خيره بشره، وشره بخيره كفافاً، لا لك، ولا عليك؟ قال: لا يا أمير المؤمنين. والله قدمت البصرة وإن الجفاء فيهم لفاشٍ، فعلَّمتهم القرآن والسنّة، وغزوت بهم في سبيل الله، وإني لأرجو بذلك فضله. قال عمر رضي الله عنه: لكن وددتُ أني خرجت من عملي خيره بشره، وشره بخيره كفافاً، لا علي ولا لي، وخَلَص لي عملي مع رسول الله صلى الله عليه وسلم المخلص. كذا في منتخب الكنز . حديث ابن عباس في خوف عمر عند موته

كان أولاد يعقوب دائماً يغتاظون من حب أبيهم ليوسف و إيثاره له ، و لذلك ، قام الإخوة جميعهم بالتآمر فيما بينهم لقتل يوسف و إلقائه في أرض بعيدة، و لتنفيذ المؤامرة هذه ، قرروا أن يطلبوا من أبيهم اخذ يوسف في رحلة ، أحس يعقوب بشيء من الخوف و المؤامرة على يوسف ، فقال لأولاده بأنه يخشى أن يأكله ذئب و إخوته في غفلة من أمرهم ، إلا أنهم ردوا على والدهم بجواب مقنع جاء في الآية الكريمة (لئن اكله الذئب و نحن عصبة إنا إذا لخاسرون ) ، و بعد ذلك أخذوه و ذهبوا به و أجمعوا على إلقائه في البئر عاد بعد ذلك إخوة يوسف في المساء إلى والدهم مدعين أن الذئب قد أكل يوسف ، و قد جاءوا بدم كاذب على قميصه ليقنعوا والدهم بذلك ، أحس يعقوب بمؤامرتهم لكنه صبر لذلك و احتسب كانت البئر التي ألقي فيها يوسف قليلة الماء ، و مرت بتلك البئر قافلة فأرسلوا واردهم ليحضر لهم دلواً من الماء ، و ما إن أدلاه تعلق به يوسف ، فاستبشر به الرجل و اتفق هو و جماعته بأن يأخذوا يوسف و يتخذوه عبدا و غلاماً يبيعونه بمصر ، أسرت القافلة يوسف و خبؤوه إلى أن وصلوا إلى مصر فعرضوه للبيع و باعوه بثمن بخس و زهيد و قد جاء وصف ذلك كله في سورة يوسف بالآيات التالية إِذْ قَالَ يُوسُفُ لِأَبِيهِ يَا أَبَتِ إِنِّي رَأَيْتُ أَحَدَ عَشَرَ كَوْكَبًا وَالشَّمْسَ وَالْقَمَرَ رَأَيْتُهُمْ لِي سَاجِدِينَ (4) قَالَ يَا بُنَيَّ لَا تَقْصُصْ رُؤْيَاكَ عَلَىٰ إِخْوَتِكَ فَيَكِيدُوا لَكَ كَيْدًا ۖ إِنَّ الشَّيْطَانَ لِلْإِنْسَانِ عَدُوٌّ مُبِينٌ (5)

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

خانة كود Html

[code type="HTML"]<!doctype html> <html lang="ar"> <head> <meta charset="utf-8"> <title>Sample Page</title> </head> <body> <h1>اكواد قصيرة</h1> <p>اكواد قصيرة لتسهيل العرض.</p> </body> </html>[/code]

خانة كود Css

[code type="CSS"].blog-header h1 {color:green} .blog-header h1 a {color:green} .post-title { font:normal normal 20px/1.4 "Open Sans",Sans-Serif; margin:0 0 .5em; text-shadow:none; color:#5686D6; } .post-title a, .post-title a:focus, .post-title a:hover, .post-title a:active { color:#5686D6; text-decoration:none; }[/code]

خانة كود JavaScript

[code type="JavaScript"](function() { var html5 = { abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video } .split(','); for (var i = 0; i < html5.length; i++) { document.createElement(html5[i]); } try { document.execCommand('BackgroundImageCache', false, true); } catch(e) {} })();[/code]

خانة كود JQuery

[code type="JQuery"]$(document).ready(function(){ $("button").click(function(){ $("div").animate({ left: '250px', opacity: '0.5', height: '150px', width: '150px' }); }); });[/code] الحمد لله رب العالمين

إخفاء عبارة الإشتراك في تعليقات الرسالة Atom على مدونات بلوجر

ميني سوفت


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

اليوم إخواني واستكمالاً لدورتنا لإحتراف البلوجر على هذا الرابط ( هنا )  سوف نقوم اليوم بحذف أو بمعنى أصح إخفاء تلك العبارة اسفل المدونة وهي الإشترك في : تعليقات الرسالة Atom وتكون بهذا الشكل اسفل كل تدوينة :

ميني سوفت
والآن سوف نقوم بإزالة هذه العبارة نهائياً وذلك باتباع الآتي :

ميني سوفت
من لوحة تحكم مدونتك إذهب إلى قالب

ميني سوفت
ثم إضغط تحرير HTML
سوف يفتح امامك قالب المدونة فابحث داخله عن هذا الوسم
]]></b:skin>
 وذلك بالضغط على Ctrl + F ثم ضع فوقه مباشرتاً هذا الكود :
.feed-links{display:none !important;}
ليبقى اخيراً هكذا :


ميني سوفت

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

أضف آداة متابعة جوجل Google+ Followers على مدونتك بمنتهى السهولة وبدون قيود



السلام عليكم ورحمة الله وبركاته
جميعنا "مستخدمي بلوجر" يعرف أن إضافة آداة متابعة لجوجل بلس تحتاج إلى تبديل نظام التعليقات ويصبح التعليق هو جوجل بلس بدلاً من تعليقات بلوجر , ولكن هناك الكثير منا ممن يُحب تعليقات البلوجر ولا يُريد تغييرها ومع ذلك يريد إضافة هذه الآداة .

حسناً , الحل بسيط مع هذا الكود , إذهب إلى لوحة تحكم المدونة , تخطيط , إضافة آداة ثم إختر html/javascript او أنظر للشرح المصور هذا ..

هذا هو شكل الآداة التي نتحدث عنها 
من لوحة التحكم إختر التخطيط

ثم إختر المكان في مدونتك واضغط على إضافة آداة 

إختر HTML/JavaScript

ثم ضع الكود التالي في الجزء الاصفر هذا ثم إضغط حفظ 
وهذا هو الكود ...

<script type="text/javascript">
(function(){window.___gcfg={'lang':'ar'};
var po=document.createElement('script');
po.type='text/javascript';
po.async=true;
po.src='https://apis.google.com/js/plusone.js';
var s=document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po,s);
})();
</script>
<div class="wc-gplusmod">
<div class="g-plus" data-action="followers" data-height="290" data-href="https://plus.google.com/108292020330642658594?prsrc=2" data-source="blogger:blog:followers" data-width="290"/>
</div>
استبدل هذا الرقم الأحمر برقم حسابك على جوجل بلس

ملاحظة هامة ,, بالنسبة لمن لم يضف مكتبة jquery للمدونة فعليه اضافة هذا الكود في المدونة قبل الوسم </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

وبهذا انتهى موضوعنا ,, إلى لقاء آخر بإذن الله

الآداة السحرية firebug للتعديل على صفحات الإنترنت Online مباشرتاً


السلام عليكم ورحمة الله وبركاته
اليوم معنا آداة من افضل الآدوات التي يمكنك أن تحصل عليها في عالم تطوير الإنترنت, انها الاداة الافضل firebug لتعديل صفحات الانترنت وهي قيد التشغيل !!
كما أن من فوائد الآداة التي تجعل منك مصمم محترم هي انك تقوم بتجربة ما تقوم بعمله قبل ان تطبق هذا على موقعك او مدونتك
كيف ذلك ؟ هو ما سوف نتناوله الان ,, اولاً الآداة تعمل بمنتهى الإحترافية على متصفح FireFox فقط, لذلك يلزمنا متصفح فاير فوكس يمكنك تحميل الاصدار الاخير من ( هنا )
اما عن تركيب الآداة , ادخل هنا على هذا الرابط  , وتابع الصور ..

ملاحظة هامة : لرؤية صور الشرح بوضوح إضغط على الصورة مرة واحدة فقط.

بعد الدخول على رابط الآداة ستجد الموقع كهذذا
إضغط على Add to Firefox

ثم انتظر حتى يكتمل التحميل

حتى تأتي هذه النافذة و اضغط Install Now

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

ستجد الاداه هكذا في اسفل الموقع
مقسومة نصفين النصف الاكبر هو كتابة الـ HTML و XML
النصف الاصغر هو كتابه CSS
 بقى لنا ان نحدد شئ في المدونة او الموقع و نقوم بالتعديل عليه

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

انا وقفت على عنوان موضوع انظر ,, تم تحديده بإطار ازرق
اضغط عليه الان وانظر لمكان الاداة

انظر جيداً
1- هو مكان العنوان في صفحة html
2- هو مكان العنوان في صفحة CSS
 وبهذا يمكنك التعديل على اي شئ تريد

انظر هنا ,, ضغطت على فونت حتى اعدل على اي شئ اريده
وانفترض انني اريد تكبير الفونت؟؟ سأقوم بتغيير الرقم 18 الى 30 وننظر في الصورة التاليه

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

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

اترككم في حفظ الله
السلام عليكم

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

ميني سوفت

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

درسنا اليوم من اوائل دروس دورة تعلم الكتابة لغة CSS
يدور حول اساسيات و قواعد لابد من توفرها حتى يتاح لك استخدام هذه الخاصية بنجاح.
بالنسبة للمدونات بلوجر فدائماً هنام قاعدة ثابتة وهي , اكواد CSS تبدأ بوسم وتنتهي بوسم كما التالي:

<b:skin><![CDATA[
body {
background: #00CCFF;
margin: 0;
padding: 0;
color: #333333;
font: normal normal 14px 'Droid Arabic Naskh',Arial,Tahoma,Sans-Serif;
text-align: center
}
a:link,a:visited {
color: #13A7DA;
text-decoration: none;
outline: none;
}
a:hover,a:active {
color: #292929;
text-decoration: none;
outline: none;
}
]]></b:skin>
اما في المواقع والمدونات الآخرى وايضاً بلوجر يتم استخدام الآكواد بالشكل التالي:

<style type='text/css'>
body {
background: #00CCFF;
margin: 0;
padding: 0;
color: #333333;
font: normal normal 14px 'Droid Arabic Naskh',Arial,Tahoma,Sans-Serif;
text-align: center
}
a:link,a:visited {
color: #13A7DA;
text-decoration: none;
outline: none;
}
a:hover,a:active {
color: #292929;
text-decoration: none;
outline: none;
}
</style>
ما هي القاعدة الثابتة  في كتابة أكواد CSS ؟ التالي ..

#outer-wrapper {padding3px;}

سوف نأخذهم بالتدريج من الشمال لليمين ونشرح اسم كل جزء ملون في هذا الكود

# المعرف الذي يوضع في صفحات html والذي يسمى id ويمكن ان يكون مكانه فئة وهي النقطة التي تسمى class , ويمكن استخدام كل شئ في صفحة html من روابط و معرفات وفئات

outer-wrapper يسمى في الكود Selector  او المُحدد ولا يشترط ان يكون outer-wrapper, بل المقصود الموضع نفسه في الكود

} بداية كتابة الكود

padding  هي من ضمن الخصائص التي تتحكم في تصميم الموقع او المدونة , وليس المقصود هنا padding بل المقصود المكان نفسه في الكود وينتهي دائماً ب نقطتين فوق بعضهم هكذا

3px هذا المكان في الكود يُسمى value او القيمة المعطاه للخاصية المحددة

; الفاصلة المنقوطة تكون فاصل بين كل كود والاخر مثال الكود هذا 

#outer-wrapper {padding: 3px; margin: 0px;}


{ نهاية مجموعة الأكواد كما في الكود السابق هذا 

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

ما هو id وما هو class والفرق بينهم

ميني سوفت


السلام عليكم ورحمة الله وبركاته
درسنا اليوم من دروس دورة تعلم تقنية CSS وهو التعرف على الفئات والمعرفات id و class والفرق بينهم
الـ id و الـ class هما المعرفات الاساسية التي توضع داخل وسوم  HTML و XML لتتعرف عليها تقنية الـ CSS ويتاح لك التعديل على كل كبيرة وصغيرة بالموقع من خلفية للموقع واطارت و الوان للخطوط و الوان لكل شئ و خلفيات للصور و تحديد حجم الصور و الخطوط ايضاً وشكلها
باختصار تستطيع ان تقول ان تقنية الـ CSS مسئولة عن كل شئ مرتبط بشكل وتنسيق وتصميم الموقع.

إجابة سؤالنا, ما هو id وما هو class والفرق بينهم، التالي :
id يسمى مُعرف .. class يسمى فئة
id يمكن أن يندرج تحته فئات كثيرة ولا يمكن ان يتكرر اسمه .. class يمكن ان يتكرر اسمه مرات ومرات على عكس id
id يكتب قبله #  .. class يكتب قبله دائماً . نقطة ,, ودعونا نأخذ مثال عملي :

-id مكتوب في صفحة HTML:
<div id='welcome'>to MiniSoft</div>
-id مكتوب في صفحة CSS
  #welcome {
    color: #000000 ;
    font: normal normal 12px Tahoma, Geneva, sans-serif;
  } 
نلاحظ أن id اصبح ( # ) وكتبت بجانبه welcome لأنها مكتوبة بجانب id في صفحة HTML

-class مكتوب في صحفحة HTML
<div class='mini'>soft</div>
-class مكتوب في صفحة CSS
  .mini {
    background-color: #CC0000;
    text-align: center;
  }
نلاحظ أن class اصبح نقطة ( . )  و كتبت بجانبها mini لأنها مكتوبة بجانب class في صفحة HTML

نأخذ مثال آخر على كيفية تكرار الفئة class :
<div class='mini'>ميني سوفت على تويتر</div>
<div class='mini'>ميني سوفت على جوجل كروم</div>
<div class='mini'>ميني سوفت ع الفيس بوك</div>
 كل هذه الوسوم المتشابهه تكتب في صفحة CSS هكذا:
  .mini {
    background-color: #CC0000;
    text-align: center;
  }
.إذاً فهمنا أن الوسم هو الملون و الذي يوجد بداخله كلمات كما رأينا, هذا بعكس المعرف id لا يمكن ان يتكرر نفس الوسم في نفس الصفحة او القالب كاملاً,,,

اتمنى ان تكون وصلت المعلومة والى اللقاء ان شاء الله في درس آخر من دروس الدورة 
السلام عليكم