saeedagha

پس زمینه مخصوص هر ابزارک

8 پست در این موضوع قرار دارد

با سلام !

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

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


if (function_exists('register_sidebar')) { register_sidebar(array( 'name' => 'ابزارک های سایدبار', 'id' => 'sidebar-widgets', 'description' => 'ابزارکی به این ناحیه اضافه نمایید....', 'before_widget' => '<div class="aside" class="widget %2$s">', 'after_widget' => '</div>', 'before_title' => '<h3>', 'after_title' => '</h3>' )); }

در قسمت سایدبار هر ابزارک با ابزارک های دیگه دارای کلاس مشابه هستند و با تغییر روی هر قسمت به کل ابارک ها این تغییرات اعمال میشه

0

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

اون انتها خودم پست دادم ولی چون کسی جواب نداد این تاپیکو ایجاد کردم :(

ویرایش شده در توسط saeedagha
0

به اشتراک گذاری این پست


لینک به پست

شما به هر ابزارک آی دی اختصاصی بدید (باید بدید)

بعد طبق همون توی استایل بهش پس زمینه بدید

4

به اشتراک گذاری این پست


لینک به پست

ارسال شده در (ویرایش شده)

شما به هر ابزارک آی دی اختصاصی بدید (باید بدید)

بعد طبق همون توی استایل بهش پس زمینه بدید

همین قسمت ای دی اختصاصی رو یک کم باز تر می کنید؟ چه تغییری دقیقا باید توی کدهای بالا بدم

ممنون

ویرایش شده در توسط saeedagha
0

به اشتراک گذاری این پست


لینک به پست

می تونید این کد رو چک کنید

البته کدتون ایراد داره به یک div دوبار کلاس داده در اینجا


<div class="aside" class="widget %2$s">

که باید بشه


<div class="aside widget %2$s">

و بعد این کد را به css اضافه کنید


#sidebar-widgets .widget:nth-child(1)
{
background:#FF99FF
}
#sidebar-widgets .widget:nth-child(2)
{
background:#FFFF99
}
#sidebar-widgets .widget:nth-child(3)
{
background:#FF99FF
}
#sidebar-widgets .widget:nth-child(4)
{
background:#9999FF
}
...

همینطور الی آخر

4

به اشتراک گذاری این پست


لینک به پست

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

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

این پلاگین رو هم نصب کردم

13745745981.png

0

به اشتراک گذاری این پست


لینک به پست

از inspect element مرورگر استفاده کنید

2

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری