چگونه CSS وب سایت وردپرس خود را شخصی سازی کنیم؟ در این مقاله اطلاعات کسب کنید.

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

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

این آموزش به انواع روش های موجود برای سفارشی کردن وب سایت خود با CSS، ایجاد و سفارشی سازی تم های فرزند، با استفاده از افزونه های داخلی WordPress Customizer و افزونه های وردپرس از CSS.

اما قبل از شروع ، وقت بگذارید تا نگاهی بیندازید چگونه برای نصب یک تم وردپرس, چگونه بسیاری از پلاگین ها باید بر روی وردپرس نصب کنم.

سپس لیست ما را با هم پیدا کنید.

CSS: اصول و نحوه استفاده وردپرس از آنها

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

شیوه نامه سندی است که سبک ها را توصیف می کند (مانند فونت، رنگ و غیره.) برای ارائه سند دیگری استفاده شود. در مورد ما ، ما با یک سبک از صفحات وب روبرو هستیم.

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

به همان سادگی که به نظر می رسد ، می توان از CSS برای تغییر تقریبا هر چیزی در یک صفحه وب استفاده کرد (از جمله طرح ، رنگ ها ، فونت ها و حتی انیمیشن ها).

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

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

روشهای مختلفی برای افزودن a وجود دارد کد CSS سفارشی به موضوع وردپرس خود تغییر دهید تا تغییرات شما در به روزرسانی موضوع وردپرس زنده بمانند.

چگونه وب سایت وردپرس خود را با CSS شخصی سازی کنیم

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

در پایان کار ما ، شما قادر خواهید بود تعیین کنید که کدام روش با موضوع وردپرس شما مطابقت دارد.

گزینه # 1: CSS را با استفاده از یک موضوع کودک سفارشی کنید

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

کشف کی و چگونه به نصب وردپرس در یک دایرکتوری فرعی

ایجاد یک تم کودک کاملاً ساده است. این شامل ایجاد یک پوشه در میزبانی وب شما است که شامل یک فایل است را ببندید که موضوع والدین را به عنوان یک الگو لیست می کند و پرونده واردات را وارد می کند را ببندید از موضوع والدین (آیا معنی ورق های سبک "آبشار" را به یاد دارید؟).

کد وردپرس اطلاعات بیشتری در مورد ایجاد مضامین کودک دارد.

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

برای کشف این مقاله را بررسی کنید چگونه فشرده سازی فایل های CSS، HTML و Javascript

اولین استفاده از ویرایشگر موجود در داشبورد وردپرس ، با کلیک بر روی است ظاهر> ویرایشگراست. 'Lویرایشگر لیستی از پرونده ها را در سمت راست موجود در موضوع نمایش می دهد (فقط پرونده های محبوب نمایش داده می شوند). فایل شما را ببندید در انتهای لیست قرار دارد و روی گزینه کلیک می کنید ورق سبک فایل شما را ببندید شارژ خواهد شد

می توانید تغییرات خود را به این مکان اضافه کنید و تغییر را ذخیره کنید.

راه دیگر برای دسترسی به پرونده شما را ببندید (توصیه ما) برای مرور پرونده ها در هاستینگ وب از طریق a سرویس گیرنده FTP یا یک مدیر پرونده پوشه قالب کودک که ایجاد کرده اید در " موضوعات wp-content>« . شما می توانید از یک ویرایشگر متن برای ویرایش پرونده استفاده کنید را ببندید.

گزینه شماره 2: CSS را از Customizer شخصی سازی کنید

از وردپرس 4.7 ، کاربران می توانند CSS سفارشی را مستقیماً از قسمت مدیر وردپرس اضافه کنند. این فوق العاده آسان است و شما می توانید تغییرات خود را با پیش نمایش در زمان واقعی مشاهده کنید.

ابتدا باید به صفحه بروید مضامین »سفارشی سازی.

با این کار رابط سفارشی سازی قالب وردپرس راه اندازی می شود.

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

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

می توانید همچنان به افزودن کد CSS سفارشی ادامه دهید ، تا زمانی که از نحوه نمایش آن در وب سایت خود راضی باشید. فراموش نکنید که روی "کلیک کنید ذخیره و انتشار در انتها وقتی کارتان تمام شد.

توجه داشته باشید: هر CSS سفارشی که با استفاده از Customizer اضافه می کنید فقط با آن تم خاص وردپرس در دسترس است. اگر می خواهید از آن با مضامین دیگر استفاده کنید ، باید با استفاده از همان روش ، موضوع جدید خود را کپی و جایگذاری کنید.

گزینه # 3: CSS را با استفاده از یک افزونه شخصی سازی کنید

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

در اینجا چند پلاگین وجود دارد:

1. CSS سفارشی در Jetpack (رایگان)

