گاهی برای اضافه کردن یک امکان دلخواه، افزونهای وجود ندارد و باید از کدها استفاده کنیم. همانطور که میدانید وردپرس یک سیستم متن باز بوده و خوراک توسعه دهندگان است. یعنی هر گونه امکانی را که بخواهند میتوانند با کمک کدنویسی در آن وارد کنند. اما امروز افزونهای را برایتان آوردیم که شما نیز با کمک آن بتوانید به بخش هدر و فوتر سایت امکانات و تغییرات دلخواه خود را اضافه کنید. وارد کردن کدهای سفارشی در وردپرس با این افزونه کاری آسان و جذاب خواهد بود.
وارد کردن کدهای سفارشی در وردپرس با Insert Headers and Footers
Insert Headers and Footers یکی از بهترینها برای افزودن قطعه کد در وردپرس است که تا به امروز بیش از ۱ میلیون استفاده داشته است. اگر بخواهیم کدها را بصورت دستی در وردپرس وارد کنیم، قطعا نیازمند تغییراتی در function.php هستیم و چنانچه فردی حرفهای نباشیم ممکن است این بخش را دچار اختلال کنیم. از این رو افزونه مذکور روی کار آمد تا چنین مشکلاتی را رفع کند.
پیش نیاز: برای استفاده از چنین افزونههایی می بایست با کدهای HTML, Css, JavaScrip آشنایی داشته باشید. اگر هم آشنایی ندارید میتوانید با مطالعه کوتاهی در این باره اطلاعات مفیدی را بدست آورید.
مراحل نصب و راه اندازی افزونه
برای شروع کار ابتدا افزونه را دریافت نموده و سپس آن را نصب کنید. بعد از نصب در بخش تنظیمات پیشخوان سایت وردپرسی بخشی با عنوانInsert Header And Footer جهت وارد کردن کدهای سفارشی در وردپرس ساخته شده است.
روی آن کلیک کنید تا به تنظیمات افزونه بروید. حال با صفحه تنظیمات مشابه تصویر زیر مواجه خواهید شد.
تمامی تنظیمات این افزونه تنها محدود به همین صفحه میشود. پس با هم بخشهای آن را بررسی میکنیم.
- Script in Header: در این فیلد کدها و اسکریپت هایی را که میخواهید در هدر قالب بارگذاری شوند را وارد کنید. تمامی کدهایی را که در این قسمت وارد می کنید در تگ <head> قرار میگیرند.
- Script in Footer: در این فیلد نیز کدها و اسکریپتهایی را که میخواهید در فوتر قالب لود شوند را وارد کنید. تمامی کدهایی را که در این قسمت وارد میکنید قبل از تگ بسته ی </body> قرار می گیرند. این یعنی در انتهای تمامی کدهای قالب.
نمونه انجام شده
برای تست عملکرد صحیح وارد کردن کدهای سفارشی در وردپرس، مثال بسیار سادهای را آماده کردیم. همان طور که در تصویر بالا مشاهده میکنید در فیلد Footer چند خط کد قرار دادیم.
خروجی این کد نمایش لوگوی سایت همیار وردپرس است که میخواهیم آن را در فوتر قالب به کمک این افزونه نمایش دهیم.
ابتدا از قسمت رسانه تصویر همیار وردپرس را آپلود کردیم و لینک آن را در ویژگی src تگ <img> قرار دادیم.
در نهایت برای ذخیره تمامی تغییرات روی گزینه ی Save کلیک میکنیم.
مشاهده ی خروجی
همان طور که انتظار داشتیم لوگوی همیار وردپرس در بخش فوتر سایت مشاهده میشود.
توضیحات بیشتر…
این یک مثال کاربردی تنها برای این که بدانید چگونه از این افزونه و در چه مواقعی استفاده می کنیم.
اگر با پلاگین های حرفه ای مختلف جی کوئری آشنایی داشته باشید می توانید استفاده ی بهتری از این افزونه داشته باشد، اگر هم آشنایی ندارید با جستجو در گوگل به نتایج خوبی خواهید رسید.