تبلیغات

تبلیغات تبلیغات
حراجی دامنه های ویژهمشاهده
آخرین ارسال های تالار مشاهده انجمن
محدودیت اسکریپت bemusic 0 پاسخ 4 بازدید خرید تتر از ایران 0 پاسخ 17 بازدید چرا قالب بیست اسکریپت کار نمیکنه؟ 2 پاسخ 328 بازدید سئو و لینک سازی 0 پاسخ 2 بازدید دانلود رایگان مجموعه طرح لایه باز قالب پست اینستاگرام 2 پاسخ 591 بازدید وردپرس یا جوملا؟ 0 پاسخ 638 بازدید بهترین وب سرور 0 پاسخ 485 بازدید معرفی سایت و اپ لیلام 4 پاسخ 561 بازدید بهترین cdn 0 پاسخ 516 بازدید 5 ارز دیجیتال برتر برای سرمایه گذاری در سال 2021 1 پاسخ 3202 بازدید

تبلیغات
تبلیغات تبلیغات

افزودن CSS به ایمیل های ووکامرس

مقالات,آموزش,ترفند , وردپرس

معمولا وقتی قصد داریم استایل بخشی از سایت خود را با استفاده از CSS تغییر دهیم، کد سی اس اس مورد نظر خود را به فایل استایل قالب خود اضافه می‌کنیم. اما این کدها روی ایمیل‌های ووکامرس اعمال نمی‌شوند. ایمیل‌های ووکامرس به‌صورت پیشفرض فونت جالبی ندارند، رنگ‌بندی چندان مناسبی ندارند و حتی لوگوی سایت شما نیز در این ایمیل‌های نمایش داده نمی‌شود. همچنین وقتی وارد بخش مدیریت ایمیل‌های ووکامرس می‌شویم، نمی‌توانیم CSS سفارشی به ایمیل‌های ووکامرس اضافه کنیم. در این مقاله نحوه افزودن CSS به ایمیل های ووکامرس را به شما عزیزان آموزش خواهم داد.

 

این کار را به ۲ روش می‌توان انجام داد. روش اول استایل دهی به تمام ایمیل‌های ووکامرس هست و روش دوم استایل دهی به یک ایمیل خاص در ووکامرس. بیایید قدم به قدم هر دو روش را بررسی کنیم.

 

افزودن CSS به تمام ایمیل‌های ووکامرس

برای افزودن CSS به ایمیل‌های ووکامرس کافیست کد زیر را در فایل functions.php قالب سایت خود بعد از <?php در خط دوم قرار دهید:

add_filter( 'woocommerce_email_styles', 'bistscript_add_css_to_emails', 9999, 2 );
function bistscript_add_css_to_emails( $css, $email ) {
$css .= '
body { color: #333 }
h2 { font-size: 30px }
';
return $css;
}

در کد بالا یک تابع به نام bistscript_add_css_to_emails ساختیم. در این تابع مشخص کردیم که دو خط CSS یعنی body { color: #333 } و h2 { font-size: 30px } را Return کن. سپس با فیلتر woocommerce_email_styles این سی اس اس‌ها را به ایمیل‌های ووکامرس اضافه کردیم.

به همین راحتی 🙂

حالا بیایید سی اس اس دلخواه خود را به یک ایمیل خاص از ووکامرس اضافه کنیم.

افزودن سی اس اس به ایمیل سفارش در ووکامرس

برای اینکار باید کد زیر را در فایل توابع یا همان functions.php قالب سایت اضافه کنیم:

add_filter( 'woocommerce_email_styles', 'bistscript_add_css_to_emails', 9999, 2 );
function bistscript_add_css_to_emails( $css, $email ) {
if ( $email->id == 'new_order' ) {
$css .= '
body { color: #333 }
h2 { font-size: 30px }
';
}
return $css;
}

اما این کد با کد قبلی یک تفاوت اساسی دارد. در بخش if ( $email->id == ‘new_order’ ) مشخص کردیم که اگر آیدی ایمیل برابر با new_order یعنی ایمیل سفارش جدید بود، سپس سی اس اس ها را اضافه کن.
 

به همین راحتی توانستیم با دو روش بالا، CSS دلخواه خود را به ایمیل‌های ووکامرس اضافه کنیم. هر تعداد خط CSS که می‌خواهید می‌توانید در قسمتی که ۲ خط سی اس اس ما نوشته شده اضافه کنید.

موفق باشید.

دانلود

هاست ارزان، لایت اسپید، سرور مجازی منطبق با اسکریپت های 20script کلیک کنید >
دانلود بیش از 5میلیون محصول وردپرسی تنهابا 500 هزارتومان (طرح برد برد) کلیک کنید >
مطلب مفیدی بود ؟
نویسنده : تیم محتوای 20اسکریپت 0 مقالات,آموزش,ترفند , وردپرس
لینک کوتاه مطلب : https://www.20script.ir/?p=55363
کلمات کلیدی پست :
مطالب مرتبط
8,992افزونه سفارشی سازی وضعیت سفارش ووکامرس YITH WooCommerce Custom Order Status تاریخ : 2018/06/13
6,865نمایش تعداد محصولات ووکامرس با افزونه WooCommerce Products Per Page تاریخ : 2017/12/5
8,294افزونه ارسال فایل مشتری ووکامرس YITH WooCommerce Uploads Premium تاریخ : 2017/04/30
7,220افزونه اسلایدر حرفه ای وردپرس Soliloquy + افزودنی ها تاریخ : 2019/03/21
4,312ایجاد صورت‌حساب در ووکامرس با افزونه YITH WooCommerce PDF Invoice تاریخ : 2018/09/5
12,449افزونه فارسی مزایده در ووکامرس تاریخ : 2016/12/28
6,631نمایش ویدئو معرفی محصولات در ووکامرس با افزونه YITH WooCommerce Featured Video تاریخ : 2017/09/11
12,616پک پلاگین های پرمیوم و اصلی برای ووکامرس تاریخ : 2013/11/21
3,588پوسته وبلاگی و مجله خبری PointPro برای وردپرس تاریخ : 2018/09/16
3,932قالب فروشگاهی وردپرس Rife فارسی تاریخ : 2020/09/30
7,076دانلود پوسته ارائه خدمات سئو Mr. SEO برای وردپرس تاریخ : 2018/01/4
3,088دانلود قالب مینیمال فروشگاهی Toro برای ووکامرس تاریخ : 2019/06/2
برخی از قالب های وبلاگ - بیست اسکریپت
قالب عشق بین انگشت ها
قالب دخترونه و آرایش
قالب زیبای ماشین
قالب فانتزی و طنز چِشم
قالب دختر رویایی
قالب وبلاگ دکوراسیون
قالب وبلاگ کلبه و درخت
قالب دختر زیبا
قالب پسرونه غمگین
قالب عاشقانه قلب
شرکت سئو سایت
تبلیغات
تبلیغات
تبلیغات
تبلیغات