نحوه اضافه کردن کلاس فرد یا زوج به پست خود در قالب های وردپرس

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

Adding Odd/Even class to your posts in WordPress themes

چرا کلاسهای فرد یا زوج را به موضوعات وردپرس به پست های خود اضافه کنید؟ h4>

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

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

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

افزودن کلاس فرد / زوج به پست ها در قالب وردپرس h4>

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

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

post_class همچنین فیلتر a > ، این بدان معناست که شما می توانید عملکردهای خود را به آن وصل کنید. این دقیقاً همان کاری است که ما در اینجا انجام خواهیم داد.

نگران نباشید ، این کد را به functions.php پرونده یا افزونه اختصاصی سایت .

عملکرد oddeven_post_class ($ کلاس) {
   $ $_class جهانی؛
   $ class [] = $ current_class؛
   $ current_class = ($ current_class == "عجیب")؟ 'زوج فرد'؛
   کلاسهای $ را برگردانید
}
add_filter ('post_class'، 'oddeven_post_class')؛
$ $_class جهانی؛
$ current_class = 'عجیب'؛

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

می توانید کلاسهای فرد و زوج را در کد منبع سایت خود پیدا کنید. به سادگی ماوس را به سمت عنوان پست ببرید و سپس کلیک راست کنید تا گزینه Inspect یا Inspect Element را انتخاب کنید.

Odd and Even classes in source code

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

در اینجا یک نمونه CSS آورده شده است که می توانید از آن به عنوان نقطه شروع استفاده کنید:

.زوج {
پس زمینه: # f0f8ff؛
}
.فرد {
 پس زمینه: # f4f4fb؛
}

در سایت آزمون ما اینگونه مشاهده شد:

Posts using alternate background colors with even/odd css classes in WordPress

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

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

اگر این مقاله را دوست داشتید ، لطفاً در کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .

منبع:
https://www.wpbeginner.com/wp-themes/how-to-add-oddeven-class-to-your-post-in-wordpress-themes/.

دیدگاهتان را بنویسید