এখানে একটি খুব প্রাথমিক উদাহরণ ..
/*
Code assumes it will be in the theme functions.php file
Update the enqueue path if using it elsewhere
*/
add_action( 'add_meta_boxes_post', 'add_post_metabox' );
function add_post_metabox() {
wp_enqueue_script( 'mytabs', get_bloginfo( 'stylesheet_directory' ). '/mytabs.js', array( 'jquery-ui-tabs' ) );
add_meta_box( 'examplebox' , __('Example box'), 'my_example_metabox', 'post', 'side', 'core'/*,array()*/);
}
function my_example_metabox() {
?>
<div id="mytabs">
<ul class="category-tabs">
<li><a href="#frag1">Tab 1</a></li>
<li><a href="#frag2">Tab 2</a></li>
<li><a href="#frag3">Tab 3</a></li>
</ul>
<br class="clear" />
<div id="frag1">
<p>#1 - Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div>
<div class="hidden" id="frag2">
<p>#2 - Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div>
<div class="hidden" id="frag3">
<p>#3 - Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div>
</div>
<?php
}
এনকুইতে উল্লিখিত mytabs.js এর jQuery।
jQuery(document).ready(function($) {
$("#mytabs .hidden").removeClass('hidden');
$("#mytabs").tabs();
});
মন্তব্য:
- একটি প্লাগইন ভিতরে ব্যবহৃত, এনকুই স্ট্রিংয়ের
plugins_url( '/mytabs.js', __FILE__ )
জায়গায় কল করা উচিত get_bloginfo
।
- প্রতিটি ট্যাবের জন্য অ্যাঙ্কর লিঙ্কটি উল্লেখ করা সামগ্রীর উপাদানটির আইডিটির সাথে মেলে। ভঙ্গ 1, ভঙ্গ 2, ইত্যাদি
- প্রথম পৃষ্ঠার পরে প্রতিটি কন্টেন্ট ডিআইভিতে একটি লুকানো শ্রেণি প্রয়োগ করা হয় যাতে তারা পৃষ্ঠার লোডে লুকিয়ে থাকে (অন্যথায় আপনি পৃষ্ঠাটিতে একটি সংক্ষিপ্ত লাফটি লক্ষ্য করবেন), পৃষ্ঠা লোডের পরে ক্লাসটি সরানো হবে, অন্যথায় তারা লুকিয়ে থাকবে।
- আপনি যে পোস্টটি প্রভাব করতে চান তার প্রতিচ্ছবি করতে শীর্ষ পদক্ষেপটি আপডেট করা উচিত
add_action( "add_meta_boxes_YOURTYPE", 'add_post_metabox' );
, আমি post
উদাহরণটিতে ব্যবহার করেছি ..
- বিদ্যমান ওয়ার্ডপ্রেস সিএসএস যা ট্যাব এলআই উপাদানগুলিকে ইনলাইন অবস্থিত করে তা কাজে লাগাতে আপনাকে পাশের মেটাবক্স রেন্ডার করতে হবে (যদিও আপনি সিএসএসের সাথে ডিল করতে নিজের স্টাইলশীটটি সর্বদা লোড করতে পারেন)।
ট্যাব স্ক্রিপ্টটি কীভাবে কনফিগার করতে হয় সে সম্পর্কে আরও তথ্যের জন্য এখানে দেখুন।
http://docs.jquery.com/UI/Tabs
আশা করি এইটি কাজ করবে..