أين تلصق هذا الرمز في WordPress؟ هيكل ملف الموضوع العام.

مرحبا يا شباب!

قررت اليوم أن أتطرق إلى موضوع لن يتوقف أبدًا عن كونه وثيق الصلة بمبدعي مواقع الويب الشباب.

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

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

في هذه المقالة ، سأوضح لك مدى سهولة تحديد المكان في قالب WordPress الخاص بك حيث تحتاج إلى إدخال أي رمز. سأنظر أيضًا في نقاط مهمة أخرى قد تهمك في المرحلة الأولية.

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

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

الآن سأشرح كل شيء بالتفصيل في تنسيق نصي.

الملفات المسؤولة عن إخراج كل نوع من أنواع الصفحات

إذا كنت قد قرأت العديد من المقالات في مدونات أخرى حول تنفيذ بعض الوظائف باستخدام الأكواد (البرامج النصية) ، فأنت متأكد بنسبة 100٪ أنك رأيت عبارات مثل:

  • الصق هذا الرمز في ملف الإخراج الصفحة الرئيسية;
  • الصق هذا الرمز في الملف المسؤول عن عرض السجلات وغيرها.

هناك العديد من الملفات التي قد تحتاج إلى إدراج الرموز فيها. لكن ما هي هذه الملفات؟ كل شيء بسيط للغاية.

  1. إخراج الصفحة الرئيسية - index.php ؛
  2. إخراج السجل - ملف single.php ؛
  3. إخراج الصفحة - ملف page.php ؛
  4. إخراج المحفوظات والفئات - archive.php ؛
  5. إخراج التذييل - footer.php ؛
  6. نتائج صفحة البحث - search.php ؛
  7. إخراج الشريط الجانبي - sidebar.php ؛
  8. ملف النمط - style.css ؛
  9. ملف إخراج الصفحة 404 هو 404.php.

الآن ، عندما يُطلب منك لصق الكود في ملف كذا وكذا ، ستعرف أين تبحث.

يبقى فقط للإجابة على السؤال ، كيف تحدد المكان المناسب في كل ملف؟

تحديد مكان إدخال التعليمات البرمجية

أولاً ، دعنا ننتقل إلى تلك الأماكن التي لا تحتاج إلى تعريف. ستكون هي نفسها للجميع ، بغض النظر عن القالب.

المكان الأول ، المطابق لجميع القوالب ، هو المنطقة الموجودة في ملف Header.php. هذه هي علامات الافتتاح والختام .

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

يتم وضع هذه العلامات في أعلى ملف Header.php.

سيكون المحتوى بينهما مختلفًا بالنسبة للجميع ، لأن كل شيء يعتمد على النموذج.

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

المكان الثاني ، وهو أيضًا مطابق لجميع القوالب ، موجود في ملف إخراج التذييل - footer.php.

يمكن توصيل البرامج النصية ليس فقط عن طريق إدراجها بين العلامات في ملف Header.php. يمكنك أيضًا تحميلها من خلال ملف footer.php ، وبالتالي تسريع تحميل صفحة الموقع.

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

مهمتنا هي عرض محتوى الصفحة ، في أسرع وقت ممكن ، لكل من الزوار و محركات البحث. في هذه الحالة ، يُنصح بتحميل البرامج النصية في نهاية الصفحة لعرض المحتوى أولاً ، ثم تحميل كل شيء آخر.

لتنفيذ هذا الخيار ، تحتاج إلى فتح ملف footer.php ولصق البرنامج النصي قبل إغلاق علامة النص الأساسي. إنه موجود في نهاية محتوى الملف ، حيث إنه مسؤول عن نهاية منطقة الصفحة.


كما ترى ، قمت بعرض جميع البرامج النصية في هذه المنطقة ، قبل علامة الإغلاق

(مظلل باللون الأزرق). بالمناسبة ، أخرجتهم من خلال التحميل من الملفات ، وليس عن طريق وضع البرامج النصية نفسها في هذه المنطقة. بعد ذلك ، قمت بتسريع عمل المدونة بشكل كبير. كيفية القيام بذلك ستكون مقالة منفصلة. انتظر!

