آیا می خواهید JavaScript را در صفحات یا پست های وردپرس خود اضافه کنید؟ بعضی اوقات ممکن است لازم باشد یک کد JavaScript به کل وب سایت یا صفحات خاص اضافه کنید. به طور پیش فرض ، وردپرس به شما اجازه نمی دهد مستقیماً در پست های خود کد اضافه کنید. در این مقاله ، ما به شما نشان خواهیم داد که چگونه JavaScript را به راحتی در صفحات یا پست های وردپرس اضافه کنید.
جاوا اسکریپت چیست؟ h4>
JavaScript یک زبان برنامه نویسی است که نه بر روی سرور شما بلکه در مرورگر کاربر اجرا می شود. این برنامه نویسی سمت سرویس گیرنده به توسعه دهندگان این امکان را می دهد تا کارهای بسیار جالب را بدون کند کردن سرعت وب سایت شما انجام دهند.
اگر می خواهید یک پخش کننده ویدیو را تعبیه کنید ، یک ماشین حساب یا یک سرویس شخص ثالث دیگر اضافه کنید ، از شما معمولاً خواسته می شود که یک قطعه کد JavaScript را در وب سایت خود کپی و جایگذاری کنید.
قطعه کد معمولی JavaScript ممکن است به این شکل باشد:
// برخی از کدهای JavaScript
حال ، اگر یک قطعه کد javascript را به یک پست یا صفحه وردپرس اضافه کنید ، هنگام تلاش برای ذخیره آن توسط وردپرس حذف می شود.
با این گفته ، بیایید ببینیم که چگونه می توانید به راحتی JavaScript را در صفحات یا پست های WordPress بدون شکستن وب سایت خود اضافه کنید.
روش 1. با استفاده از درج سرصفحه ها و پاورقی ها JavaScript را در سطح سایت اضافه کنید h4>
گاهی اوقات از شما خواسته می شود یک قطعه کد JavaScript را در وب سایت خود کپی و جایگذاری کنید تا یک ابزار شخص ثالث اضافه کنید. این اسکریپت ها معمولاً قبل از برچسب وب سایت شما به قسمت head یا در پایین می روند. به این ترتیب کد در هر نمای صفحه بارگذاری می شود.
به عنوان مثال ، نصب Google Analytics کد باید در هر صفحه وب سایت شما وجود داشته باشد ، بنابراین می تواند بازدیدکنندگان وب سایت شما را ردیابی کند.
می توانید چنین کدی را به پرونده های header.php یا footer.php قالب وردپرس خود اضافه کنید. با این حال ، هنگام تغییر یا تغییر موضوع ، این تغییرات دوباره رونویسی می شوند.
به همین دلیل توصیه می شود برای بارگذاری javascript در سایت خود از یک افزونه استفاده کنید.
ابتدا باید درج سرصفحه ها و پاورقی ها . برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .
پس از فعال شدن ، باید به صفحه تنظیمات »درج سرصفحه ها و پاورقی ها بروید. دو جعبه خواهید دید ، یکی برای هدر و دیگری برای قسمت پاورقی.
اکنون می توانید کد JavaScript را که کپی کرده اید در یکی از این جعبه ها پیست کرده و سپس بر روی دکمه ذخیره کلیک کنید.
افزونه Insert Headers and Footers اکنون کدی را که در هر صفحه وب سایت خود اضافه کرده اید به طور خودکار بارگیری می کند.
روش 2. افزودن کد JavaScript به صورت دستی با استفاده از کد
این روش شما را ملزم می کند کدی را به پرونده های وردپرس خود اضافه کنید. اگر قبلاً این کار را نکرده اید ، لطفاً به راهنمای ما در نحوه کپی و جایگذاری کد در وردپرس .
ابتدا ، بیایید نگاهی به نحوه افزودن کد به هدر سایت وردپرس خود بیاندازیم. شما باید کد زیر را به functions.php موضوع خود اضافه کنید فایل یا افزونه اختصاصی سایت .
تابع wpb_hook_javascript () {
؟>
افزودن جاوا اسکریپت به یک پست خاص وردپرس یا صفحه با استفاده از کد
فرض کنید شما فقط می خواهید این javascript را در یک پست خاص وردپرس بارگذاری کنید. برای انجام این کار ، باید منطق شرطی را به کد اضافه کنید. به مثال زیر نگاهی بیندازید:
تابع wpb_hook_javascript () {
if (is_single ("16")) {
؟>
// کد javscript شما به اینجا می رود
اگر به کد بالا نگاهی دقیق بیندازید ، خواهید دید که ما کد javascript را با منطق شرطی منطبق کرده ایم تا با یک شناسه پست خاص مطابقت داشته باشد. می توانید با جایگزینی شماره 16 با شناسه پست خود از این مورد استفاده کنید.
اکنون ، این کد برای هر نوع پستی به جز صفحات کار می کند. بیایید نگاهی به مثال دیگری بیندازیم ، به غیر از این مورد قبل از افزودن کد javascript به بخش head ، یک شناسه صفحه خاص را بررسی می کند.
تابع wpb_hook_javascript () {
if (is_page ("10")) {
؟>
// کد javscript شما به اینجا می رود
به جای is_single ، اکنون از is_page برای بررسی شناسه صفحه استفاده می کنیم.
برای افزودن کد javascript به پاورقی سایت شما ، می توانیم از همان کد با کمی تغییر استفاده کنیم. به مثال زیر نگاهی بیندازید.
تابع wpb_hook_javascript_footer () {
؟>
به جای اینکه عملکرد خود را با wp_head وصل کنیم ، اکنون آن را به wp_footer وصل کرده ایم. همچنین می توانید از آن با برچسب های شرطی برای افزودن Javascript به پست ها یا صفحات خاص استفاده کنید.
روش 3. افزودن کد Javascript در داخل پست ها یا صفحات با استفاده از پلاگین h4>
این روش به شما امکان می دهد در هر کجای پست ها و صفحات وردپرس خود کد اضافه کنید. همچنین می توانید در محتوایی که می خواهید کد جاوا اسکریپت را تعبیه کنید ، انتخاب کنید.
ابتدا باید افزونه کد تعبیه شده . برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .
پس از فعال سازی ، باید پست یا صفحه ای را که می خواهید جاوا اسکریپت را در آن اضافه کنید ویرایش کنید. در صفحه ویرایش پست ، روی دکمه " گزینه های صفحه کلیک کنید و علامت گزینه 'Custom Fields'.
اکنون به پایین و پایین ویرایشگر پیمایش کنید ، متاباکس «زمینه های سفارشی» را مشاهده می کنید که در آن باید روی پیوند «وارد کردن جدید» کلیک کنید.
نام فیلد سفارشی و فیلدهای مقدار اکنون ظاهر می شوند.
شما باید یک نام برای قسمت سفارشی با پیشوند CODE (به عنوان مثال CODEmyjscode) ارائه دهید و سپس کد javascript را در قسمت مقدار جای گذاری کنید.
برای ذخیره قسمت سفارشی خود ، فراموش نکنید که روی دکمه "افزودن زمینه سفارشی" کلیک کنید.
اکنون می توانید با استفاده از این قسمت سفارشی کد JavaScript را در هر کجای این پست یا صفحه تعبیه کنید. به سادگی این کد تعبیه شده را در هر کجای محتوای پست خود اضافه کنید.
{{CODEmyjscode}}
اکنون می توانید پست یا صفحه خود را ذخیره کرده و سایت خود را مشاهده کنید. با استفاده از عنوان ابزار بازرسی یا با مشاهده منبع صفحه.
نکته: این روش ها برای مبتدیان و دارندگان وب سایت است. اگر در حال یادگیری قالب وردپرس یا توسعه پلاگین هستید ، باید به درستی جاوا اسکریپت و شیوه نامه ها را به پروژه های خود اضافه کنید.
امیدواریم این مقاله به شما کمک کند یاد بگیرید چگونه به راحتی JavaScript را در صفحات یا پست های وردپرس اضافه کنید. همچنین ممکن است بخواهید لیست ما را از ترفندهای بسیار مفید برای فایل توابع وردپرس .
اگر این مقاله را دوست داشتید ، لطفاً در کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .
منبع:
https://www.wpbeginner.com/wp-tutorials/how-to-easily-add-javascript-in-wordpress-pages-or-posts/.