كيفية إضافة كود JavaScript داخل منشور WordPress؟

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

هناك العديد من أكواد JavaScript سهلة الاستخدام التي يشاركها الآخرون على الإنترنت.

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

كيفية إضافة كود JS إلى مقالات WordPress

تعد إضافة كود JavaScript إلى منشور WordPress أمرًا بسيطًا للغاية.

بعد ذلك، سيشارككم تشين ويليانغ : كيفية إضافة كود جافا سكريبت إلى منشور ووردبريس؟

عادة ما تكون هناك طريقتان لإضافة رمز JS:

1. أضف كود JS مباشرة إلى مشاركات WordPress
2. استدعاء كود JS في مقالة WordPress بعد كتابة ملف JS

1) أضف كود JS مباشرة إلى منشور WordPress

الطريقة الأولى هي كتابة JavaScript مباشرة في منشور WordPress.

هذا مثال على طباعة النص "Hello World!" ▼

<script type="text/javascript">// <![CDATA[
document.write("Hello World!")
// ]]></script>

هذا في منشور WordPress الذي يعرض "Hello World!" بعد تنفيذ JavaScript ▼

2) بعد كتابة ملف JS ، اتصل برمز JS في مقالة WordPress

الطريقة الثانية ، اكتب كود JavaScript في ملف منفصل.

ثم في منشور WordPress حيث يلزم إدراج JavaScript ، اتصل بملف JavaScript من خلال محرر نصوص WordPress.

المثال التالي موجود في منشور WordPress ، يطبع نص "Hello World" ▼

<script type="text/javascript" src="https://img.chenweiliang.com/javascript/hello.js">// <![CDATA[
// ]]></script>

محتوى ملف JavaScript hello.js ▼

document.write("Hello World");

تُظهر إضافة كود JavaScript إلى منشور WordPress النتائج ▼

يستدعي WordPress كود JS لتاريخ اليوم

هناك الكثير من أكواد JavaScript الممتعة والمفيدة على الإنترنت.

الآن أعط مثالا على كيفية استخدامها؟

اطبع تاريخ اليوم في منشورات WordPress.

أدخل ملف JavaScript date.js التالي في منشور WordPress الخاص بك ▼

<script type="text/javascript" src="https://img.chenweiliang.com/javascript/date.js"></script>
<script type="text/javascript">// <![CDATA[
     // call function if required.
// ]]></script>

يوجد أدناه محتوى JavaScript لملف date.js ▼

var calendarDate = getCalendarDate();

document.write("Today is: " + calendarDate);

function getCalendarDate()
{
   var months = new Array(13);
   months[0]  = "January";
   months[1]  = "February";
   months[2]  = "March";
   months[3]  = "April";
   months[4]  = "May";
   months[5]  = "June";
   months[6]  = "July";
   months[7]  = "August";
   months[8]  = "September";
   months[9]  = "October";
   months[10] = "November";
   months[11] = "December";
   var now         = new Date();
   var monthnumber = now.getMonth();
   var monthname   = months[monthnumber];
   var monthday    = now.getDate();
   var year        = now.getYear();
   if(year < 2000) { year = year + 1900; }
   var dateString = monthname +
                    ' ' +
                    monthday +
                    ', ' +
                    year;
   return dateString;
} // function getCalendarDate()

هذه نتيجة تنفيذ JavaScript لتاريخ اليوم في منشور WordPress ▼

فيما يلي نتيجة ملف جافا سكريبت date.js الذي تم تنفيذه في هذه المقالة ▼

注意 事项

لإدراج كود JS في منشور ، تحتاج إلى تبديل محرر WordPress إلى وضع النص.

انتباه خاص和之间不能有换行。

إذا كان هناك فاصل سطر ، فسيقوم WordPress بمعالجته تلقائيًا كفقرة ، ويضيف تلقائيًا علامة p التي تتسبب في فشل كود البرنامج النصي JS.

يوجد المزيد من المقالات حول كود WordPress JavaScript هنا ▼

🔗كيفية تحديد صفحات المقالة لتحميل كود JavaScript/CSS في WordPress؟

🔗كيفية جعل WordPress يؤخر تحميل JavaScript لتسريع عرض الصفحة؟

🔗كيفية إدخال JavaScript بشكل صحيح في WordPress؟ تحميل مخصص لملفات JS وCSS