افزودت متاباکس اختصاصی با افزونه Advanced Custom Fields
ایا شما قصد اضافه کردن متاباکس سفارشی برای برگه ها و پست های وردپرس خود دارید؟
باکس های متای سفارشی عموما برای فراهم کردن رابط کاربری بهتر به جهت افزودن فیلدهای اضافه تر به محتویات سایت ( meta data ) استفاده می شوند. در این مقاله ما توضیح خواهیم داد که باکس متای سفارشی چیست و چگونه می توان به مطالب باکس متای سفارشی افزود.
متاباکس سفارشی در وردپرس چیست؟
باکس متای سفارشی یک واسط کاربری راحت تر برای افزودن فیلدهای سفارشی ( meta data) به پست ها و صفحات وردپرس شماست.
به طور معمول هر مطلبی از محتویات عادی و داده های متای ان تشکیل شده است. داده های متا اطلاعات وابسته به محتویات آن مطلب شبیه تاریخ ، زمان ،نوسینده مطلب ، عنوان و… است. شما با استفاده از فیلد سفارشی امکان افزودن تابع متای شخصی خود را خواهید داشت.
در بالا اضافه کردن داده های متا با استفاده از جعبه ی پیش فرض فیلدهای اختصاصی را مشاهده می کنید. ولی وردپرس به توسعه دهندگان اجازه می دهد که جعبه متاهای اختصاصی به خود را در صفحه ی ویرایش پست ایجاد و اضافه نمایند. این گونه است که اکثر پلاگین های گزینه های مختلفی را در صفحه ی ویرایش پست می افزایند.
به عنوان مثال در پلاگین یوآست سئو جعبه ی توضیحات متا و عنوان سئو در داخل این پلاگین یک باکس متای اختصاصی است.
هم اکنون به اتفاق بررسی میکنیم که چگونه می توانیم متاباکس های اختصاصی را به قالب خود بیافزاییم.
ساخت متاباکس اختصاصی در وردپرس
انچه در ابتدا بایستی انجام شود نصب و فعال سازی افزونه Advanced Custom Fields است. بعد از فعال سازی ، افزونه یک گزینه ی جدید با عنوان Custom Fields به ستون مدیریت وردپرس شما اضافه می کند. با کلیک بر روی ان صفحه پلاگین باز می شود ولی لیست ان خالی است چون شما قبلا فیلدی اضافه نکرده اید . برای افزودن بر روی دکمهی ‘Add New کلیک کنید. سپس شما بایستی عنوای را برای تایتل جعبه ی متای اختصاصی خود برگزینید و سپس به سادگی با زدن + Add Field می توانید فیلدهای مورد نظر خود را بیافزایید.
با این کار فرم تنظیمات فیلد اورده می شود که در آن عنوانی برای فیلد باید برگزید. و پس از ان نوع آن را انتخاب نمود
در زیر آن گزینه ها و تنظیمات دیگری را برای فیلد خود مشاهده می کنید که بایستی با دقت انها را مرور نمایید و بر اساس نیازتان انها را تنظیم نمایید.
پس از افزودن فیلدها ، در قسمت مکان فیلد بایستی تعیین کنید که در کجا فیلد شما نمایش داده شود.
افزونه Advanced Custom Fields با مجموعه قوانی مفید از قبل تعریف شده به کمک شما می اید تا صرفا از بین انها انتخاب نمایید . برای مثال شما میتوانید نوع پست ، گروه و طبقه بنید ان و… را انتخاب نمایید.
سپس نوبت به تنظیمات متاباکس می رسد.
ابتدا شما بایستی ترتیب ان را مشخص کنید. اگر شما برای یک مکان یک سری فیلد گروهی را تعریف کرده اید شما می توانید ترتیب نمایش ان ها را تعیین کنید. اگر شما مردد هستید می توانید عدد 0 را در این قسمت وارد کنید.
پس از آن شما بایستی جایگاه متا باکس را را در صفحه انتخاب کنید . مثلا می توانید انتخاب کنید که در بعد از مطالب ، قبل از مطالب یا در ستون کناری نشان داده شود. در قسمت بعد نیز می توانید استایلی برای نمایش متاباکس مورد نظر انتخاب نمایید. در پایان شما لیستی از فیلدهایی که به طور طبیعی در صفحه ی نمایش پست ظاهر خواهد شد را خواهید دید. اگر شما قصد پنهان کردن فیلد خاصی را داشته باشید از این قسمت ان را انتخاب می نمایید. در وصرتی که در این مورد نیز مردد هستید بهترین حالت خالی گذاشتن ان است. در پایاین با زدن گزینه publish متابکس شما اماده ی استفاده خواهد بو.د.
تبریک می گوییم. تا اینجا شما متاباکس اختصاصی خود را به وردپرس افزودید.
بر طبق تنظیماتی که انجام داده اید شما می توانید متاباکسی که ایجاد کرده اید را در صفحه ی پست خود مشاهده نمایید.
نمایش اطلاعات متاباکس ایجاد شده در قالب وردپرس
تا اینجا ما یک متاباکس اختصاصی ایجاد کردیم که در هنگاک ارسال پست داده هایی را از کاربر دریافت کند. اکنون نوبت آن است که تعیین کنیم این داده در کدام قسمت از قالب نمایش داده شود. در اینجا شاید نیاز باشد که شما نام گروه فیلدهای ایجاد شده را ویرایش نمایید. در صفحه Edit Field Group شما گروه فیلدهای خود را به همراه نام انها خواهید دید.
برای این کار افزونه Advanced Custom Fields دو روش در اختیار شما می گذارد.
در روش اول شما می توانید با استفاده از کدهای کوتاه فیلد مورد نظر خود را در پستها نمایش دهید.
[acf field="article_byline"]
همچنین می توانید انها را بوسیله ی افزودن کد در فایل های قالب نمایش دهید. شما نیاز دارید فایل های قالب مربوط به جایی که شما میخواهید فیلد مورد نظر نمایش داده شود را ویرایش نموده . مثلا single.php, content.php, page.php و …
همچنین شما بایستی هنگام اضافه کردن کد اطمینان حاصل کنید که ان را در حلقه ی وردپرس افزوده اید. راحت ترین راه برای مطمئن شدن ازین مسئله این است که در بین کدها به دننبال خط کدی شبیه کد زیر بگردید:
<?php while ( have_posts() ) : the_post(); ?>
شما میتوانید کد مورد نظر خود را بعد از این خط و یا قبل از خط مربوط به بسته شدن کد قرار دهید:
<?php endwhile; // end of the loop. ?>
کد فیلد اختصاصی شما می تواند این گونه می باشد:
<h2 class="article-byline"><?php the_field('article_byline'); ?></h2>
دقت کنید که ما چگونه انرا به تگ H2 و کلاس css اختصاص دادیم تا بعدا شما به راحتی بتوانید در فایل css تغییرات مدنظر خود را اعمال نماییید
کد پیشنهادی دیگر برای نمایش فیلد اختصاصی تان می تواند اینگونه باشد:
<blockquote class="article-pullquote">
<?php the_field('article_pullquote'); ?>
</blockquote>
فراموش نکنید که در این کدها نام فیلد را با نام فیلد اختصاصی خودتان جایگزین نمایید.
Advanced Custom Fields یک افزونه بسیار قدرتمند با قابلیت ها بسیار است که می توانید در این زمینه هر نیازی دارید با استفاده از ان بر طرف سازید.
امیدواریم این آموزش از سری اموزش های های وردپرس داغ برای شما مفید قرار گرفته باشد.
