قالب گرافیکی کلی

Odoo گزینه‌های مختلفی برای شکل دادن به قالب گرافیکی وب‌سایت شما ارائه می‌دهد، از جمله colors، fonts و layout.

هنگام راه‌اندازی وب‌سایت خود برای اولین بار، از شما خواسته می‌شود یک قالب گرافیکی انتخاب کنید. ماوس خود را روی themes hover کنید تا یک preview گسترده از هر یک را ببینید. روی یک قالب گرافیکی کلیک کنید تا آن را انتخاب کنید.

توجه

  • اگر بدون انتخاب یک قالب گرافیکی ترک کنید، وب‌سایت شما با استفاده از قالب گرافیکی پیش‌فرض ایجاد می‌شود.

  • می‌توانید themes را بعداً تغییر دهید در صورت نیاز.

در website builder، تب تم گزینه‌های مختلفی را برای سفارشی‌سازی قالب گرافیکی کلی وب‌سایت شما ارائه می‌دهد. برای دسترسی به آن، روی ویرایش کلیک کنید و به تب تم بروید.

وقتی تغییرات موردنظر را اعمال کردید، روی ذخیره کلیک کنید تا آن‌ها را تأیید کنید و به وب‌سایت خود اعمال کنید.

قالب گرافیکی

در بخش وبسایت، روی تغییر قالب کلیک کنید تا قالب گرافیکی selector باز شود. ماوس خود را روی themes hover کنید تا یک preview گسترده از هر یک را ببینید. روی یک قالب گرافیکی کلیک کنید تا آن را به وب‌سایت خود اعمال کنید.

رنگ‌ها

ویرایشگر وب‌سایت Odoo دو نوع اصلی رنگ را ارائه می‌دهد: theme colors و status colors.

قالب گرافیکی colors

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

