چگونگی کار با استایل های قالب در المنتور

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

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

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

• تصویر پس زمینه
• سربرگ و آدرس های فایل استایل
• فیلد های فرم
• دکمه ها
• تصاویر

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

نحوه دستیابی و تغییر تنظیمات استایل قالب در المنتور (در 6 مرحله)

همه جادوها در پنل المنتور اتفاق می افتد. بنابراین با بررسی چگونگی دستیابی به آن ، شروع خواهیم کرد.

مرحله 1: به پنل المنتور خود دسترسی پیدا کنید

با باز کردن ویرایشگر برای هر یک از صفحات وب سایت ، می توانید تنظیمات استایل قالب المنتور را پیدا کنید. پس از ورود به منو ، در گوشه سمت چپ بالای صفحه دسترسی داشته باشید و گزینه استایل قالب را در زیر استایل جهانی انتخاب کنید:

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

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

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

مرحله 2: استایل پس زمینه قالب خود را تغییر دهید

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

اگر برگه پس زمینه را باز کنید ، می توانید تصویر زمینه وب سایت خود را به صورت یک رنگ جامد یا گرادیان تنظیم کنید:

به عنوان مثال ، تصمیم گرفتیم با رنگ صورتی پیش برویم. اگر ترجیح می دهید از یک تصویر پس زمینه استفاده کنید ، می توانید با کلیک بر روی علامت به علاوه (+) پرونده را انتخاب یا بارگذاری کنید.

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

برای انجام این کار ، در هر صفحه از صفحه باز کلیک کنید و کلید commend یا کلید control به همراه E را فشار دهید.

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

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

مرحله 3: تایپوگرافی وب سایت خود را تعیین کنید

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

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

در مثال زیر ، ما رنگ پیوندهای خود را به رنگ قرمز تغییر داده ایم:

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

برای همه عناصر ذکر شده در این برگه ، می توانید قلم ها ، اندازه ها ، وزن ها و حتی فاصله آنها را بین هر حرف تنظیم کنید:

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

مرحله 4: استایل دکمه خود را تغییر دهید

هیچ وب سایت مدرن بدون دکمه کامل نیست. با استفاده از استایل های قالب المنتور ، می توانید با استفاده از همان نوع تنظیماتی که در بخش های قبلی مشاهده کرده ایم ، تایپوگرافی و رنگ دکمه های خود را به سرعت تنظیم کنید.

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

از آنجا که ما در مورد دکمه ها صحبت می کنیم ، می خواهید مطمئن شوید که متن آنها را می توان به اسانی خواند. این بدان معناست که انتخاب یک متن برای دکمه با پیش زمینه دکمه متناقض است. همچنین ایده اضافه کردن کمی بالشتک(padding) ، یعنی فضای اضافی بین متن و حاشیه دکمه ، ایده خوبی است.

مرحله 5: تنظیمات فیلد فرم خود را اصلاح کنید

اگر از فرمهایی در سایت خود استفاده می کنید ، می توانید با تنظیمات فرم و متن خود بازی کنید. برای شروع ، بیایید تایپوگرافی و رنگ فرم خود را تغییر دهیم:

با حرکت ، می توانیم استایل و رنگ مرز را نیز تغییر دهیم. به عنوان مثال ، ما آن را به رنگ قرمز تنظیم کرده ایم که با سایر عناصر صفحه ما مطابقت دارد:

یکی از جنبه های سرگرم کننده تنظیمات فرم این است که می توانید هنگامی که بازدید کنندگان روی یک قسمت از طریق تمرکز بر روی آن تمرکز می کنند ، سبک های مختلفی را تنظیم کنید. پس از کلیک بر روی زمینه ، می توانید یک اثر گذار نیز تنظیم کنید. در مثال زیر ، هنگامی که کاربران روی این قسمت کلیک می کنند ، استایل مرزی را تغییر می دهد:

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

مرحله 6 : استایل های تصویر خود را تغییر دهید

ممکن است تصور کنید که روش های زیادی برای سبک کردن تصاویر وب سایت شما وجود ندارد. از این گذشته ، تصاویر خود گوشه ای از سبک منحصر به فرد هر سایت هستند. با وجود این با استایل های المنتور می توانید به راحتی سفارشی سازی هایی مانند مرزهای جهانی ، سایه ها و فیلترهای CSS سفارشی را اضافه کنید:

این گزینه ها شما را قادر می سازد تا تصاویر خود را کاملاً برجسته کنید. بعلاوه ، آنها می توانند به شما کمک کنند اطمینان حاصل شود که تصاویر شما به طور منظم در سایر ظاهر طراحی وب سایت شما ادغام می شوند.

و همه همین است!

انتخاب های استایلی که در وب سایت خود انجام می دهید ، بر روشی که بازدید کنندگان نسبت به آن احساس می کنند تأثیر می گذارد. با سازگار بودن ، شما به جهان می گویید: “این سبک برند من است و به نظر خوب می رسد.” البته ، افزایش سرعت هر عنصر در وب سایت شما معمولاً به زمان نیاز دارد.

از طرف دیگر با استایل قالب المنتور می توانید یک طراحی مداوم را به سرعت ایجاد کنید. به علاوه ، این سبک های مودولار هستند – اگر می خواهید تنظیمات خاصی را برای هر صفحه تغییر دهید ، المنتور شما را قادر به انجام چنین کاری می کند. این گزینه های طراحی منحصر به فرد ، تنظیمات جهانی را نادیده می گیرند . بنابراین شما کاملاً کنترل می کنید که وب سایت شما چگونه به نظر می رسد!