برخی روش های اعمال تغییر در طراحی پوسته وردپرس

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

تغییر در طراحی پیوسته وردپرس

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

۱- اعمال تغییراتی نه چندان بزرگ یا به عبارت دیگر سفارشی سازی وردپرس

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

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

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

همانطور که در تصویر مشاهده می کنید ستون کناری شامل چندین بخش برای سفارشی سازی پوسته وردپرس می باشد که شامل:
۱- ویت سایت
٢- رنگ ها
٣- تصویر سر برگ
۴- برگه ی نخست ایستا
می باشد.

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

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

٢- اعمال تغییرات در طراحی به وسیله افزونه های فوری quick-fix

همان طور که در بالا اشاره کردیم گاهی اوقات فقط یک یا چند جنبه خاص برای طراحی وجود دارد که این امر باعث ناراحتی شما می شود؛ اما متاسفانه هیچ گزینه ای برای سفارشی کردن آن موارد خاص در قسمت سفارشی سازی وردپرس وجود ندارد. در این شرایط ممکن است یک افزونه برای حل مسئله مورد نظرتان طراحی شده باشد. یعنی برای هرمورد از پلاگین مورد نظر آن استفاده کنید.
برای درک بهتر این موضوع یک مثال ساده ارائه میکنیم. اگر شما چندین رنگی که در پوسته وجود دارد را نمی پسندید، در این صورت می توانید از یک افزونه مانند  Theme Tweaker برای ایجاد تغییر در رنگ پوسته استفاده کنید.
و یا اگر پوسته شما با یک تصویر هدر استاندارد همراه است و شما نمی تواتید آن را تغییر دهید یا اینکه می خواهید تصاویر هدر های مختلفی را در صفحات یا در دسته های مختلف داشته باشید، یک افزونه به نام Uique Headers برای این کار وجود دارد. که برای تنظیم سر صفحه های منحصر به فرد برای صفحات ، دسته ها و هم چنین برچسب ها و غیره استفاده می شود و این امکان را دارد که در تغییر در طراحی پوسته وردپرس موثر باشد.
اما این دسته ازافزونه ها که معمولا با نام  quick – fix شناخته می شوند می توانند تاثیر منفی بر عملکرد داشته باشند، به ویژه اگر بخواهید به طور هم زمان از چندین مورد استفاده کنید. پس با این وجود باید سایر گزینه ها را هم بررسی کنیم.

٣- اعمال تغییراتی کوچک در طراحی با افزونه های Page Builder

شما می توانید از این دسته از افزونه وردپرس برای ایجاد تغییر در ساخت صفحات استفاده نمایید. امروزه برخی از صفحه سازها بر روی پوسته های از قبل ساخته  شده قلم می زنند و در آنها تغییراتی ایجاد می کنند. این به این معنی است که ما می توانیم یک سری صفحه با طرح دلخواه خود بسازیم. ( مانند Divi یا WPMU U pront. ) افزونه های صفحه ساز به شما این امکان را می دهد که بتوانید کنترل کامل بر محتوا در داخل یک صفحه یا پست را انجام دهید.
مانند Visual composer و یا Beaver Builder . حال اگر شما واقعا دوست دارید که طراحی پوسته فعلی خود را حفظ نمایید این روش به طور حتم بهترین روش برای شما می باشد ، چون در این روش شما به راحتی این توانایی را دارید که به سادگی صفحات پویا ساخته و هم چنین در طراحی پوسته وردپرس برای وب سایت خود تغییراتی ایجاد کنید.
همچنین شما این قابلیت را دارید که با استفاده از افزونه های صفحه ساز به راحتی صفحاتی با طراحی دلخواه خود حتی با ستون های چند گانه ایجاد کرد و اگر پوسته از موارد تک ستون پشتیبانی کرده باشد باز هم امکان ایجاد صفحات پویا با ستون های متعدد و پیچیده ای وجود دارد.
با انجام این کار شما به راحتی می توانید صفحاتی مانند نمونه کارها و صفحات ورودی و یا سایر موارد دیگر تهیه و اجرا نمایید. همچنین امکان درج محتویات را به صورت تعاملی آسان تر همراه افزودن رسانه ها به پست های خود با سایر فرمت ها فراهم می کند.

۴- تغییرات میانه در طراحی – تغییر در CSS با استفاده از افزونه

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

• چگونگی پیدا کردن کلاس عنصر مربوط به یک نوع سبک
• نحوه کار کردن با آن برای ایجاد تغییر در یک پوسته رسپانسیو

نحوه ایجاد تغییرات به وسیله ی ادیتور : برای تغییر در css مربوط به هر بخش خاص باید ابتدا قسمت های مورد نظر را در مرورگر مشخص کنید، شما برای انجام این کار ابتدا روی بخش مورد نظر کلیک راست کرده و سپس گزینه ی inspect را انتخاب کنید که HTML کد و CSS مربوط به بخش مورد نظر را نشان می دهد.برای درک بهتر مثالی را برایتان ذکر می کنیم. تصور کنید که شما می خواهید عنوان یک پست را در سایت وردپرسی بررسی و مشاهده نمایید در این صورت شما با کلیک راست بر روی عنوان پست و انتخاب insect به ما html و css مربوط به عنوان پست را نمایش می دهید. مشابه تصویری که در پایین مشاهده می نمایید .

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

@media screen and (min-width: 61.5625em)

و سبک های زیر که در ارتباط با آن می باشند

.entry-title.
font-size: 40px;
font-size: 2.5rem;
line-height: 1.225;
margin-bottom: 1.05em;

این کد همواره به این معنی می باشد که یعنی این سبک ها زمانی اعمال می شوند و به کار می آیند که صفحه نمایش یا به عبارت دیگر پنجره مرور گر بزرگتر از em61 . 5625 یا( ٩٨۵ پیکسل ) باشد. بنابر این اگر شما می خواهید چیزی به صورت خاص و مشخص بر روی یک صفحه خاص ظاهر بشود ، باید حتما از پرس و جوی رسانه ای برای ایجاد تغییر در طراحی پوسته وردپرس کمک بگیرید .
و یا مواردی مانند اندازه فونت در مثال زیر :

حال ما برای تست سایز فونت entry – title را با یک مقیاس بسیار بزرگ وارد کردیم تا به این صورت بتوانیم اختلاف آن را در صفحه نمایش ها با اندازه های بسیار مختلف مشاهده کنیم برای تایید اینکه کد را به درستی نوشته ایم.
عنوان من در یک صفحه ی بزرگ ، مشابه با تصویری که در پایین مشاهده می کنید خواهد بود:

و اما اگر ما صفحه را به اندازه تلفن همراه و یا تبلت کنیم ؛عنوان ورود من بدون هیچ گونه تغییری باقی خواهد ماند.

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

۵- ایجاد تغییرات اساسی با کمک پوسته ی فرزند

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

نتیجه گیری

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