طراحي قالب وردپرس

طراحي قالب وردپرس , طراحي پوسته وردپرس , طراحي قالب ريسپانسيو , طراحي قالب

کاملا ریسپانسیو و واکنش گرا داری پنل تنظیمات

طراحی قالب وردپرس و طراحی فروشگاه وردپرسی

شروع و سفارش طراحی

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


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

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

 

روند ایجاد ابزارک در وردپرس :

  1. ثبت ابزارک در فایل توابع وردپرس
  2. قرار دادن کد تعیین منطقه ابزارک در قالی
  3. ایجاد استایل مناسب برای ستون های ابزارک

 

برای شروع باید قالب خود را برای درج ابزارک اماده کنید :

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

فایل توابع وردپرس (function.php) را با یک ویرایشگر بازکنید:

در خط های موجود در توابع دنبال تابعی به نام register_sidebar باشید که با استفاده از این تابع میتوانید تعداد ستون ها و یا ابزارک های خود را ایجاد کنید .

حالا برای ثبت این سه ستون میتوانید کد زیر را در توابع وردپرس (functions.php) خود درج کنید:

register_sidebar( array(
‘name’ => ‘Footer Sidebar 1’,
‘id’ => ‘footer-sidebar-1’,
‘description’ => ‘ابزارک بخش فوتر’,
‘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’ => ‘Footer Sidebar 2’,
‘id’ => ‘footer-sidebar-2’,
‘description’ => ‘ابزارک بخش فوتر’,
‘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’ => ‘Footer Sidebar 3’,
‘id’ => ‘footer-sidebar-3’,
‘description’ => ‘ابزارک بخش فوتر’,
‘before_widget’ => ‘<aside id=”%1$s” class=”widget %2$s”>’,
‘after_widget’ => ‘</aside>’,
‘before_title’ => ‘<h3 class=”widget-title”>’,
‘after_title’ => ‘</h3>’,
) );

 

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

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

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

<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) میتوانید از نظر رنگ و چینش و از نظر رنگ بندی محتوایی مدیریت بهتری کنیم و استایل مورد نظر را اضافه کنیم.

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

#footer-sidebar {
display:block;
height: 250px;
}

#footer-sidebar1 {
float: left;
width: 340px;
margin-left:5px;
margin-right:5px;
}

#footer-sidebar2 {
float: left;
width: 340px;
margin-right:5px;
}

#footer-sidebar3 {
float: left;
width: 340px;
}

امیدوارم این مقاله کمک زیادی به شما کرده باشد

*

code

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