آمل أنه عندما يُطلب منك لصق الكود في هذه المناطق ، ستفعل كل شيء دون أي مشاكل.

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

  • إظهار الوظائف ذات الصلة ؛
  • مخرجات نموذج الاشتراك ؛
  • إخراج الأزرار الاجتماعية وما إلى ذلك.

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

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

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

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

  • جوجل كروم- عرض رمز العنصر ؛
  • Firefox - اكتشف العنصر ؛
  • Opera - فحص العنصر.

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

انتقل إلى عرض رمز العنصر (Google Chrome). انقر انقر على اليمينمرر الماوس فوق منطقة فارغة من الصفحة.


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

هذا ما تبدو عليه هذه اللوحة.

باستخدام سهم ، أشرت إلى عدسة مكبرة ، من خلال النقر عليها يمكننا فحص بنية القالب وتحديد الكتل التي يتكون منها القالب. أسمي هذه الوظيفة المفتش.

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


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

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

وسوف تحتاج إلى لصق الكود.

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

على سبيل المثال ، قمت بإنشاء مقال جديد يحتوي على القليل من المحتوى لإظهار كيفية تمييز كتلة معينة.


بالنقر ، يجب أن تجد أيضًا الكتلة التي تحتوي على المحتوى الخاص بك. عند التمرير ، ترى تلميحًا صغيرًا يعرض اسم الكتلة المحددة.

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


كما ترى ، فإن هذه الكتلة لها نفس الاسم تمامًا كما في تلميح أداة التمرير.

عندما نعرف اسم الكتلة التي يُعرض فيها الجزء الرئيسي من المقالة ، يمكننا الانتقال إلى الملف الضروري وإدخال الكود الذي نحتاجه بعد هذه الكتلة. لنأخذ ملف إخراج السجل (single.php) كمثال.

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

من المريح جدًا العمل في محرر Notepad ، لأنه عند النقر فوق العلامة الافتتاحية للكتلة ، يتم أيضًا تحديد علامة الإغلاق (كما هو موضح في الصورة أعلاه). تشير علامة الإغلاق إلى أن هذه هي نهاية إخراج المحتوى. بعد ذلك يمكننا إدخال الأزرار الاجتماعية والمشاركات ذات الصلة والوظائف الأخرى.

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


يتم عرضها على الصفحات.


وبالمثل ، يتم الإدراج في ملفات القوالب الأخرى (الصفحات والعناوين والمحفوظات ...).

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

حول تحديد المكان في ملف القالب للإدراج اللاحق فيه عندما تحتاج إليه ، برزت ذلك.

بقيت آخر لحظةالذي يستحق تكريسه في هذه الفقرة.

هناك عدد غير قليل من الإعدادات التي تتطلب تدخلاً في ملف function.php الخاص بالقالب. لكنك تحتاج أيضًا إلى فهم كيفية إدراج الرموز فيه.

كقاعدة عامة ، يكتبون في جميع المدونات أن الإدراج يجب أن يتم في نهاية الملف ، قبل علامة الإغلاق؟>.

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

في هذه الحالة ، أقترح القيام بالعكس - أدخله في الكود في بداية الملف قبل علامة الفتح. انظروا إلى الصورة أدناه.


يتم تمييز علامة الفتح باللون الأحمر ، ويتم تمييز الرمز الذي تم إدخاله باللون الأزرق.

هذا خيار واحد. يمكنك أيضًا إدخال رمز في نهاية الملف ، ولكن قبل آخر رمز. في هذه الحالة ، يجب أن تفهم قليلاً على الأقل من أين يبدأ الكود الأخير حتى لا تقطعها.

هذا كل شئ. إذا واجهت نفس الموقف فجأة مع عدم وجود علامة إغلاق في ملف funsctions.php ، فستعرف كيفية المتابعة.

تحديد الأنماط المرئية في قالب

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

عندما نجد العنصر المطلوب وننقر عليه ، يتم عرض أنماط الكتلة (العنصر) المحدد في المنطقة اليمنى من لوحة عرض الكود. سأعرض الأنماط لنفس الكتلة من المقالة التي تمت مناقشتها أعلاه.


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

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

لذلك ، نفتح ملف style.css ونبحث عن السطر 890 في حالتي.

