Why Should You Change the Way WordPress Archives Are Displayed in Your Sidebar?
Compact Archive Creation
By being a little wider, the compact archives list saves vertical space. As a result, it might be better suited to a footer or archives page than than a sidebar.
The plugin is, however, highly adjustable, and you can make it narrower by showing only the first initial or a number for each month. More information on how to make compact archives in WordPress may be found in our guide.
Using a Collapsible Outline to Display Archives
Displaying a collapsible outline of the years and months that you wrote blog content is another method to deal with big archives listings.
The Collapsing Archives plugin must be installed and activated in order to accomplish this. You must go to Appearance » Widgets and add the ‘Compact Archives‘ widget to your sidebar after activation.
The Collapsing Archives widget collapses your archive by year using JavaScript. Your users can extend years to see monthly archives by clicking on them. You may also make monthly archives collapsible so that users can view the names of the posts beneath them.
On our sample website, this is how it looks.
Setting a Limit on the Number of Archive Months Shown
Limiting the number of months displayed to, say, the latest six months is a third technique to keep your archives list from being too big.
You’ll need to add code to your WordPress theme’s files to accomplish this. See our article on how to copy and paste code in WordPress if you haven’t done it before.
Add the following code snippet to your functions.php file, a site-specific plugin, or a code snippets plugin as the initial step.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
// Function to get archives list with limited monthsfunction wpb_limit_archives() { $my_archives = wp_get_archives(array( 'type'=>'monthly', 'limit'=>6, 'echo'=>0)); return $my_archives; } // Create a shortcodeadd_shortcode('wpb_custom_archives', 'wpb_limit_archives'); // Enable shortcode execution in text widgetadd_filter('widget_text', 'do_shortcode'); |
Edit the number on line 6 to adjust the number of months displayed. If you modify the number to ’12,’ for example, it will show 12 months of archives.
You may now add a ‘Custom HTML’ widget to your sidebar by going to Appearance » Widgets. Then, in the widget box, copy and paste the following code:
|
1
2
3
|
<ul>[wpb_custom_archives]</ul> |
Archives are listed on a daily, weekly, monthly, or annual basis.
The Annual Archive plugin will provide you greater control over how your archives are displayed. It allows you to organize your archives by decade and list them daily, weekly, monthly, annually, or alphabetically.
Install and activate the Annual Archive plugin to get started. The Annual Archive widget can then be dragged to your sidebar from the Appearance » Widgets page.
You can choose whether to display a list of days, weeks, months, years, decades, or posts after giving the widget a title. You can limit the amount of archives displayed, choose a sort option, and add additional text by scrolling down to other options.
If you go to Settings » Annual Archive, you may use custom CSS to further modify the archive list.
Monthly Archives are organized by year.
We were once working on a site design for a client who needed monthly archives organized by year in the sidebar. Because this client only wanted to show the year once on the left, it was challenging to code.
Andrew Appleton was able to tweak some code for us. Because Andrew’s code lacked a limit option for the archives, the list displayed all archive months. We included a limit parameter that limited the number of months displayed to only 18 at any given moment.
To show custom WordPress archives, insert the following code into your theme’s sidebar.php file or any other file where you wish to display them:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
|
<?phpglobal $wpdb;$limit = 0;$year_prev = null;$months = $wpdb->get_results("SELECT DISTINCT MONTH( post_date ) AS month , YEAR( post_date ) AS year, COUNT( id ) as post_count FROM $wpdb->posts WHERE post_status = 'publish' and post_date <= now( ) and post_type = 'post' GROUP BY month , year ORDER BY post_date DESC");foreach($months as $month) : $year_current = $month->year; if ($year_current != $year_prev){ if ($year_prev != null){?> <?php } ?> <li class="archive-year"><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/"><?php echo $month->year; ?></a></li> <?php } ?> <li><a href="<?php bloginfo('url') ?>/<?php echo $month->year; ?>/<?php echo date("m", mktime(0, 0, 0, $month->month, 1, $month->year)) ?>"><span class="archive-month"><?php echo date_i18n("F", mktime(0, 0, 0, $month->month, 1, $month->year)) ?></span></a></li><?php $year_prev = $year_current; if(++$limit >= 18) { break; } endforeach; ?> |
You must adjust line 19 where the current $limit value is set to 18 if you want to change the number of months displayed.
You can also display the number of posts in each month by inserting the following code between lines 12–16 of the above code:
<?php echo $month->post_count; ?>
To show the archive list correctly on your website, you’ll need to apply custom CSS. On our client’s website, we used CSS that looked like this:
|
1
2
3
4
5
6
|
.widget-archive{padding: 0 0 40px 0; float: left; width: 235px;}.widget-archive ul {margin: 0;}.widget-archive li {margin: 0; padding: 0;}.widget-archive li a{ border-left: 1px solid #d6d7d7; padding: 5px 0 3px 10px; margin: 0 0 0 55px; display: block;}li.archive-year{float: left; font-family: Helvetica, Arial, san-serif; padding: 5px 0 3px 10px; color:#ed1a1c;}li.archive-year a{color:#ed1a1c; margin: 0; border: 0px; padding: 0;} |
We hope this lesson showed you how to alter the way WordPress archives are displayed in your sidebar.
Comments are closed.