برای ویرایش رنگ‌های وب‌سایت خود، به بخش رنگ‌ها در ویرایشگر وب‌سایت بروید، سپس:

  • روی نقطه رنگ که می‌خواهید تغییر دهید کلیک کنید، سپس یک رنگ تک رنگ انتخاب کنید یا روی سفارشی کلیک کنید تا یک tone رنگ خاص را به‌صورت دستی انتخاب کنید (یا کد #HEX یا RGBA آن را اضافه کنید).

  • روی آیکون paint palette کلیک کنید و یک color palette انتخاب کنید. در نتیجه، همه سفارشی‌سازی‌های رنگ بازنشانی می‌شوند؛ روی یک نقطه رنگ کلیک کنید تا یک رنگ خاص را تغییر دهید.

Odoo به‌طور خودکار رنگ‌های پیش‌تنظیم شده را برای palette انتخاب‌شده شما ایجاد می‌کند. این‌ها ترکیبات رنگ از پیش تعریف‌شده‌ای هستند که به عناصر مختلف وب‌سایت شما اعمال می‌شوند تا یک طراحی ساختاریافته و از نظر بصری جذاب ارائه دهند. وقتی یک color palette را انتخاب می‌کنید، presets آن تعریف می‌کنند چگونه آن رنگ‌ها در عناصر مختلف از یک building block، مانند buttons، backgrounds و text توزیع می‌شوند. اگر می‌خواهید آن‌ها را تغییر دهید، روی رنگ‌های پیش‌تنظیم شده کلیک کنید و روی یک preset کلیک کنید تا بیشتر سفارشی شود. هر color preset حاوی رنگ‌هایی برای background building block شما، text، headings، links، دکمه‌های primary و دکمه‌های secondary است.

پیش‌تنظیم‌های رنگ

برای اعمال یک color preset به یک building block در سایت خود، building block را انتخاب کنید، به تب Customize بروید، روی نقطه رنگ کنار پس‌زمینه کلیک کنید، و یک تم انتخاب کنید.

توجه

تغییر یک color preset به‌طور خودکار رنگ‌های هم preset پیش‌فرض و هم building blocks جایی که preset استفاده می‌شود را به‌روزرسانی می‌کند.

رنگ‌های وضعیت

Status colors برای نشان دادن وضعیت برخی actions استفاده می‌شوند (به‌عنوان مثال، موفقیت‌آمیز، هشدار و غیره). آن‌ها در پیام‌های پنجرهٔ بازشو که برای ارائه بازخورد به کاربران و بازدیدکنندگان وب‌سایت ظاهر می‌شوند استفاده می‌شوند. برای سفارشی‌سازی رنگ وضعیت‌ها وب‌سایت خود، به بخش پیشرفته بروید و روی نقاط کلیک کنید تا رنگ آن‌ها را تغییر دهید.

Example

انتخاب رنگ Status پنجرهٔ بازشو موفقیت

چیدمان صفحه

گزینه طرح صفحه در بخش وبسایت به شما اجازه می‌دهد نمایش کلی و spacing building blocks و عناصر وب‌سایت در صفحات را تغییر دهید. روی منوی کشویی کلیک کنید و layout موردنظر را انتخاب کنید. در طرح صفحه، پس‌زمینه خود را با انتخاب یک تصویر، استفاده از یک تصویر انتخاب‌شده در یک الگو، یا گذاشتن آن خالی سفارشی کنید.

فونت‌ها

Odoo به شما اجازه می‌دهد font family و اندازه را برای عناصر خاص در وب‌سایت خود سفارشی کنید، از جمله paragraphs، headings، buttons و input fields.

  • خانواده فونت: در بخش‌های Paragraph، Headings و دکمه، یک font را از منوی کشویی انتخاب کنید.

  • اندازه فونت: در بخش‌های Paragraph، Headings، دکمه و Input Fields، از فیلد اندازه فونت برای تنظیم یک اندازه پیش‌فرض استفاده کنید. روی آیکون (arrow) کلیک کنید تا بخش گسترش یابد و اندازه‌های سفارشی را تعریف کنید (به‌عنوان مثال، بر اساس سطح heading، اندازه دکمه و غیره).

علاوه بر این، هر بخش مخصوص عنصر گزینه‌های styling اضافی، مانند ارتفاع خط و حاشیه ها، را برای سفارشی‌سازی بیشتر ارائه می‌دهد.

Fonts سفارشی

می‌توان از fonts در وب‌سایت خود که به‌طور پیش‌فرض در Odoo ارائه نمی‌شوند استفاده کرد. برای افزودن یک font سفارشی، روی منوی کشویی مرتبط با فیلد خانواده فونت کلیک کنید و Add a Custom Font را در پایین منوی کشویی انتخاب کنید. در پنجره پنجرهٔ بازشو:

  • برای افزودن یک font Google، روی Select a Google Font کلیک کنید و روی font موردنظر در فهرست کلیک کنید. Serve font from Google servers را خاموش کنید اگر وب‌سایت شما از مکانی اداره می‌شود که مقررات نیاز به انطباق با قوانینی مانند، اما نه محدود به GDPR European Union دارد. این اطمینان می‌دهد که Font Google در سرور وب‌سایت شما به‌جای Google ذخیره می‌شود.

  • برای آپلود یک font سفارشی از کامپیوتر خود، روی Choose File کلیک کنید.

وقتی انجام شد، روی Save and Reload کلیک کنید.

styles دکمه

برای سفارشی‌سازی style دکمه‌های primary و secondary وب‌سایت خود، به بخش دکمه در ویرایشگر وب‌سایت بروید و گزینه‌های مرتبط را ویرایش کنید:

  • روی arrow کنار فیلدهای استایل اولیه یا استایل ثانویه کلیک کنید و یکی از styles موجود را برای هر نوع دکمه انتخاب کنید: پر کردن، خط پیرامون یا تخت. هنگام انتخاب خط پیرامون، گزینه عرض خط در زیر ظاهر می‌شود، که به شما اجازه می‌دهد عرض outline دکمه را تنظیم کنید.

  • fonts را تغییر دهید.

  • حاشیه داخلی را تنظیم کنید تا اندازه spacing (به pixels) اطراف labels دکمه‌ها را تغییر دهید.

  • border radius دکمه‌ها را با استفاده از گزینه گوشه های گرد سفارشی کنید.

  • یک animation وقتی یک دکمه کلیک می‌شود در منوی کشویی روی افکت کلیک کنید اضافه کنید.

دکمه‌های primary و secondary

نکته

می‌توانید اندازه‌های سفارشی کوچک و بزرگ را برای حاشیه داخلی، اندازه فونت و گوشه های گرد دکمه‌ها تعریف کنید: روی آیکون (arrow) کلیک کنید و از فیلدهای مرتبط استفاده کنید.

تنظیمات دکمه padding، font size و round corners