هنا يمكنك تعديلها. احفظ الملف وحمله على الاستضافة.

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

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

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

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

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

مع خالص التقدير ، قسطنطين خميلف.

بالطبع ، لا يحتاج الجميع إلى هذه المعلومات ، ولكن فقط أولئك الذين ، على صفحاتهم ، يشاركون القراء أفضل ممارساتهم في اختيار الكود (اقرأ شجاعة الموقع) وبعض ترقياته من خلال ... حسنًا ، أنت تفهم من خلال تدخل في "علم الوراثة"! ماهو رأيك؟

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

والآن ، يا أعزائي الجميلات ، تبدأ القصة.

قد يظهر سؤال معقول ، ولكن هل يحتاج القرض عمومًا إلى الاهتمام بإدخال الكود؟ لماذا تحتاج إلى القيام بنوع من تمييز الشفرة ولماذا لا يمكنك لصقها فقط ، مثل النص ، على سبيل المثال؟

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

لجعله "هو" ، هناك عدة خيارات ، وبشكل أكثر تحديدًا 3. سأحاول وصف كل شيء ، كما وعدت في البداية ، وأنت بنفسك تقرر أيها سيكون أكثر ملاءمة وسعادة بالنسبة لك لتنفيذه وإدراكه.

كيفية إدخال كود html في نص المقال بشكل جميل وصحيح.

الخيار رقم 1 - تمييز التعليمات البرمجية من خلال المكون الإضافي WP-Syntax.

بتعبير أدق ، يتم تنفيذ هذا الخيار من خلال مجموعة مكونين إضافيين - لسهولة الاستخدام. يسمى الجزء الأول من الحزمة: WP-Syntax ويؤدي الوظيفة الرئيسية. والجزء الثاني عبارة عن خدمة واحدة ويسمى WP-Syntax Button ، والذي ينفذ العمل عن طريق الضغط على زر ، والذي يضيفه لك هذا الزر على لوحة التحكم في محرر ووردبريس. قم بتنزيل كلا الجزأين من هذه الحزمة إما من خلال البحث في لوحة إدارة المدونة بالاسم ، أو من صفحات مستودع المحرك. صفحة مستودع WP-Syntax موجودة هنا. وصفحة زر WP-Syntax. نحن لسنا في الحافلة ، أليس كذلك؟

التثبيت قياسي - تم العثور عليه وتنزيله وتنشيطه. يرجى ملاحظة أن المكوّن الإضافي Button لم يتم تحديثه منذ أكثر من عامين ولا توجد بيانات حول توافقه مع ملف نسخة جديدة WordPress الذي قد ينبهك. إذا كنت قلقًا بشأن هذا الظرف ، فلا يمكنك تنزيل الزر والحصول على الجزء الأول فقط من الحزمة - سيعمل هذا أيضًا ، ولكنه أقل ملاءمة. من نفسي ، أستطيع أن أقول إنني أستخدم المجموعة الكاملة وكل شيء يعمل.

إذا قمت بتثبيت كل شيء ، فسيكون لديك زر جديد "رمز" في لوحة المحرر.

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

في الوقت نفسه ، بعد حفظ / تحديث المنشور / الصفحة ، سترى شيئًا مثل هذه الصورة مع رمز الصورة الذي تم إدخاله بشكل جميل ، على سبيل المثال:

إذا لم تقم بتثبيت جزء WP-Syntax Button ، فسيتعين عليك استخدام هذه المجموعة من التعليمات البرمجية لإدخال الكود:

أدخل رمزك هنا

أين ، اللغة هي لغة التعليمات البرمجية الخاصة بك. يجب إدراج هذه المجموعة في محرر HTML ، وإدخال الكود الخاص بك بالداخل. قائمة اللغات المدعومة موجودة في صفحة البرنامج المساعد. خيار إدخال رمز مثل هذا ليس مناسبًا جدًا ، ولكن قد يحتاجه شخص ما. ستكون النتيجة شيئًا كالتالي:

1 أدخل رمزك هنا