این پلاگین وردپرس Jetpack  در بیش از یک میلیون وب سایت وردپرس و احتمالاً مال شما نیز نصب شده است. این ویژگی های موجود در WordPress.com برای وب سایت های خود میزبان ، و همچنین ارائه می دهد ماژول سفارشی سازی CSS.

پس از فعال شدن ماژول در داشبورد Jetpack ، یک ویرایشگر CSS سفارشی در دسترس خواهد بود که به شما امکان می دهد قالب وردپرس خود را بدون ایجاد یک تم کودک سفارشی کنید. با دنبال کردن این مسیر به ویرایشگر دسترسی پیدا می کنید " ظاهر> ویرایش CSS« .

2. CSS ساده سفارشی (رایگان)

اگر در عوض شما یک گزینه مستقل را می خواهید، ساده CSS سفارشی انتخاب خوبی است این افزونه رایگان که در بیش از بیش از وب سایت های 200.000 با رتبه ستاره های 4,9 مورد استفاده قرار می گیرد ، مطمئناً به شما در شخصی سازی وبلاگ CSS WordPress کمک می کند.

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

3. CSS Hero (از 14 دلار در سال)

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

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

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

یافتن نحوه جابجایی نظرات از یک مقاله به مقاله دیگر در وردپرس

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

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

با کشف بیشتر پیش بروید چگونه کاربران را قادر به ویرایش صفحات خاص

بنابراین روشهای مختلفی برای شخصی سازی CSS از موضوع وردپرس وجود دارد:

1. یک موضوع کودک.
2. Customizer.
3. پلاگین CSS

همچنین برخی از افزونه های برتر WordPress را کشف کنید  

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

ما در اینجا برخی از افزونه های برتر وردپرس را به شما پیشنهاد می دهیم که در انجام این کار به شما کمک می کنند.

1. Adning تبلیغاتی

WP PRO System Advertising یک افزونه مدیریت تبلیغات WordPress است که مکانهای استراتژیک 18 را برای شما در نمایش تبلیغات در وب سایت خود ارائه می دهد. همچنین دارای یک بخش آماری دقیق است که از آن می توانید عملکرد هر تبلیغ را مشاهده کنید.

این ویژگی بسیار مهم است زیرا به شما کمک می کند کمپین خود را بهبود بخشیده و سود خود را به حداکثر برسانید. این افزونه Adsense WordPress همچنین دارای یک ویژگی منحصر به فرد به نام تبلیغات پس زمینه است. به شما امکان می دهد تبلیغات را به عنوان پس زمینه محتوای خود نمایش دهید.

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

دانلود | نسخه ی نمایشی | میزبانی وب

2. WP Media File Manager

WP Media File Manager یک افزونه وردپرس است که با استفاده از قابلیت کشیدن و رها کردن ، سازماندهی کتابخانه رسانه را به صورت سلسله مراتب آسان می کند. یکی از افزونه های وردپرس قدرتمندترین فایل منیجر در CodeCanyon. حتی نیازی به ایجاد پوشه ها به صورت دستی نخواهید داشت.

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

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

دانلود | نسخه ی نمایشی | میزبانی وب

3. منو قهرمان

Hero Menu یک افزونه بزرگ وردپرس است. و گرچه قهرمانانه عمل نمی کند ، اما فقط با 19 دلار تمام ویژگی های لازم را دارد. کمی شبیه Mega Main Menu ، این یک افزونه است که همچنین دارای محصولاتی است که در CodeCanyon ارائه می شود و در حال حاضر حدود 4500 فروش به اعتبار خود دارد.

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

سازنده منو استفاده از افزونه را بهبود می بخشد و کار خریدار را بسیار ساده می کند. ادغام رابط کاربر نیز کار بسیار خوبی است و رابط کاربری کاملاً با افزونه های دیگر رفتار می کند.

دانلود | نسخه ی نمایشی | میزبانی وب

منابع پیشنهادی

درباره سایر منابع پیشنهادی برای کمک به شما در ساخت و مدیریت وب سایت خود اطلاعات کسب کنید.

• نحوه محافظت از فرم در وردپرس با رمز عبور
• چگونه برای ایجاد انتقال زیبا از صفحات در وردپرس
• نحوه استفاده از API وردپرس REST
• نحوه ارتباط وب سایت وردپرس خود با تلگرام
• نحوه تمیز کردن وردپرس در چند مرحله

نتیجه

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

با این حال، شما همچنین می توانید با ما مشورت کنید ressourcesاگر برای اجرای پروژه های ایجاد سایت های اینترنتی به عناصر بیشتری احتیاج دارید ، با مشورت راهنمای ما در مورد ایجاد وبلاگ وردپرس.

اگر پیشنهادی یا اظهار نظر دارید ، آنها را در بخش ما بگذارید نظر.

...