ورود

developzoom · 06-11-2016, 06:13 PM

[img=768x0]http://www.developzoom.com/wp-content/uploads/2016/04/developzoom-wordpress-widgets.png[/img]
آموزش ساخت ویجت برای وردپرس در سایت آموزش برنامه نویسی :
برای انجام این کار سه مرحله را باید طی کنیم(سه مرحله خیلی آسان).
۱- ثبت ویجت در قالب وردپرس
۲- وارد کردن ویجت در قالب وردپرس
۳- افزودن استایل دلخواه به ویجت
نکته: قبل از اعمال تغییرات از فایل functions.php و footer.php بک آپ بگیرید که در صورت اشتباه نسخه اصلی را داشته باشید.
مرحله اول: ثبت ویجت در قالب وردپرس
فایل functions.php که در قالب خود دارید را باز کنید و عبارت زیر را در آن جستجو کنید:
register_sidebar
جستجوی این عبارت شما را به بخشی از کد که در آنجا سایدبارها ثبت شده اند هدایت می شوید.
حالا کد زیر را در آنجا کپی کنید. این تکه کد سه ناحیه ابزارک(widget area) در بخش فوتر ایجاد می کند.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

کد: 
register_sidebar(

کد: 
array

کد: 
(

کد: 
'name'

کد: 
=>

کد: 
'Developzoom Sidebar 1'

کد: 
,

کد: 
'id'

کد: 
=>

کد: 
'footer-sidebar-1'

کد: 
,

کد: 
'description'

کد: 
=>

کد: 
'Appears in the footer area'

کد: 
,

کد: 
'before_widget'

کد: 
=>

کد: 
'<aside id="%1$s" class="widget %2$s">'

کد: 
,

کد: 
'after_widget'

کد: 
=>

کد: 
'</aside>'

کد: 
,

کد: 
'before_title'

کد: 
=>

کد: 
'<h3 class="widget-title">'

کد: 
,

کد: 
'after_title'

کد: 
=>

کد: 
'</h3>'

کد: 
,

کد: 
) );

کد: 
register_sidebar(

کد: 
array

کد: 
(

کد: 
'name'

کد: 
=>

کد: 
'Developzoom Sidebar 2'

کد: 
,

کد: 
'id'

کد: 
=>

کد: 
'footer-sidebar-2'

کد: 
,

کد: 
'description'

کد: 
=>

کد: 
'Appears in the footer area'

کد: 
,

کد: 
'before_widget'

کد: 
=>

کد: 
'<aside id="%1$s" class="widget %2$s">'

کد: 
,

کد: 
'after_widget'

کد: 
=>

کد: 
'</aside>'

کد: 
,

کد: 
'before_title'

کد: 
=>

کد: 
'<h3 class="widget-title">'

کد: 
,

کد: 
'after_title'

کد: 
=>

کد: 
'</h3>'

کد: 
,

کد: 
) );

کد: 
register_sidebar(

کد: 
array

کد: 
(

کد: 
'name'

کد: 
=>

کد: 
'Developzoom Sidebar 3'

کد: 
,

کد: 
'id'

کد: 
=>

کد: 
'footer-sidebar-3'

کد: 
,

کد: 
'description'

کد: 
=>

کد: 
'Appears in the footer area'

کد: 
,

کد: 
'before_widget'

کد: 
=>

کد: 
'<aside id="%1$s" class="widget %2$s">'

کد: 
,

کد: 
'after_widget'

کد: 
=>

کد: 
'</aside>'

کد: 
,

کد: 
'before_title'

کد: 
=>

کد: 
'<h3 class="widget-title">'

کد: 
,

کد: 
'after_title'

کد: 
=>

کد: 
'</h3>'

کد: 
,

کد: 
) );

مرحله دوم: وارد کردن ویجت در قالب وردپرس
فایل footer.php خود را باز کنیدو کد زیر را در هر بخشی از فوتر که می خواهید ابزارک ها را نمایش دهید وارد کنید.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

کد: 
<

کد: 
div

کد: 
id

کد: 
=

کد: 
"footer-sidebar"

کد: 
class

کد: 
=

کد: 
"secondary"

کد: 
>

کد: 
<

کد: 
div

کد: 
id

کد: 
=

کد: 
"footer-sidebar1"

کد: 
>

کد: 
<?

کد: 
php

کد: 
if(is_active_sidebar('footer-sidebar-1')){

کد: 
dynamic_sidebar('footer-sidebar-1');

کد: 
}

کد: 
?>

کد: 
</

کد: 
div

کد: 
>

کد: 
<

کد: 
div

کد: 
id

کد: 
=

کد: 
"footer-sidebar2"

کد: 
>

کد: 
<?

کد: 
php

کد: 
if(is_active_sidebar('footer-sidebar-2')){

کد: 
dynamic_sidebar('footer-sidebar-2');

کد: 
}

کد: 
?>

کد: 
</

کد: 
div

کد: 
>

کد: 
<

کد: 
div

کد: 
id

کد: 
=

کد: 
"footer-sidebar3"

کد: 
>

کد: 
<?

کد: 
php

کد: 
if(is_active_sidebar('footer-sidebar-3')){

کد: 
dynamic_sidebar('footer-sidebar-3');

کد: 
}

کد: 
?>

کد: 
</

کد: 
div

کد: 
>

کد: 
</

کد: 
div

کد: 
>

مرحله سوم: افزودن استایل دلخواه به ویجت
حالا استایل زیر رو به فایل style.css خود اضافه کنید.

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

کد: 
#footer-sidebar {

کد: 
display

کد: 
:

کد: 
block

کد: 
;

کد: 
height

کد: 
:

کد: 
250px

کد: 
;

کد: 
}

کد: 
#footer-sidebar

کد: 
1

کد: 
{

کد: 
float

کد: 
:

کد: 
left

کد: 
;

کد: 
width

کد: 
:

کد: 
340px

کد: 
;

کد: 
margin-left

کد: 
:

کد: 
5px

کد: 
;

کد: 
margin-right

کد: 
:

کد: 
5px

کد: 
;

کد: 
}

کد: 
#footer-sidebar

کد: 
2

کد: 
{

کد: 
float

کد: 
:

کد: 
left

کد: 
;

کد: 
width

کد: 
:

کد: 
340px

کد: 
;

کد: 
margin-right

کد: 
:

کد: 
5px

کد: 
;

کد: 
}

کد: 
#footer-sidebar

کد: 
3

کد: 
{

کد: 
float

کد: 
:

کد: 
left

کد: 
;

کد: 
width

کد: 
:

کد: 
340px

کد: 
;

کد: 
}

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

منبع : آموزش وردپرس

ورود
نام کاربری:
گذرواژه‌:	گذرواژه‌تان را فراموش کرده‌اید؟
	مرا به خاطر بسپار