كثير جداً منا أصحاب مواقع إلكترونية لأسباب مختلفة ولكن معظم من لديه موقع إلكتروني ليس خبير بأمور البرمجة ونسبة كبيرة منهم ليس لديه القدرة المادية لجعل مبرمج يخصص وينظم له موقعه ليكون بالشكل الصحيح ويعمل كما يجب وهنا نصطدم بالأكواد وكيفية التعامل معها في حالة لسنا مبرمجين فالأمر يكون في البداية صعب للغاية وإحتمالات إفساد الكود كبيرة للغاية.
وهنا وفي هذا المقال سنحاول تقريب الفكرة ومحاولة التعرف أكثر على الأكواد وكيفية التعامل معها بالرغم من كوننا غير مبرمجين وهو الأمر الذي يجعلنا نستطيع تعديل وتجهيز الموقع بقدر الإمكان بشكل صحيح دون أن يظهر به مشكلات ولكي يؤدي الموقع مهمته دون أن نستعين بمبرمج لن نستطيع تدبير حقه المالي من عمله بالموقع ودون أن ندمر الموقع تماماً ونفسد الكود الخاص به.
وقد يسأل البعض
هل يمكن تعديل أكواد الموقع دون أن يكون لي دراية بالبرمجة؟
هل أستطيع تعديل شكل الموقع دون أن أفسده؟
هل تعديل أكواد الموقع دون خبرات برمجية أمر سهل؟
وللإجابة على كل تلك الأسئلة وأكثر سيكون بكامل المقالة
وسيكون الشرح على الكود الخاص بالمدونة ببلوجر كمثال لكي نعرف من أين يبدأ الكود وإلى أين يذهب وأين ينتهي فهي كلها أمور هامة وإهمالها يدمر الكود تماماً وهو ما لانريده إطلاقاً بالبداية وقبل كل شيء علينا في كل مرة نقوم بتعديل أو إضافة كود أن نأخذ نسخة إحتياطية للقالب بها كامل الكود الصحيح الذي كان يعمل معنا والطريقة سهلة هي إما بالدخول على المظهر منه بالضغط على السهم الصغير بجانب كلمة تخصيص وبعدها نقوم بالضغط على زرار الإحتفاظ بنسخة إحتياطية.
الطريقة الثانية لأخذ نسخة إحتياطية وهي الذهاب للمظهر وبعدها الضغط على زرار السهم الصغير بجانب كلمة تخصيص ومنها بالضغط على زرار تعديل HTML ستفتح لنا صفحة الكود سنقوم بالضغط على زرار كنترول أو Ctrl مع زرار A وتحديد كامل الكود ثم نسخه بالضغط على زرار Ctrl مع زرار C وبالنهاية نفتح صفحة نوت باد على جهاز الكمبيوتر ولنسميها على سبيل المثال نسخة إحتياطية بتاريخ كذا رقم 1 وبعدها نقوم بالضغط على زرار Ctrl مع زرار V للصق كود المدونة بالنوت باد ثم حفظ.
هكذا يكون معنا نسخة إحتياطية ويمكننا إستعادتها بدلاً من الكود الذي قد يفسد من أي تعديل تم بشكل خاطيء أو بسبب الكود الجديد فقد يكون به مشكلة أو تم إضافته في مكان غير صحيح بكامل الكود.
ويجب عليك عند البحث في كود المدونة على بلوجر الضغط على Ctrl مع الزرار F لتجد خانة ظهرت بإسم Search وأكتب بجانبها ما تود البحث عنه من وسم أو بداية كود ولصق الكود الذي نسخته بالضغط علي Ctrl مع الزرار V ثم الضغط على زرار Enter
الأن لنتعرف على الكود بشكل أقرب ونفهمه بشكل ولو سطحي يجعلنا نتفادى إفساده فأي كود عموماً يتم إحتوائه بوسوم وكل كود له وسم فتح ووسم إغلاق وهذا الوسم لا يتم التغيير فيه في كثير من الأحوال
نجد وسم
<html>
ووسم إغلاقه بنهاية الكود على الشكل
</html>
وإليك بعض الوسوم على شكل الفتح والإغلاق الخاص بها
<div>
</div>
<h3>
</h3>
<a>
</a>
<head>
</head>
<body>
</body>
وعليه فأي كود ستضيفه للكود الأساسي يجب أن يكون إما قبل وسم بداية كود أخر أو بعد وسم نهاية كود أخر ويكون بإرشادات مطور الكود وفيه تنبيه كامل عن إضافة الكود الخاص به مثل ينبهك بأن تضع الكود هذا قبل كود نهاية وسم بادي فيجب عليك وضع الكود بهذه الطريقة
الكود
</body>
دون أن يتداخل الكود الجديد بكود أخر قبل نهاية وسم الإغلاق بادي ولا أن يختلط بوسم الإغلاق نفسه بادي مثل
</الكودbody>
أو
</bodyالكود>
كذلك
</dyالكودbo>
فهذا كله خطأ كامل ويفسد الكود بل لن يتم حفظ الكود لأنه خاطيء تماماً
وأيضاً لا تضع الكود ليختلط بكود أخر قبل وسم نهاية البادي مثل
})
الكود })
</script>
</body>
أو
}الكود)
})
</script>
</body>
بل الشكل الصحيح لوضع الكود في هذه الحالة يكون مثل
})
})
</script>
الكود
</body>
هكذا يكون الشكل الصحيح لوضع الكود الخاص بك على حسب توضيح مطور الكود لمكان وضعه فيجب ألا يختلط مع كود أخر إطلاقاً وإلا فسد الكود.
علينا معرفة أنه هناك أنواع للوسوم فبعضها وسوم خاصة بالإتش تي إم إل مثل الوسوم التي سبقت ووسم خاص يبين أن هذا الكود بالجافا سكربت مثل وسم
<script>
</script>
فهذا وسم جافا سكربت ومابينه كود جافا سكربت
كذلك هناك وسوم خاصة بالسي إس إس مثل
<style>
</style>
وما بينه هي أكواد سي إس إس
وهل هذا سيفرق معك نعم فأكواد السي إس إس عموماً يمكنك تعديلها بشكل بسيط لتغير لون أو طول أو عرض جزء معين بشكل الموقع مثل لون الخلفية كمثال وكيف تعرف كود اللون ببساطة في معظم الأحيان كود اللون يكون بالشكل
#4C4A4B
وكيف نتأكد من أن هذا هو كود لون وليس شيء أخر
أولاً ستجد قبلها صيغة توضح جداً أن هذا هو كود لون مثل
background-color: #4C4A4B;
أو
color: #3b5998;
ثانياً ببساطة ضع الكود في لوحة ألوان الفوتوشوب أو أدخل على جوجل وأكتب العبارة " html color picker " وضع الكود فإن أظهرت لك لون موجود بالفعل في موقعك فهكذا أنت بالظبط بالمكان الذي يمكنك من خلاله تغيير هذا اللون للون أخر كما يحلو لك
لاحظ أن تغير كود اللون فقط لا تحذف أو تغير ما قبله من الكود أو بعده مثل
background-color:
;
فقط الكود الذي هو على الشكل
#4C4A4B
إستثناءات لشكل الوسوم المعتاد
فقد تجد وسم فتح وليس له وسم إغلاق أو وسم إغلاق وليس له وسم فتح مثل
<link as='script' href='https://Example . com .js' rel='preload'/>
<meta content='ar-eg' http-equiv='content-language'/>
<script defer='defer' src='https://Example . com .js'/>
وكما ترى بالأمثلة وهو حقيقي ولكن يجب عليك على الأقل في أكواد بلوجر إن لم يكن الوسم مغلق فعليك إضافة العلامة
/
قبل العلامة
>
بنهاية الوسم ليتم حفظها دون أخطاء ببلوجر
في بعض الأحيان في وسوم فتح الأكواد قد تبحث عن الوسم ولا تراه إطلاقاً بالكود مع أنه موجود ولكن في كثير من الأحيان تكون أكواد فتح الوسوم بها أكواد أخرى فعلى سبيل المثال وسم فتح البادي عندي ليس بهذا الشكل
<body>
بل هو عندي بالمدونة على هذا الشكل
<body expr:class='data:blog.pageType' id='mainContent'>
ولتفادي تلك المشكلة أي وسم فتح إبحث عنه بالشكل
<body
لتجده بكل سهولة بكل بساطة
وأنبه مرة أخرى عليك قبل التعديل على أي كود بالمدونة أن تقوم بأخذ نسخة إحتياطية وحفظها ثم قم وعدل كما تريد بعدها فإن فسد الكود يمكنك حذف الكود الفاسد ولصق كامل الكود الصحيح قبل التعديل مرة أخرى.
وفي بعض الأحيان ومن كثرة التعديل يفسد الكود ولا يقبل التعديل أو التغيير ولا حتى إسترجاع النسخة الإحتياطية هنا كل ماعليك فعله هو أن تأتي بقالب تنظيف لبلوجر وتحذف كامل الكود القديم وتضع كامل كود التنظيف ثم تقوم بعمل حفظ وذلك لتنظيف القالب وجعله قابل لإسترجاع النسخة الإحتياطية مرة أخرى.
وكذلك قد لا يقبل حفظ قالب التنظيف هنا علينا إختيار أي قالب إفتراضي موجود ببلوجر ثم الضغط عليه وبعدها تقوم بالضغط على زرار تطبيق وبعدها يمكنك بالفعل إسترجاع النسخة الإحتياطية وإعادة التعديل عليها مرة أخرى دون إفساد الكود.
والبعض قد يفكر أليس التعديل بالتنسيق أسهل وأفضل نعم هو أسهل وأفضل ولكن لن تجد جميع الخصائص والخيارات بالتعديل في التنسيق بل بعض القوالب ببلوجر تفتقر لخيارات كثيرة بالتنسيق مما يحتم عليك تعديل ما يمكن تعديله من التنسيق وبعدها الإنتقال للتعديل بالكود على ما لا يمكن الوصول إليه من التنسيق من خيارات التعديل المختلفة.
البعض قد يريد التعديل على الكود ولكن لا يعلم أين بالظبط مكان هذا الجزء في الكود هنا الحل بسيط للغاية فقط عليك فتح مدونتك أو حتى التعديل فقط ظاهرياً على مدونتي أو أي موقع على متصفح كروم وبعدها تقوم بالضغط على زرار F12 كذلك الضغط بزرار الماوس الأيمن ومنها بالضغط على خيار Inspect ثم بكل بساطة تمرير سهم المؤشر على الكود وكلما تظلل الكود بمكان فيه الجزء الذي تريد معرفة الكود الخاص به تفتح السهم الصغير بجانب هذا الكود وهكذا تظل تفتح في الأكواد بداخل بعضها لتجد نفسك تحدد وتقترب أكثر من الجزء المطلوب تعديله وفي حالتنا بالصورة نحن نريد كمثال تغيير مكان زرارين تغيير صور مواضيع السلايدر من اليمين لليسار ببساطة وكما في الصور.
قمنا بعد تحديد العنصر المحدد للزرارين وليس تحديد زرار واحد فقط ورؤية الخيارات الخاصة به من اليمين واليسار وقمنا بعكس القيم بالمتصفح وتزويد عدد البكسلات للقيمة يسار حتى تتوسط تحت الكلام بالظبط كما نريد وهذا في المتصفح فقط ويمكننا البحث بعدها عن الكود
.rtl .control-bt
فقط علينا تغيير الخيارات الخاصة بهذا الكود كما تم في المتصفح وكما شاهدنا بأعيننا التغيير الذي حدث وبنجاح مع أخذ نسخة إحتياطية قبل التعديل بالطبع لنجد أن التعديل تم كما فعلناها من المتصفح بكل دقة وهكذا يمكنك تعديل وتغيير الكثير من الأمور بموقعك ومدونتك دون إفساد الكود ومع ضمان نجاح كامل في حالة لم يكن هناك أي خطأ ما يؤدي لإفساد الكود.
وهكذا يمكنك تغيير الكثير من القيم والمعطيات والخيارات بالكود من الإتجاهات والألوان وسمك الحدود وحجم الأزرار ومساحة جزء معين وأطلق لك العنان تخيل وغير وعدل كما تود بمدونتك لترى التعديل تماماً وتقوم به بشكل صحيح قبل حتى الدخول لكود الموقع للتعديل عليه لتتأكد من صحة التعديل أمامك دون أية مثلثات صفراء تظهر بجانب التعديل أو لا يتغير التعديل كما تود لتتأكد بنفسك من نجاح الأمر قبل البداية الحقيقية لتعديل الكود.
الخلاصة
يمكنك تعديل الأكواد والتعمق في تغيير خياراتها جميعاً دون الحاجة لأن تكون مبرمج أو لأن تكون متعمق تماماً بكل ما يحتويه الكود فقط عليك معرفة كيف تصل للجزء المراد التعديل عليه وكيف يتم التعديل عليه بل وكيف تتأكد من نجاح الأمر من المتصفح دون حدوث مثلثات صفراء بجانب التعديل أو عدم حدوث التغيير المطلوب وتغيير موقعك كما تريد حتى قبل أن تبدأ في تغييره من الأكواد كل هذا ببساطة شديدة وعندما تتقن الأمر سيكون بمثابة اللعبة المفضلة لديك في كل يوم.
