كيفية استخدام قالب HTML المخصص لـ WordPress

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

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

اشترك في قناتنا على اليوتيوب

كيفية إضافة قالب HTML مخصص إلى منشورك أو صفحتك

لإضافة Custom HTML Block إلى المحتوى الخاص بك ، ضع المؤشر في المكان الذي تريد ظهور الكتلة فيه وحدد أداة Inserter. سيتم فتح مربع بحث حيث يمكنك إدخال مصطلح بحث أو التمرير عبر خياراتك. ابحث عن html وحدد الكتلة عند عرضها في النتائج.

بالتناوب ، يمكنك كتابة / html حيث تريد ظهور الكتلة والضغط على Enter أو تحديدها من الخيارات الموجودة أعلى منطقة الحظر.

لديك الآن كتلة HTML مخصصة داخل المحتوى الخاص بك حيث يمكنك إضافة HTML. سنرى بعض الأمثلة مع التعليمات البرمجية أثناء استعراض الإعدادات.

إعدادات وخيارات كتلة HTML المخصصة

على عكس معظم الكتل ، لا تتضمن Custom HTML Block خيارات في الشريط الجانبي للمحرر. ستجد كل الخيارات التي تحتاجها في شريط الأدوات.

شريط أدوات كتلة HTML المخصص

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

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

دعونا نلقي نظرة على كل إعداد بالتفصيل.

قالب أو نمط تغيير HTML المخصص

يؤدي تحديد HTML في الخيارات إلى فتح مربع قائمة منسدلة حيث يمكنك تحويل الكتلة إلى أنواع أخرى من الكتل. تتضمن الخيارات التعليمات البرمجية أو الأعمدة أو المجموعة.

رمز - يحول Custom HTML Block إلى Code Block بحيث يمكنك عرض أنواع مختلفة من التعليمات البرمجية.

الأعمدة - يضع الكتلة داخل الأعمدة.

المجموعة - تضيف الكتلة إلى مجموعة حتى تتمكن من تعديلها ككتلة واحدة.

أداة سحب كتلة HTML المخصصة

تتضمن أداة السحب ست نقاط يمكنك انتزاعها بالماوس لتحريكها.

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

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

نقل كتلة HTML المخصص

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

HTML مخصص بلوك HTML ومعاينة

يتيح لك أزرار HTML و Preview تحديد كيفية عمل الكتلة مع HTML في المحرر. يتم تحديد زر HTML افتراضيًا. يعرض هذا HTML في شكل كود خاص به بدلاً من تنفيذه. يوضح هذا المثال HTML لخريطة Google.

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

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

إليك وضع المعاينة الذي يوضح كيف سيبدو على الواجهة الأمامية.

خيارات كتلة HTML المخصصة

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

إليك ما يمكن أن تفعله خيارات Custom HTML Block:

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

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

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

مكرر - يؤدي هذا إلى وضع نسخة مكررة من الكتلة أسفل الأصل.

إدراج قبل - يؤدي هذا إلى إضافة منطقة كتلة قبل كتلة HTML المخصصة حتى تتمكن من وضع كتلة أخرى.

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

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

إضافة إلى الكتل القابلة لإعادة الاستخدام - تضيف كتلة HTML المخصصة إلى الكتل القابلة لإعادة الاستخدام بحيث يمكنك استخدامها مرة أخرى في أي صفحة أو منشور.

المجموعة - يضيف هذا الكتلة إلى مجموعة حتى تتمكن من ضبط الكتل كوحدة واحدة.

إزالة الكتلة - يؤدي هذا إلى حذف الكتلة.

تلميحات وأفضل الممارسات لاستخدام قالب HTML المخصص بشكل فعال

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

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

يؤدي استخدام هذا الحظر بدلاً من إصدار Code Editor لصفحاتك ومنشوراتك إلى عدم الاضطرار إلى العمل مع الصفحة ونشر العلامات. هذا يخلق بيئة عمل أنظف أسهل في الاستخدام.

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

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

الأسئلة المتداولة حول كتلة HTML المخصصة

ماذا تفعل كتلة HTML المخصصة؟

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

كيف يمكن استخدام Custom HTML Block؟

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

هل سترمز إلى اللون للترميز؟

لا ، يبدو الترميز في الكتلة مثل أي محرر نصوص.

هل تقوم كتلة HTML المخصصة بتشغيل HTML؟

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

هل جميع علامات HTML تدعم؟

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

استنتاج

هذه هي نظرتنا إلى Custom HTML Block. هذه الكتلة ليست للمطورين فقط. الميزة الرئيسية لاستخدام هذه الكتلة هي أنك لست مضطرًا للتبديل بين المحرر المرئي ومحرر التعليمات البرمجية للعمل مع HTML. هذا يعني أنه يمكنك العمل مع عرض باقي المحتوى كالمعتاد. يمكنك بعد ذلك العمل مع HTML في الكتلة ومعاينتها في أي وقت. يوفر Custom HTML Block طريقة سهلة للعمل مع HTML في محرر الكتلة.

نريد أن نسمع منك. هل تستخدم قالب HTML المخصص؟ أخبرنا عن تجربتك في التعليقات.

صورة مميزة عبر enterlinedesign / shutterstock.com