সর্বশেষ আপডেট : এপ্রিল ১২, ২০১৭ তারিখে ৩:৪৫ অপরাহ্ণ
আজ : ২৭শে এপ্রিল, ২০১৭ ইং | ১৪ই বৈশাখ, ১৪২৪ বঙ্গাব্দ

ওয়ার্ডপ্রেসে পোষ্টের আর্কাইভকে উলম্ব বারে প্রর্দশন করা

মেহেদী আকরাম | জানুয়ারী ৩, ২০১৫, ১১:০৪ পূর্বাহ্ণ
Domain

ওয়ার্ডপ্রেসে ডিফল্ট আর্কাইভ উইজেটস এবং ক্যালেন্ডারের উইজেটস এর মাধ্যমে মাস হিসাবে আর্কাইভ দেখানো যায়। আমরা দেখাবো কিভাবে আর্কাইভ বছর/মাসের পোস্টের সংখ্যাকে উলম্ব বার আকারে প্রদর্শণ করা যায়। ফলে প্রতিটি বছর এক একটি রো হিসাবে দেখাবে এবং প্রতিটি রো তে ১২টি মাস থাকবে। যে মাসে কোন পোস্ট থাকেবে না যেই মাসের উলম্ব বার শুন্য থাকবে।
যখন কোন বছরের রো এর উপরে মাউস রাখবেন তখন উক্ত বছরের মোট পোষ্টের সংখ্যা দেখাবে এবং যখন কোন মাসের উপরে মাউস রাখবেন তখন উক্ত মাসের পোষ্টের সংখ্যা দেখাবে।

নিচেন ফাংশনটি functions.php এ লিখুন।

function royal_bar_month_archives() {
    global $wpdb;
    $where = "WHERE post_type = 'post' AND post_status = 'publish'";
    $query = "SELECT YEAR(post_date) AS `year`, MONTH(post_date) AS `month`, count(ID) as posts FROM $wpdb->posts $where GROUP BY YEAR(post_date), MONTH(post_date) ORDER BY YEAR DESC, MONTH ASC";
    $_archive = $wpdb->get_results( $query );

    $last_year  = (int) $_archive[0]->year;
    $first_year = (int) $_archive[ count( $_archive ) - 1 ]->year;

    $archive    = array();
    $max        = 0;
    $year_total = array();
    
    foreach( $_archive as $data ) {
        if( !isset( $year_total[ $data->year ] ) ) {
            $year_total[ $data->year ] = 0;
        }
        $archive[ $data->year ][ $data->month ] = $data->posts;
        $year_total[ $data->year ] += $data->posts;
        $max = max( $max, $data->posts );
    }
    unset( $_archive );

    for ( $year = $last_year; $year >= $first_year; $year-- ) {
        echo '<div class="archive_year">';
        echo '<span class="archive_year_label">' . $year;
        if( isset( $year_total[$year] ) ) {
            echo '<span class="archive_year_count">' . $year_total[$year] . ' posts</span>';
        }
        echo '</span>';
        echo '<ol>';
        for ( $month = 1; $month <= 12; $month++ ) {
            $num = isset( $archive[ $year ][ $month ] ) ? $archive[ $year ][ $month ] : 0;
            $empty = $num ? 'not_empty' : 'empty';
            echo "<li class='$empty'>";
            $height = 100 - max( floor( $num / $max * 100 ), 20 );
            if( $num ) {
                $url = get_month_link( $year, $month );
                $m = str_pad( $month, 2, "0", STR_PAD_LEFT);
                echo "<a href='$url' title='$m/$year : $num posts'><span class='bar_wrap'><span class='bar' style='height:$height%'></span></span>";
                echo "<span class='label'>" . $m . "</span>";
                echo "</a>";
            }
            echo '</li>';
        }
        echo '</ol>';
        echo "</div>";
    }
}

নিচের সিএসএস লিখুন

/* Bar Archive */
#archives ol {
margin:-3px 0 5px;
padding:0;
list-style:none;
overflow:hidden;
width:100%;
}
#archives ol li {
display:inline-block;
float:left;
width:8%;
height:30px;
margin-left:.33333%;
background:#D6E685;
}
#archives ol li.empty {
background:rgba(246, 248, 231, 0.5);
}
#archives ol li a {
display:inline-block;
width:100%;
height:20px;
background:none;
padding:0;
}
#archives ol li a:hover {
border-radius:0;
background:inherit;
}
#archives span.bar_wrap {
width:100%;
height:100%;
zbackground:#F6F8E8;
display:block;
}
#archives span.bar {
width:100%;
background:#F6F8E8;
display:block;
}
#archives ol li.not_empty:hover {
background:#44A340;
}
#archives span.label {
display:block;
width:100%;
height:10px;
font-size:10px;
text-align:center;
line-height:2px;
color:transparent;
padding:2px 0px;
}
#archives ol li.not_empty:hover span.label {
color:white;
}
#archives .archive_year_label {
font-size:12px;
font-weight:bold;
color:#1E6823;
padding-left:2px;
}
#archives .archive_year:hover .archive_year_label {
color:#333;
}
#archives .archive_year_count {
display:none;
}
#archives .archive_year:hover .archive_year_count {
display:inline;
margin-left:30px;
color:#8CC665;
}

এবার যেখানে আর্কাইভ দেখাতে চান সেখানে নিচের ফংশনটি কল করুন

<div id='archives'>
    <?php royal_bar_month_archives(); ?>
</div>

ফলাফল নিচের স্ক্রিনশেটর মত দেখাবে
বার আর্কাইভ

২টি মন্তব্য

  1. ধন্যবাদ, অনেক কিছু জানার ছিল। আমরা অনেকে অনেক কিছুই জানি না। আপনা এই পোস্টটি দ্বারা অনেকে কিছু তথ্য জানতে পারবে।আমি আপনাকে কোন প্রকার অফার করছি না। ছোট একটি তথ্য আপনার উপকারে আসতে পারে
    http://rentalhomebd.com/

মন্তব্য করুন