mehdi.tayebi

نحوه تبدیل و ایجاد یک تکه کد به پلاگین در وردپرس

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

با سلام .

من یک تیکه کد دارم برای نمایش آخرین مطالب و همچنین نمایش دسته بندی ها که به صورت تب بندی ایجاد کردم . این کدها رو میتوانم به راحتی در بخش ساید بار قالبم قرار بدم اما میخوام که قابل جابجایی در بخش ابزارک هام باشه . می خواستم ببینم آیا راهی وجود داره که این تکه کد را به ابزارک تعریف و تبدیل کردش ؟

به دو حالت :

1- به صورت حالت پلاگین نصبی به صورت جدا

2 - به صورت حالت ابزارک بروی قالب در هنگام نصب .

کد های مربوطه من به صورت زیر است :

1 کد PHP :


<div class="panel with-nav-tabs panel-primary">
<div class="panel-heading">
<ul class="nav nav-tabs">
<li class="active"><a href="#categories-articles" data-toggle="tab">دسته بندي مقالات</a></li>
<li><a href="#last-articles" data-toggle="tab">آخرين مقالات</a></li>
</ul>
</div>

<div class="panel-body">
<div class="tab-content">
<div class="tab-pane fade in active" id="categories-articles">
<ul class="nav nav-pills nav-stacked">
<?php wp_list_categories('orderby=name&title_li='); ?>
</ul>
</div>
<div class="tab-pane fade" id="last-articles">
<?php
$lastblog_query= new WP_Query(array(
'post_type' => 'post',
'post_status' => 'publish',
'order' => 'DESC',
'orderby' => 'ID',
'posts_per_page' =>'5',
'paged' => (get_query_var('paged')) ? get_query_var('paged') : 1
)); ?>
<?php if($lastblog_query->have_posts()) : ?>
<?php while($lastblog_query->have_posts()) : $lastblog_query->the_post();?>
<a href="<?php the_permalink();?>" title="<?php the_title_attribute('echo=1'); ?>" rel="bookmark"><?php the_title(); ?></a>
<?php the_time('l jS F Y'); ?>
<?php the_post_thumbnail('sidebar-thumb'); ?>
<?php the_content(); ?>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_query(); ?>
</div>
</div>
</div>
</div>

کد CSS مربوط به آن :


.panel.with-nav-tabs .panel-heading{
padding: 5px 5px 0 5px;
}
.panel.with-nav-tabs .nav-tabs{
border-bottom: none;
}
.panel.with-nav-tabs .nav-justified{
margin-bottom: -1px;
}
.with-nav-tabs.panel-primary .nav-tabs > li > a,
.with-nav-tabs.panel-primary .nav-tabs > li > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > li > a:focus {
color: #fff;
}
.with-nav-tabs.panel-primary .nav-tabs > .open > a,
.with-nav-tabs.panel-primary .nav-tabs > .open > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > .open > a:focus,
.with-nav-tabs.panel-primary .nav-tabs > li > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > li > a:focus {
color: #fff;
background-color: #3071a9;
border-color: transparent;
}
.with-nav-tabs.panel-primary .nav-tabs > li.active > a,
.with-nav-tabs.panel-primary .nav-tabs > li.active > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > li.active > a:focus {
color: #428bca;
background-color: #fff;
border-color: #428bca;
border-bottom-color: transparent;
}
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu {
background-color: #428bca;
border-color: #3071a9;
}
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a {
color: #fff;
}
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a:focus {
background-color: #3071a9;
}
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a,
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover,
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus {
background-color: #4a9fe9;
}

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

با تشکر .

0

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


لینک به پست

[sharedmedia=tutorials:tutorials:425]

1

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


لینک به پست

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

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

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

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


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

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

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


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