الخيار رقم 2 - إبراز بناء الجملة عبر SyntaxHighlighter Evolved Plugin، واسمه هو بالضبط ما تمت ترجمته. يمكنك تنزيله من خلال البحث عن الاسم في لوحة إدارة المدونة ، أو من صفحة البرنامج المساعد هذه. التثبيت قياسي. يعمل هذا المكون الإضافي مثل السابق ، ولكن بطريقة أقل ملاءمة.

بعد التثبيت ، سيكون لديك عنصر القائمة Settings> SyntaxHighlighter ، حيث ستكون جميع إعداداته. نعم ، لقد نسيت أن أقول إن البرنامج المساعد باللغة الإنجليزية وغير الروسية - وهو عيب. إذا كان هناك شيء غير واضح ، فاستخدم ترجمة الصفحة.

يمكن ترك إعدادات البرنامج المساعد افتراضيًا - فهي تعمل. أو يمكنك ضبط القيم كما في الصورة مع مثال على إعداداتي:

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

لإدراج html أو كود phpفي إدخال الموقع مع هذا المكون الإضافي ، تحتاج إلى تطبيق أحد التركيبات من المثال الموجود في صفحة إعدادات البرنامج المساعد (في الجزء السفلي):

عند كتابة منشور ، قم بالتبديل إلى محرر HTML ، وحدد المعلمة المطلوبةاللغة من المثال ، الصقها ، والصق الكود الخاص بك في الداخل. سوف يتحول إلى شيء مثل هذا:

هنا تقوم بإدخال رمزك الطويل

الخيار رقم 3 - أدخل كود html أو php بدون مكون إضافي.

للاستغناء عن المكون الإضافي وإدخال كود html في نص المدونة ، تحتاج إلى إرفاقه في الكود التالي:

أدخل الرمز الخاص بك هنا

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

في المظهر والوظيفة ، هو بالطبع أقل جمالًا ، لكنه لا يقوم بتحميل المدونة الإضافات الإضافيةعلى الرغم من أنني لا أستخدمه بنفسي. أحضره للتغيير.

أعتقد الآن أن تقرر كيفية إدراج كود html بشكل جميل في مدونة.

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

القليل من الإيجابية:

الضغط على الأزرار الاجتماعية والتعليقات مرحب بها!

اتبع الأزرار ، وأخبر أصدقائك عن المقالة - هذا من أجل المال!

علاوة على ذلك ، أود أن أوضح على الفور أننا سنقوم بإدخال الكود في المقالة نفسها ، حتى يتمكن قرائنا من نسخها دون إضاعة الوقت في كتابة النص نفسه. وبالتالي ، سنزيد من راحة () مواردنا - هذه المرة. نعم ، وستبدو المقالات أكثر احترافًا وانتهاءً - هذان هما.

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

تسأل: "لماذا نستخدمها؟" الجواب بسيط - لا يوجد رفاق للذوق واللون. نكتة. في الواقع ، لقد اخترنا هذا البرنامج المساعد لأنه سهل الاستخدام ، فهو يضيف نمطًا مرئيًا إلى لغات البرمجة المختلفة (css ، html ، java ، javascript ، perl ، sql ، إلخ) ، ولا يتم تحميل الخادم الخاص بنا.

حسنًا ، نظرًا لأنني تركتها تفلت من Wp-Syntex ، فلنستخدمها كمثال لإظهار كيفية إدراج رمز في مقالات WordPress.

تحتاج أولاً إلى تثبيت هذا البرنامج المساعد. تحدثنا عن كيفية القيام بذلك في مقال حول . لذلك ، لوصف هذا الفعللن أكون هنا.

نتيجة لذلك ، سيكون لديك الناتج التالي:

الرمز الذي تريد عرضه

أيضًا ، بدلاً من php في هذا الكود ، يمكنك إدراج لغة برمجة أخرى ، مثل css أو java. في نفس الوقت ، التصميم مظهرسوف يتغير.

ميزات إضافية لـ Wp-Syntex

إذا قمت بإضافة السمة إلى علامة الافتتاح "pre" خط، أي ، الكود الذي سيتعين عليك لصقه سيبدأ على النحو التالي:

الرمز الذي تريد عرضه

أتمنى أن تلاحظ الفرق.

