تغيير حجم عنوان الموضوع وتلوينه وتغيير نوع الخط

بدايتاً يجب علينا أن نعرف بأن تلك الأمور الرئيسية في البلوجر 

لايتم التعديل عليها الا من أكواد القالب من قالب ومن ثم تحرير html 

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

وبهذا الموضوع سنعدل على أكواد عنوان الموضوع الرئيسية لجعلها تناسب مظهر المدونه

كود عنوان الموضوع الرئيسي يأتي في css على الهيئة التاليه :

.post h3 {

}

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

وهذه بعض من الأكواد لتغيير نمط اللون وحجم الخط ونوعه :

 .post h3 {
font-size:140%;

color:#333333;
font-family: Josefin Slab;
}

أولا يجب علينا التركيز على ماهيئة وظيفة كل تلك الأكواد
فيجب عليك معرفة بأن هناك أكواد محدده لعمل ما .. 
لأن كود font-size يمثل الحجم سواء تكبيره او تصغيره
اما اذا وضعته لتلون الخط فهذا خطأ كبير!
لأن الكود المسؤل عن التلوين هو color وتستطيع أن ترى الألوان من هنا 
أما لتغيير نوع الخط يمكنك ذالك من خلال font-family
تستطيع إختيار نوع الخطوط من القائمة الأتيه :
    

نوع الخط لـfont-family	مثال للخط
Georgia, serif	This is a heading This is a paragraph
"Palatino Linotype", "Book Antiqua", Palatino, serif	This is a heading This is a paragraph
"Times New Roman", Times, serif	This is a heading This is a paragraph

نوع الخط لـfont-family	مثال للخط
Arial, Helvetica, sans-serif	This is a heading This is a paragraph
"Arial Black", Gadget, sans-serif	This is a heading This is a paragraph
"Comic Sans MS", cursive, sans-serif	This is a heading This is a paragraph
Impact, Charcoal, sans-serif	This is a heading This is a paragraph
"Lucida Sans Unicode", "Lucida Grande", sans-serif	This is a heading This is a paragraph
Tahoma, Geneva, sans-serif	This is a heading This is a paragraph
"Trebuchet MS", Helvetica, sans-serif	This is a heading This is a paragraph
Verdana, Geneva, sans-serif	This is a heading This is a paragraph

نوع الخط لـfont-family	مثال للخط
"Courier New", Courier, monospace	This is a heading This is a paragraph
"Lucida Console", Monaco, monospace	This is a heading This is a paragraph

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

افضل 3 برامج لتحرير الأكواد | Top 3 Programs to Code Editors

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

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

وبعضنا من سمع بها والاخر لم يسمع بها بسبب لم يجدها بعد

لهذا نحن الان نضع هذه البرامج للجميع 

Notepad ++

برنامج نوت باد ++ هو من اشهر البرامج المساعده لتحرير الأكواد

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

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

مميزاته

1. خفيف وادائه سريع
2. اضافة المواقع المفضلة
3. وضع ملئ الشاشه
4. بحث واستبدال

TextWrangler 

هذا البرنامج يدعم اللغه الأنجليزية فقط 

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

لهذا هو برنامج مهم في تحرير الاكواد

  مميزاته

1. مدقق املائي
2. البحث
3. القدره على المقارنه
4. دعم SSH

Araneae  

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

 مميزاته

1. سحب وأسقاط الملفات
2. بحث واستبدال
3. تسليط الضوء على مركبات
4. لقطات سريعه

وبهذا قد نكون وصلنا لنهاية موضوعنا 

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

ضع تعليقك الأنسب لهذا الموضوع

افضل 3 مواقع لتعلم التكويد | The Best 3 Websites to Learn Coding

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

لكن هناك العديد والكثير لهذا لانعرف نبدأ مع من ونثق في من

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

وكل موقع من الخمس المواقع لديه مميزاته الخاصه

وبأذن الله نبدأ بالموقع الأول

Codecademy

وهذا من افضل المواقع في التكويد على الأطلاق حيث يعلمك تكويد
الـPHP, JavaScript, jQuery, والكثير
مما يمتاز بواجهته الرئيسية ويمكنك البدء في تعليم منه سريعاً
الذهاب للموقع

Code Avengers

