یکی از چالشهای مدیران فروشگاههای اینترنتی، هدایت مشتریان به صفحات مهم مانند فرمهای مشاوره، پیشنهادات ویژه، صفحات فرود، و تخفیفهای خاص است. بسیاری از قالبهای ووکامرس این قابلیت را ندارند، اما با این راهکار میتوانید برای هر محصول یک دکمه سفارشی با متن، آیکن، رنگ، و لینک دلخواه ایجاد کنید.
🔹 این دکمه بهطور مستقیم در صفحه محصول و کنار دکمه “افزودن به سبد خرید” نمایش داده میشود و فقط در صورتی که مقدار لینک وارد شده باشد، فعال خواهد شد.
🔹 همچنین، قابلیت انتخاب آیکن از مجموعههای محبوب مانند Font Awesome، Bootstrap Icons، Material Icons و … وجود دارد تا طراحی دکمه مطابق برند شما باشد.
💡 مزایای این قابلیت:
✔ هدایت مشتریان به صفحات مهم
✔ افزایش نرخ تبدیل با لینکدهی هوشمند
✔ استایلدهی و سفارشیسازی کامل
✔ نمایش فقط در صورت نیاز، بدون تأثیر بر سایر محصولات
// افزودن یک متاباکس برای وارد کردن تنظیمات دکمه در صفحه ویرایش محصول ووکامرس
function tav_custom_button_metabox() {
add_meta_box(
'tav_custom_button',
__('تنظیمات دکمه سفارشی', 'tav-theme'), // عنوان متاباکس
'tav_custom_button_metabox_callback', // تابعی که متاباکس را نمایش میدهد
'product', // نوع پست که متاباکس به آن اضافه میشود (محصولات ووکامرس)
'side', // محل نمایش در پنل ویرایش
'high' // اولویت نمایش
);
}
add_action('add_meta_boxes', 'tav_custom_button_metabox');
// تابع برای نمایش فیلدهای تنظیمات دکمه در متاباکس
function tav_custom_button_metabox_callback($post) {
// دریافت مقادیر ذخیرهشده قبلی برای پر کردن فرم
$button_text = get_post_meta($post->ID, '_tav_button_text', true);
$button_url = get_post_meta($post->ID, '_tav_button_url', true);
$button_icon = get_post_meta($post->ID, '_tav_button_icon', true);
$button_color = get_post_meta($post->ID, '_tav_button_color', true);
$button_radius = get_post_meta($post->ID, '_tav_button_radius', true);
// افزودن nonce برای امنیت بیشتر هنگام ذخیره اطلاعات
wp_nonce_field('tav_custom_button_nonce', 'tav_custom_button_nonce_field');
?>
<p>
<label for="tav_button_text"><?php _e('متن دکمه:', 'tav-theme'); ?></label>
<input type="text" id="tav_button_text" name="tav_button_text" value="<?php echo esc_attr($button_text); ?>" class="widefat">
</p>
<p>
<label for="tav_button_url"><?php _e('لینک دکمه:', 'tav-theme'); ?></label>
<input type="url" id="tav_button_url" name="tav_button_url" value="<?php echo esc_url($button_url); ?>" class="widefat">
</p>
<p>
<label for="tav_button_icon"><?php _e('کلاس آیکن (مثلا fa fa-link):', 'tav-theme'); ?></label>
<input type="text" id="tav_button_icon" name="tav_button_icon" value="<?php echo esc_attr($button_icon); ?>" class="widefat">
</p>
<p>
<label for="tav_button_color"><?php _e('رنگ دکمه:', 'tav-theme'); ?></label>
<input type="color" id="tav_button_color" name="tav_button_color" value="<?php echo esc_attr($button_color); ?>">
</p>
<p>
<label for="tav_button_radius"><?php _e('بوردر رادیوس (px):', 'tav-theme'); ?></label>
<input type="number" id="tav_button_radius" name="tav_button_radius" value="<?php echo esc_attr($button_radius); ?>" class="widefat">
</p>
<?php
}
// تابع برای ذخیره مقادیر وارد شده در متاباکس هنگام ذخیره محصول
function tav_save_custom_button_metabox($post_id) {
// بررسی nonce برای جلوگیری از حملات CSRF
if (!isset($_POST['tav_custom_button_nonce_field']) || !wp_verify_nonce($_POST['tav_custom_button_nonce_field'], 'tav_custom_button_nonce')) {
return;
}
// جلوگیری از ذخیرهسازی خودکار وردپرس که ممکن است دادههای ناقص ذخیره کند
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
return;
}
// بررسی دسترسی کاربر برای ویرایش محصول
if (!current_user_can('edit_post', $post_id)) {
return;
}
// ذخیره دادههای ورودی از متاباکس در متادیتای محصول
update_post_meta($post_id, '_tav_button_text', sanitize_text_field($_POST['tav_button_text']));
update_post_meta($post_id, '_tav_button_url', esc_url($_POST['tav_button_url']));
update_post_meta($post_id, '_tav_button_icon', sanitize_text_field($_POST['tav_button_icon']));
update_post_meta($post_id, '_tav_button_color', sanitize_hex_color($_POST['tav_button_color']));
update_post_meta($post_id, '_tav_button_radius', intval($_POST['tav_button_radius']));
}
add_action('save_post', 'tav_save_custom_button_metabox');
// نمایش دکمه سفارشی در صفحه محصول ووکامرس
function tav_display_custom_button() {
global $post;
// دریافت مقادیر تنظیمشده برای دکمه
$button_text = get_post_meta($post->ID, '_tav_button_text', true);
$button_url = get_post_meta($post->ID, '_tav_button_url', true);
$button_icon = get_post_meta($post->ID, '_tav_button_icon', true);
$button_color = get_post_meta($post->ID, '_tav_button_color', true);
$button_radius = get_post_meta($post->ID, '_tav_button_radius', true);
// اگر لینکی وارد نشده باشد، دکمه نمایش داده نمیشود
if (!$button_url) {
return;
}
// تعریف استایل دکمه بهصورت داینامیک
$style = "background-color: {$button_color}; border-radius: {$button_radius}px; padding: 10px 20px; color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 5px;";
?>
<a href="<?php echo esc_url($button_url); ?>" class="tav-custom-button" style="<?php echo esc_attr($style); ?>">
<?php if (!empty($button_icon)) : ?>
<i class="<?php echo esc_attr($button_icon); ?>"></i>
<?php endif; ?>
<?php echo esc_html($button_text); ?>
</a>
<?php
}
// اضافه کردن دکمه سفارشی بعد از دکمه "افزودن به سبد خرید"
add_action('woocommerce_after_add_to_cart_button', 'tav_display_custom_button', 35);
// بارگذاری استایلهای مربوط به دکمه و فونتهای آیکن
function tav_enqueue_custom_button_styles() {
// بارگذاری Font Awesome برای استفاده از آیکنها
wp_enqueue_style('tav-font-awesome', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css', array(), '6.5.1', 'all');
// بارگذاری Bootstrap Icons (اختیاری)
wp_enqueue_style('tav-bootstrap-icons', 'https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css', array(), null, 'all');
// اضافه کردن استایلهای اختصاصی برای دکمه
wp_add_inline_style('tav-font-awesome', '
.tav-custom-button:hover {
opacity: 0.8;
}
');
}
add_action('wp_enqueue_scripts', 'tav_enqueue_custom_button_styles');