هناك سمة صغيرة أخرى قد تحتاجها - وهي نجا. يسمح لك بتحويل رموز أحرف html مباشرة إلى الأحرف نفسها. على سبيل المثال ، "& gt" سيتحول إلى ">". لكي تعمل هذه الوظيفة ، أدخل السمة التالية في علامة الفتح "pre":

هروب = "صحيح"

وفقًا لذلك ، ستبدأ العلامة على النحو التالي:

< pre lang= "php" line= "1" escaped= "true" >

على الإنترنت أيضًا ، وجدت معلومات تفيد بأنه يمكنك تثبيت مكون إضافي آخر (WP-Syntax Button) ، والذي يعمل جنبًا إلى جنب مع المكون الإضافي الخاص بنا ويضيف زر إدراج رمز إلى محرر WP. لم أكن كسولًا جدًا وقررت اختباره.

فور تثبيته ، تم تنبيهي بحقيقة أنه لم يتم تحديثه لفترة طويلة ولم يتم اختباره باستخدام إصدار WordPress الخاص بنا. حسنًا ، ماذا يمكنني أن أقول ، مخاوفي كانت مبررة.

بعد تنشيط زر WP-Syntax ، قررت في إحدى مقالاتنا أن أحاول إدراج برنامج نصي جافا. فعلت كل شيء كما ورد في جبل التعليمات والتوصيات. لصق النص في المقالة ، وسلط الضوء عليه والضغط على زر "رمز".

بعد ذلك ، أشار إلى لغة البرمجة ورقم السطر الذي يجب أن يبدأ منه إخراج البرنامج النصي.

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

في مدونتنا ، أحاول تحديث جميع المواد باستمرار ، ومراقبة التحديثات باستمرار ، وإذا لزم الأمر ، إجراء تعديلات على المقالات المكتوبة بالفعل.

إذا كنت ترغب في تلقي معلومات محدثة حول بريد إلكترونيثم أوصي به.

فيديو "كيفية إدراج كود HTML في مقالة"

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

مقالات ذات صلة:

حسنًا ، أتمنى أن تكون المقالة غير صعبة ، وقد تمكنت من إخبارك بالتفصيل عن كيفية إدخال كود html في الموقع دون مشاكل غير ضرورية.

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

هذا كل شيء بالنسبة لي!

وداعا وداعا!

مع أطيب التحيات ، أنطون كالميكوف

مرحبا لجميع القراء والمشتركين! أولئك الذين لم يكن لديهم الوقت ليصبحوا واحدًا - من فضلك ، لكي تكون أول من يتعلم مني حول المنشورات الجديدة على موقع مدونة الفيديو

لذلك ، واجهت مشكلة في اليوم الآخر ، لم أتمكن من إدخال كود html على الصفحة ، وبحثت في Google و Yandex وحتى البحث في البريد ، لكنني لم أجد إجابة محددة لسؤالي حول كيفية القيام بذلك مثله.

من السهل جدًا القيام بذلك ، ما عليك سوى استخدام علامة textarea + use خيارات اضافيةالارتفاع والعرض والحشو

دعونا نرتب كيف وماذا. في Wordprese ، يمكنك ببساطة وضع الكود اللازم في المحرر المرئي وسيتم عرضه على النحو التالي:

»alt =" النظام الآلي لكسب المال "/>

ولكن كما ترى ، لا يتم عرض الكود بشكل جميل وليس من الملائم نسخه. لذلك ، لتنفيذ مثل هذه المهام ، تحتاج إلى استخدام العلامة:

.

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

من الضروري مراعاة واستخدام العلامات الإضافية التي تضيف معلمات المسافة البادئة من السطر العلوي النمط = الهامش: 2 بكسل ؛ أيضا معلمة الارتفاع: الارتفاع: 40 بكسل ؛ وبالطبع معلمة العرض: العرض: 660 بكسل

الآن سوف ألخص ما كتبته. عند فتح الكود

وأخيرًا ، كما وعدت ، أرفق ورقة الغش:

كيفية إدراج كود html في صفحة html؟
—————————————

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

