فهرست مطالب
در این مقاله نحوه اعمال قالب بندی شرطی در حاشیه جدول در Outlook را خواهید دید. من به شما نشان خواهم داد که چگونه رنگ، عرض و سبک آنها را تغییر دهید. سپس من به شما یاد می دهم که چگونه چندین تغییر را در یک زمان انجام دهید و جدول Outlook خود را به روش های مختلف رنگ آمیزی کنید.
در ابتدا، می خواهم یک یادداشت کوچک برای تازه واردان این وبلاگ بنویسم. همانطور که امروز در مورد قالب بندی شرطی در قالب ها صحبت خواهیم کرد، به شما نشان خواهم داد که چگونه آنها را به درستی با استفاده از افزونه Shared Email Templates برای Outlook تنظیم کنید. این ابزار میتواند به شما کمک کند قالبهای از پیش ذخیرهشده با قالببندی کامل را در ایمیلهای خود بچسبانید و روال مکاتبات خود را با چند کلیک کاهش دهید.
اگر قبلاً آموزش قالببندی شرطی من در جداول Outlook را خواندهاید، میدانید نحوه تغییر محتوای سلول ها و رنگ پس زمینه با این حال، این همه کاری نیست که می توانید برای روشن کردن جدول Outlook خود انجام دهید. امروز راههایی را به شما نشان میدهم که میتوانید به صورت مشروط حاشیههای جدول خود را رنگ کنید و عرض و سبک آنها را تغییر دهید.
علاوه بر این، در فصل آخر یک جایزه کوچک در انتظار شما است، جایی که به شما نشان میدهم چگونه چندین تغییر را اعمال کنید. در همان زمان و میز خود را به رنگی و روشنی مانند آتش بازی در 4 جولای بسازید ؛)
رنگ حاشیه سلول ها را تغییر دهید
برای اینکه به شما نشان دهیم نقاشی حاشیه چگونه کار می کند، من از همان نمونه های آموزش هفته گذشته استفاده خواهم کرد. مورد به این صورت است: الف را می چسبانمتیم مایکروسافت، در این گفتگوی GitHub به راحتی پاسخ آنها را بررسی کنید :)
نکته پایانی
من واقعاً امیدوارم که توانسته باشم شما را متقاعد کنم که یک جدول در Outlook فقط مرزهای سیاه با ساده نیست. متن فضای زیادی برای پیشرفت و خلاقیت وجود دارد :)
وقتی تصمیم گرفتید چند آزمایش نقاشی از خودتان انجام دهید، فقط الگوهای ایمیل مشترک را از فروشگاه مایکروسافت نصب کنید و لذت ببرید!
اگر وجود دارد هر سوالی که از شما باقی مانده به کمک در مورد قالب بندی شرطی در جداول Outlook نیاز دارد، فقط چند کلمه را در بخش نظرات بگذارید تا آن را بفهمیم ;)
الگو و نرخ تخفیف را برای پر کردن جدول انتخاب کنید. بسته به انتخاب من، حاشیههای سلول به رنگ خاصی رنگ میشوند.جدولی که امروز رنگ میکنم، جدول زیر خواهد بود:
سرصفحه نمونه 1 | Sample header 2 | Sample header 3 |
~%WhatToEnter[ {dataset:'Dataset with discounts', column:' Discount', title:'Select discount'} ] discount |
از آنجایی که قالب بندی شرطی در HTML الگوها انجام می شود، بیایید ابتدا کد HTML این جدول را باز کنید:
- الگوی مورد علاقه را باز کنید و Edit : همچنین ببینید: نحوه حذف متن یا اعداد از سلول اکسل
- را پیدا کنید نماد HTML ( ) در نوار ابزار الگو:
- HTML اصلی را ببینید که چندین بار تغییر خواهد کرد:
اگر در مورد رنگ ها و ارتباط آنها با نرخ های تخفیف تعجب می کنید، من به شما اشاره می کنم :) مجموعه داده! هیچ ایده ای ندارید؟ سپس کمی مکث کنید و ابتدا آموزش قالب های Fillable Outlook من را بخوانید.
در اینجا مجموعه داده اصلی است که در ابتدا استفاده می کنم و در چند فصل کمی بهبود می یابد:
تخفیف | کد رنگ |
10% | #00B0F0 |
15 % | #00B050 |
20% | #FFC000 |
25% | #4630A0 |
زمانی که باید کد رنگ لازم را از این جدول بازیابی کنم، از ماکرو زیر استفاده خواهم کرد:
~%WhatToEnter[{dataset:'Dataset with discounts',column:'Color code'}]از آنجایی که همه اصول اولیه را پوشش داده ایم، اجازه دهید شروع به تغییر رنگ کنیم :)
رنگ حاشیه یکی را به روز کنید cell
برای رنگآمیزی مرزهای یک سلول در یک جدول، ابتدا خط آن را در HTML الگو پیدا میکنیم و به اجزای آن نگاهی دقیقتر بیندازیم:
- " style= " مجموعه پارامترهای اصلی یک سلول را نشان می دهد.
- "عرض: 32%; حاشیه: 1px جامد #aeabab " عرض، رنگ و سبک سلول و حاشیه است.
- "~%WhatToEnter[] تخفیف" محتوای سلول است.
این خط کد به این معنی است که من یک سلول با 1px حاشیه خاکستری از سبک جامد را می بینم. اگر هر یک از آن پارامترها را جایگزین کنم، ممکن است ظاهر جدول را در قالب من خراب کند، یعنی حاشیه ها نامرئی خواهند بود (اگرچه همه چیز پس از چسباندن کاملاً به نظر می رسد).
من دوست دارم یک استاندارد داشته باشم. جدول را در یک الگو قرار دهید و هنگام چسباندن آن را اصلاح کنید. بنابراین، یک ویژگی جدید با پارامترهایی اضافه میکنم که در هنگام چسباندن جایگزین ویژگیهای اصلی میشوند:
بیایید خط HTML بالا را بررسی کنیم:
- “ style="border : 1px solid #aeabab;" اولین ویژگی است. آنها اصل سلول هستندویژگی ها.
- " data-set-style= " یک پارامتر ویژه است که به من کمک می کند تا ویژگی بالا را با مجموعه ای از ویژگی های لازم در حین چسباندن جایگزین کنم.
- " border:1px solid; border-color: ” بخشی از ویژگی دوم است که در آن مکث می کنیم. ببینید، شروع یکسان با نسخه اصلی است، همان عرض و سبک حاشیه است. با این حال، وقتی صحبت از رنگ می شود (پارامتری که می خواهم تغییر دهم)، آن را با border-color: جایگزین می کنم و ماکرو WhatToEnter را در آن قرار می دهم. بنابراین، بسته به انتخاب کشویی، ماکرو با کد رنگ جایگزین میشود و حاشیه دوباره رنگ میشود.
- «~%WhatToEnter[] تخفیف» هنوز محتوای سلول است که به هیچ تغییری نیاز ندارد.
بنابراین، HTML کامل با سلول رنگی آینده به این صورت خواهد بود:
وقتی این الگو را جایگذاری میکنید ، حاشیه سلول به روز شده بلافاصله به رنگ انتخاب شده رنگ می شود:
حاشیه های کل ردیف را رنگ کنید
اکنون اجازه دهید حاشیه ها را روی تمام ردیف جدول نمونه ما و ببینید که چگونه کار می کند. منطق کاملاً همان است که در آن وجود داردپاراگراف بالا با این تفاوت که باید تمام سلول های ردیف دوم را به روز کنید. هنگامی که همان تغییراتی که در بالا توضیح دادم روی کل ردیف اعمال می شود، هنگام چسباندن الگو به صورت چشمکی رنگ می شود.
اگر مایلید به آن نگاهی بیندازید. HTML آماده با رنگ آمیزی ردیف دوم، به اینجا می رسد:
تغییر عرض حاشیه
اکنون اجازه دهید نه تنها رنگ حاشیه بلکه عرض آن را نیز به روز کنیم. یک بار دیگر به ویژگی HTML که در هنگام چسباندن جایگزین اصلی می شود نگاه کنید:
data-set-style="border: 1 px solid; border-color:~%WhatToEnter[{dataset:' مجموعه داده با تخفیف',column:'Color Code'}]">~%WhatToEnter[{dataset:'Dataset with discounts',column:'Discount',title:'Select discount'}] تخفیفمشاهده <0 پارامتر 1>1px ؟ این عرض حاشیه هایی است که باید رنگی شوند. میتوانید بهطور دستی آن را به مثلاً 2 تغییر دهید و با چسباندن آن، حاشیههای جدول گستردهتر میشوند.
اما، من این کار را به روش دیگری انجام میدهم. من مجموعه داده خود را به روز می کنم و یک ستون جدید با عرض حاشیه اضافه می کنم. در این حالت، وقتی نرخ فعلی را برای چسباندن انتخاب میکنم، هم رنگ و هم عرض خواهد بودبه روز شد.
تخفیف | کد رنگ | عرض حاشیه |
10% | #00B0F0 | 2 |
15% | #00B050 | 2.5 |
20% | #FFC000 | 3 |
25% | #4630A0 | 3.5 |
اکنون اجازه دهید ویژگی دوم هر خط را تغییر دهیم و 1px را با قطعه متن زیر جایگزین کنیم:
border-width:~%WhatToEnter [{dataset:'Dataset with discounts',column:'Border width'}]سپس آن را برای هر سه سلول ردیف دوم تکرار می کنم و HTML زیر را در نتیجه دریافت می کنم:
هنگامی که این الگو ذخیره و جایگذاری شد، حاشیههای آبی گسترده در یک ایمیل ظاهر میشوند:
سبک حاشیهها را در جدول تغییر دهید
در این فصل من می خواهم توجه شما را به پارامتر دیگری جلب کنم - سبک. این یکی ظاهر مرزها را اداره می کند. قبل از اینکه نحوه اعمال صحیح آن را به شما نشان دهم، باید به مجموعه داده خود برگردم و آن را مطابق با مورد فعلی خود تغییر دهم.
تخفیف | مرزسبک |
10% | نقطه دار |
15% | دوبل |
20% | خالق |
25% | برآمدگی |
من هر نرخ تخفیف را با سبک حاشیه مرتبط کرده ام و این مجموعه داده را برای آینده ذخیره کرده ام. ماکرو برای بازیابی سبک برای HTML من به شکل زیر خواهد بود:
~%WhatToEnter[{dataset:"Dataset with discounts",column:"Border style"}]اکنون باید به روز رسانی کنم ویژگیهای ردیف دوم را با جایگزین کردن solid (سبک پیشفرض که من همیشه از آن استفاده میکردم) با ماکرو بالا برای دریافت کد زیر:
data-set-style="border: 1px #aeabab; border-style: ~%WhatToEnter[{dataset:'Dataset with discounts',column:'Border style'}]در اینجا HTML نهایی آمده است:
اگر این HTML را کپی و پیست کنید برای الگوهای شما، نتیجه شما را منتظر نمیگذارد:
قالببندی مشروط را برای تغییر همزمان برجستهسازی، رنگ متن و عرض حاشیهها تنظیم کنید
به بیشترین علاقه رسیده ایم بخش ting همانطور که می خواهم به شما نشان دهم چگونه چندین اصلاح را در یک زمان اعمال کنید. اول از همه، من مجموعه داده ای را که داده ها را از آن بازیابی خواهم کرد، به روز می کنم.از آنجایی که تصمیم گرفتم برجسته سازی سلول ها، رنگ متن و عرض حاشیه ها را تغییر دهم، تمام آن پارامترها باید مشخص شوند. بنابراین، مجموعه داده جدید من به این صورت خواهد بود:
تخفیف | کد رنگ | کد پس زمینه | عرض حاشیه |
10% | #00B0F0 | #DEEBF6 | 2 |
15 % | #00B050 | #E2EFD9 | 2.5 |
20% | #FFC000 | #FFF2CC | 3 |
25% | #4630A0 | #FBE5D5 | 3.5 |
بنابراین، اگر 10% را انتخاب کنم، متن مورد نیاز با رنگ آبی رنگ می شود (# 00B0F0 )، پس زمینه سلول های انتخاب شده در سایه قرار می گیرد. یک رنگ آبی روشن (# DEEBF6 ) و مرزهای آنها دو بار باز می شود.
اما چگونه می توان این مجموعه داده را به جدول Outlook متصل کرد تا فرمت شود؟ من در 2 مقاله شما را برای این کار آماده کرده ام :) اینجا HTML است که تمام تغییرات لازم را انجام می دهد:
اکنون اجازه دهید نگاهی به تمام تغییرات اعمال شده بیندازیم:
- نمونه سربرگ 1 - این قطعه متن سرصفحه را از ستون "کد رنگ" رنگی می کند. در صورت احساسهمانطور که باید حافظه خود را در نقاشی متن تازه کنید، به تغییر رنگ فونت متن در فصل جدول آموزش قبلی من مراجعه کنید.
- data-set-style="background-color:~%WhatToEnter[ {dataset:'Dataset with discounts',column:'Background code',title:'Select discount'}] - این قسمت رنگ پس زمینه را به روز می کند و کد آن را از ستون Background Code مجموعه داده می گیرد. اگر احساس میکنید که نیاز به توضیح دقیقتری از این مورد دارید، میتوانید به آموزش سلولهای برجسته نگاهی بیندازید.
- data-set-style="border: solid #aeabab; border-width:~%WhatToEnter[{dataset:'Dataset with discounts',column:'Border width'}] – با این خط HTML، عرض مرزها به چیزی که در عرض حاشیه مشخص شده تغییر می کند من قبلاً آن را پوشش دادهام، اگر چیزی را از دست دادید، ممکن است نگاهی بیندازید.
وقتی یک الگو را با این ویژگیها اضافه میکنم، نتیجه من را منتظر نمیگذارد:
یک یادداشت کوچک وجود دارد که می خواهم قبل از بستن این مبحث ذکر کنم. در حالی که من رنگ آمیزی حاشیه ها را در جداول آزمایش می کردم، با رفتار کاملا مبهم حاشیه ها در نسخه آنلاین و دسکتاپ Outlook مواجه شدم. از آنجایی که کمی گیج شده بودم، برای شفاف سازی با توسعه دهندگان خود تماس گرفتم. آنها متوجه شدند که کلاینت های مختلف Outlook جداول را به روش های مختلف ارائه می دهند و دلیل چنین رفتاری یک اشکال در Outlook است.
تیم ما این مشکل را به