هذا الموقع يعتبر من افضل المواقع من حيث تعلم 
تكويد HTML5, CSS3 and JavaScript فقط
لكن من مميزاته انه يجعلك تتعلم التكويد بمتعه الترفيه 
فهو يقدم بكل نهاية درس لعبة ممتعه لتبعد عن الأرهاق والجهد ولتتمتع بعد كل نهاية درس
مما يجعلك تظل في الموقع اكثر وتحبه ايضاً يمكنك زيارته من هنا
الدخول للموقع
Code School

بعد التعلم التكويد عن طريق المواقع السابقه 
هذا الموقع يجعلك تختبر قدراتك ومعلوماتك التي تعلمتها من المواقع السابقه
عن طريق 4 دورات رئيسية وهي :
Ruby JavaScript HTML/CSS iOS

الدخول للموقع

وبهذا نستطيع التعلم التكويد من هؤلاء المواقع الجيده 

ولكن لديدك العديد من الاختيار

الموقع الضخم thimble mozilla لتعلم CSS و HTML و JavaScript

موقع thimble من mozilla يتيح لك التعلم لغات CSS و HTML و JavaScript بشكل كبير وفعال 

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

فهو من المحررون الأنسب لهذه اللغات وسهولة تعلمها بسهوله وسرعه 

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

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

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

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

وهذا الفيديو من موقع thimble الرسمي لشرح كيفية عمل الموقع : 

وفي الختام شاركنا رأئيك عن اداء الموقع ومايقدمه للجميع

لغة البرمجه لاتقتصر على CSS و HTML فقط

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

فلغة البرمجه CSS و HTML هما يشكلون هيكل واسلوب الموقع او المدونه فقط فكلنا نعرف ان لغة البرمجه CSS 

هي لإعطاء الموقع او المدونه شكلاً خلابأ وهي اللغة التي تعتمد عليها قوالب فلات الأنيقه والقوالب التقنيه 

فأي مصمم للمواقع الاحترافيه بجمالها يستخدم الـ CSS بكثره في القالب عند التصميم 

لكن هناك عديده للغه البرمجه مثل CSS3 و HTML3 وهناك مواقع عده تعلم هذه اللغات 

مثل HTML5 & CSS3 Site Design Online Short Course

فهو يقدم دوره قصيرة لتعلم هذه اللغات 

ويمكنك تعلم الكثير من خلاله وايضا لاتنسى بأن هنالك العديد من اللغات البرمجه غير CSS  و HTML 

فهناك لغات برمجه للبرامج والأجهزه وحتى المواقع فالبرمجيات تختلف 

شرح كيفية عمل أكواد الصور في قوالب بلوجر Codes Images

الجميع يعرف أكواد الصور ، وماتفعلة ، لكن هُناك من يحتاجها في تكويد القوالب

ولايعرف مايكتبة لتنفذ المطلوب من أدائها ، وهنا تأتي فائدة محتوى هذا الموضوع من معلومات قوية للصور في القوالب

ماهي أكواد الصور

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

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

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

<img src="myimage.jpg" alt="My Image">

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

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

وظائف أكواد الصور

الوصف	بعض الوظائف
العنوان - عندما تضيف هذه الوظيفة سيظهر عنوان مُنبثق للصوره	Title
الأي دي - الرقم التعريفي للصوره ( يتم أنشائه تلقائياً )	ID
الستايل - اذا كنت تريد اضافة بعض الأكواد التجميلية يمكنك من هذه الوظيفه	Style
عنوان الصورة في القالب HTML	Alt
الذهاب عبر الضغط لرابط الصورة	OnClick
اضافة ترجمة للصوره	Translate
استخدام الخريطة	IsMap
استخدام الخريطة	UseMap
عرض الصورة ( تضيف هذه الوظيفه لكود الستايل )	Width
طول الصوره ( تضيف هذه الوظيفه لكود الستايل )	Height
المسار للصوره ( ضع هنا المسار المُؤدي للصورة كرابط وغيره )	Src

بعض الأمثله لإستعمال وظائف أكواد الصور

<------------------------ الكود الأصلي------------------------>

<img src="myimage.jpg" alt="My Image">

<------------------------ التعديل على مسار وعرض وطول وعنوان الصوره------------------------>

<img
src="myimage.jpg"
alt="My Image"
width="100px"
height="50px">

<------------------------ التعديل على عنوان و ستايل الصوره ومسارها------------------------>

<img
src="myimage.jpg"
alt="My Image"
style="width:190px;height:79px;">

<----------------------------------------------------------------------------------->

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

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