كيف تتعامل بشكل صحيح مع اكواد CSS , JS , HTML في بلوجر

كيف تتعامل بشكل صحيح مع اكواد CSS , JS , HTML في بلوجر

المعاينات والمرفقات

How to use CSS,JS,HTML in Blogger
كثير من مستخدمي بلوجر يتبعون الشروحات الخاصه بإضافة وتوزيع الإضافات دون أن يعرف لماذا يتم هذا التوزيع وكيف يوزع بنفسه او يجمع أكواد الإضافة مع بعضها وفي موضوعنا اليوم سنوضح كيف يتم توزيع اكواد اللغات البرمجية 
CSS , Js , HTML
في منصة بلوجر , طبعا لن نخوض في أمور برمجية بحته لكن سنتكلم بشكل عام يناسب الجميع في فهم الأمر

لماذا يتم توزيع بعض الأدوات وأخرى تضاف في آداة واحدة HTML/JavaScript ؟

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

أكواد الستايل او  المظهر CSS

تلك الأكواد هي المسؤلة عن مظهر الآداة والوانها واشكالها يمكنك تمييز اكوادها بأنها تكتب بتلك الطرق 
#Example {
 margin:0 5px;
 background-color:#444444;
}
أو هكذا
#Example {margin:0 5px;background-color:#444444;}
مكان هذه الاكواد في القالب هو بين كودين 
<b:skin><![CDATA[/*

]]></b:skin>
لكن ان اردت استخدام تلك الاكواد في آداة HTML/JavaScript أو في منطقة اخرى بالقالب مثلا منطقة الـ head اى فوق الوسم
</head>
او في منطقة الـ body اى بين الوسمين
<body> 

</body>
عليك ان تخبر القالب ان هذه أكواد ستايل بوضعها بين هاذين الكودين
<style type='text/css'>
هنا
</style>

أكواد الجافا سكريت JS

هي الاكواد المسؤلة عن الأوامر يعني عندما تضغط على شئ معين في آداة هذه هي الاكواد التي تحول ضغطتك لفعل شئ معين في الصفحة
يمكنك اضافاتها فوق منطقة الـ head او في منطقة الـ body لكن في كل الأحوال عليك ان تخبر القالب بانها ملفات جافا
بوضعها بين هاذين الكودين
<script type='text/javascript'>
هنا
</script>
يعني لو لديك ملف جافا ولا تستطيع رفعه انقل محتواه داخل هاذين الكودين احياناً قد لا يقبل فعليك تحويله بمحول الاكواد

أكواد الـ HTML

هي الأكواد المسؤلة عن التخطيط  التي تحدد اين مكان الإضافات في الصفحة واجزائها ودائما تكون فقط في منطقة الـ body
ويمكنك تميزها بان اكوادها ممتلئة بالأقواس مثل هذا
<div class="example">
<p>text</p>
</div>
بعدما فهمنا فكرة تلك الأكواد وكيف نضيفها في القالب ومناطق عملها وكيف نغير منطقة اضافتها كأكواد الستايل
الآن هذه أدوات يمكنك التمرن عبرها
الأولى هو هذا السلايدر ستجد اكواده موزعه يمكنك بإضافة الوسوم لمنطقة الستايل ان تجمع الاكواد كلها مع بعضها وتضيفها في آداة HTML/JavaScript
طبعا قد لا يعمل معك في آداة لما ذكرته من اسباب سابقاً او قد يعمل بحسب قالبك
وهذا سلايدر آخر غير موزع لو اردت توزيعه في القالب استخدم اكواده ووزعها

تعليقات

30

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

  1. موضوع جد ، شكرا لكم يا مدونة كن مدون

    ردحذف
    الردود
    1. أهلا بك اخي الكريم
      شكراً لمرورك يا طيب

      حذف
  2. من جديد موضوعاتك رائعه :) تسلم أفدتنى جدا والله
    بس لاتتاخر علينا كتييير ياغالى يعنى طرح موضوع كل شهر صعب :)
    جزاك الله خيراً

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

      حذف
  3. السلام عليكم
    انت انسان محترم شروحاتك روعة

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

      حذف
  4. أنت أرقى مدون
    ربنا يكرمك مدربنا

    ردحذف
    الردود
    1. ربي يحفظك أخي الغالي
      دائمااسعد بتواجدك وتعليقاتك
      تحياتي

      حذف
  5. السلام عليكم ورحمة الله وبركاته
    ربنا يبارك فيك ويجزيك عنا خير الجزاء
    على كل ما تقدمه لإخوانك من علم نافع فى مجاله
    حفظك الله ورعـــاك .

    ردحذف
    الردود
    1. وعليكم السلام ورحمة الله وبركاته
      وفيك بارك الله أخي الكريم
      وحفظكم الله من كل سوء
      جزيل الشكر على مرورك العطر

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

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

      حذف
  7. شكراااا لك اخي عمروو على الموضوع الرائع استفدت كتيرا (: ...

    ردحذف
    الردود
    1. عفواً أخي الكريم
      سررت كثيراً بمرورك العطر يا طيب
      تحياتي لك

      حذف
  8. مقال رائع أستاذ عمرو
    شكرًا لك دائمًا مُبدع بمقالاتك
    أتمنى لك التوفيق

    ردحذف
    الردود
    1. ربنا يعزك أخي الغالي
      أشكرك يا طيب على مرورك العطر

      حذف
  9. أهلا أخي كن مدون في الحقيقة لقد وضعتني في ورطة لأنني أعتمد على قوالبك بالدرجة الاولى في تصميم مدونتي أرجوا منك فقط إصلاح إضافة آخر المواضيع لأنني لم أجد على النت شريط يضاهي الذي كنت أستعمله من عندك لكن للأسف توقف منذ مدة وانا أنتظر منك إصلاحه سأكون جد شاكر إذا أخذت طلبي بعين الإعتبار
    رابط الموضوع هو http://cnmu.blogspot.com/2014/10/News-Bar-Blogger-Widget.html

    ردحذف
    الردود
    1. أهلا بك اخي الكريم
      انا عادة لا انشر التعليقات الخاصه بطلبات اصلاح ادوات معينة
      وذلك لان الأمر مرتبط بالوقت المتاح لي لإصلاحها لكن نظراً فقط ان هذا الشريط هو بالفعل كان يجري اصلاحه حالياً فنشرت التعليق للتنبيه على الأمر ستجده ضمن المواضيع التي تم اصلاحها
      http://cnmu.blogspot.com/2016/05/Google-Code.html
      طبعا انا اعتذر من الجميع عن التأخر في اصلاح كثير من المواضيع لكن كل موضوع اصلاحه يتطلب اعادة كتابة اجزاء منه ايضاً وقت ضبط الاكواد لتتناسب مع الوضع الجديد انا احاول بكل طاقتي فالأمر كان صادما لإيقاف موقع الرفع والمواضيع كثيرة والوقت قليل
      وبالتوفيقق للجميع

      حذف
  10. يا اخي او اخواني في كن مدون انتم تصممون قوالب رائعة جدا ولكن قالب موقعكم ليس جميل

    ردحذف
    الردود
    1. أهلا بك أخي الكريم
      طبعا احترم رأيك لكن في النهاية هي مسألة اذواق قد تراه انت سئ غيرك يراه مقبول آخر يراه بديعاً ولا يمكن ارضاء كل الأذواق لذلك الفيصل في الأمر هو هل يمكن تصفح الموقع جيداً ام لا
      فإن لم تكن هناك مشكلة في تصفح الموقع إذا مبدأ الجمالية هو مبدأ خلافي
      وبالتوفيق

      حذف
  11. شكراً على الإيضاح الجميل، في انتظار المزيد

    ردحذف
  12. شكرا لك ماقصرت لا تتاخر بمقالانك

    ردحذف
  13. شكراً لمروركم اخواني الكرام

    ردحذف
  14. بارك الله فيك اخى الفاضل

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

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

      حذف
  15. سؤال اخي الكريم و ارجو الإجابة في اقرب وقت هل اكواد الجافا سكريبت المشفرة ك eval او غيرها هل تعتبر مخالفة لادسنس او لا مشكلة في ذلك

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

      حذف
  16. السلام عليكم كلبي بس ماعرف بيا مكان اضيفهن هواي اسمع مكان haed بس ماندل وين يصير

    ردحذف
    الردود
    1. وعليكم السلام
      جزء head هو جزء أساسي في كل صفحات الغنترنت ان طلب احد اضافة شئ في هذا الجزء ابحث عن هذا الكود واضف ما تريد فوقه
      </head>

      حذف