الحواشي:
* - علامة تسمح لك بتضمين أي علامة Html في أي صفحة ويب
*أسلوب- معلمة مسؤولة عن نمط وحجم ولون النص داخل العلامة
* الهامش: 5 بكسل- معلمة المسافة البادئة
* العرض: 660 بكسل- معلمة العرض
* الارتفاع: 80 بكسل ؛- معلمة الارتفاع

هذا كل شيء أصدقائي الأعزاء ، اشترك في موجز RSS وأيضًا في قناة اليوتيوب الخاصة بي
مزاج جيد لكم جميعا. 🙂

عن المؤلف

ربما لا يفهم الكثيرون سبب تسمية مدونتي الرفع الاجتماعي من الظلام إلى الشمسثم سأقول وأشرح. بالنسبة لي ، الإنترنت هو المصعد الذي أغوص فيه إلى مستوى المهارات والمهارات والمكاسب التي أحتاجها ؛ لكنها اجتماعية ، لأنها للناس ، للمجتمع ، لأولئك الذين يرغبون ، لأولئك الذين يشبهون رؤيتي إلى حد كبير. مظلم- هذا أحمق ، أو بعبارة أخرى ، قاع حياة عادية كنت فيها ، حيث يعيش الكثير من الآن ، نعم ، ربما نصف الناس في بلدنا في هذا الأحمق ، الذين يعتقدون أن هذا طائر النورس ، لكن لا ... شمس- هذا ما يعطي الحياة لكل شيء يعيش على هذا الكوكب ، بما في ذلك نحن. لو لم تكن هناك شمس لما كانت هناك حياة. شمسهي طاقة الحياة. ولتلخيص كل ذلك ، الإنترنتفرصة مستخدمين عاديينالإنترنت ، الذين يعملون لدى عمي ، يعانون من مشاكل مالية ، أحلم بأن أصبح ثريًا ، لكنهم لا يعرفون من أين يبدؤون. رفع الإنترنتهي عبارة عن منصة تساعد أولئك الذين يرغبون في أن يصبحوا أذكياء قليلاً أو بشكل كبير في تعقيدات ومخططات الكسب. سيكونون قادرين على معرفة من أين تبدأ ، وأين تذهب ، وكيف تصبح رئيسك الخاص. آمل أن تساعدني نصيحتي ومقالاتي أيضًا. منذ يوم من الأيام ، ستفهم سبب إنشاء مدونة ، إذا كنت تعرف شيئًا ما ، فستكون قيمته فقط عندما تتذكره. وعندما تقوم بالتسجيل والمشاركة ، سيكون ذلك إلى الأبد ، بما في ذلك في ذاكرتك !!!

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

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

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

واليوم سأخبرك بكيفية استبدال المكوّن الإضافي SyntaxHighlighter بالرمز المعتاد ، وحتى إدراج زر في لوحة التعديل في مدونتك.

كيفية إدخال رمز في مقال بدون مكون إضافي

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

الكود الخاص بك

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

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

للقيام بذلك بسيط للغاية.

الخيار 1

يمكنك تعيين علامة

Class ، على سبيل المثال ، class = "cod" و set الأنماط المطلوبةفي ملف style.css.

.cod (العرض: تلقائي ؛ لون الخلفية: whitesmoke ؛ الحد: 1 بكسل خالص # C7C3C3 ؛ نصف قطر الحدود: 5 بكسل ؛ اللون: # 167dec ؛)

الخيار 2

يمكنك أيضًا تعيين الأنماط مباشرةً عند إدخال الرمز. سيبدو شيئا من هذا القبيل:

الكود الخاص بك

وفي المثالين الأول والثاني ، إذا خرجت الشفرة المدرجة من المقالة ، فيجب عليك إضافة الخاصية overflow: auto؛ مما سيسمح لك بالتحكم في عنصر الكتلة.

هذه الأساليب جيدة للجميع ، لكني أرغب في شيء أبسط. بشكل عام ، الكسل مرة أخرى - محرك التقدم يجعلك تأتي بشيء يسهل هذه العملية.

كيفية إضافة زر "إدراج رمز" إلى شريط تحرير WordPress

زر بسيط في لوحة تعديل WordPress سيجعل هذه العملية أسهل. وهي تبدو هكذا.

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



تحميل...
قمة