Shortcodeها در وردپرس

یکی از عوامل مهم که باعث شده وردپرس به یک سیستم مدیریت محتوای محبوب تبدیل بشه، انعطاف و توسعه پذیری ساده اون هست. در این مطلب قصد دارم یکی از کاربردی‌ترین موارد در بحث توسعه این سیستم که Shortcodeها هستند رو در شکلی ساده و مفهوم بررسی کنیم.

به طور خلاصه، Shortcodeها این امکان رو فراهم می‌کنن تا ما دستورات (امکانات) خاصی رو برای صفحات و یا قسمت‌های مورد نظر خودمون پیاده سازی کنیم.

 

فراخوانی Shortcode:

Shortcode به صورت زیر فراخوانی می‌شه:

[first-gallery]

 

اگر شما از افزونه‌های مرتبط با گالری استفاده می‌کنید، به احتمال زیاد محتوای قسمت ویرایش متن صفحه شما به این شکل خواهد بود.

اما شکل دیگری هم برای فراخوانی وجود داره، اغلب برای زمانی که قرار هست شما مقادیر ثانوی رو به تابع اصلی اضافه کنید:

[button]Click Here[/button]

 

[link to="www.masoodsadri.com"]Masood Sadri[/link]

 

نحوه ساخت هر دو نوع تعریف شده، دو مرحله مشترک داره:

مرحله اول: نوشتن تابع اصلی.

مرحله دوم: تعریف تابع به عنوان Hook در وردپرس.

 

مثال اول:

نوشتن تابع اصلی:

این تابع به عنوان هسته اصلی کدهای ما در نظر گرفته می‌شه. محتوای تابع قرار هست امکانات مورد نظر ما رو پردازش کنه.

function my_first_shortcode() {
    return 'This function print a simple string. ';
}

تعریف تابع به عنوان Hook در وردپرس:

مرحله بعدی، تعریف تابع نوشته شده برای سیستم وردپرس هست. زمانی که ما از متد add_shortcode استفاده کنیم، این امکان به وجود می‌آد که ما بتونیم تابعی که نوشتیم رو در قسمت‌های مختلف فراخوانی کنیم.

add_shortcode('shortcode', ' my_first_shortcode ');

 

توجه داشته باشید که متد add_shortcode باید بعد از اتمام کدهای تابع نوشته بشه.

در این صورت با نوشتن [shortcode] در ویرایشگر متن صفحه یا نوشته دلخواه، محتوای تابع به صورت داینامیک نمایش داده می‌شن.

 

مثال دوم:

حالت بعدی، نوشتن Shortcodeهایی هست که بعد از فراخوانی تصمیم داریم به اونها محتوای خاصی (مقادیر ثانوی) اضافه کنیم. همون طور که مثال زدیم، به این صورت فراخوانی می‌شه:

[quote]Some text[/quote]

 

ابتدا باید تابع اصلی رو تعریف کنیم. در این حالت، تابع ما دو مقدار رو به عنوان ورودی در نظر می‌گیره. متغیر $atts به عنوان ویژگی‌ها و $content متن قابل ویرایش در ویرایشگر وردپرس. تابع ما به این شکل خواهد بود:

function quote( $atts, $content = null ) {
    return '<div>"'.$content.'"</div>';
}

طبق مثال قبلی، به این صورت برای وردپرس اضافه می‌کنیم:

add_shortcode("quote", "quote");

 

شما خیلی ساده می‌تونید برای متغیر $content تگ‌های HTML و کلاس‌های CSS اضافه کنید تا متن شما به شکلی که مایل هستید نمایش داده بشه.

 

مثال سوم:

اما زمانی که تصمیم داشته باشید یک “ویژگی” به متن قابل ویرایش Shortcode اضافه کنید، مانند لینک شدن به یک آدرس. مثل مواردی که گفته شد، مرحله اول تعریف تابع اصلی هست. زمانی که قرار باشه یک ویژگی، به متغیر ما اضافه بشه، تابع به این صورت خواهد بود:

function link($atts, $content = null) {
    extract(shortcode_atts(array(
        "to" => 'http://masoodsadri.com'
    ), $atts));
    return '<a href="'.$to.'">'.$content.'</a>';
}

 

به طور خلاصه این طور تعریف کردیم که، آدرس masoodsadri.com محتوای آرایه “to” هست و این به عنوان یک ویژگی در نظر گرفته شده. زمانی که این تابع فراخوانی بشه، متغیر $content متن قابل ویرایش برای تگ <a> هست. مرحله بعدی هم مانند قبل، اضافه شدن به سیستم وردپرس:

add_shortcode("link", "link");

 

در نتیجه با نوشتن [link to=”www.masoodsadri.com”]Masood Sadri[/link] در ویرایشگر متن وردپرس، تابع link فراخوانی خواهد شد.

 

شما می‌تونید این توابع رو داخل فایل functions.php قالب خودتون بنویسید.

یک دیدگاه برای “Shortcodeها در وردپرس

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *