How to add a css style class atribute to links generated from wp_get_archives?


Tags: php,css,wordpress,class,widget

Problem :

For one wordpress custom theme what i am developing,

What do i have to do in order to get: <a class="archive_link" href...> instead of: <a href...>

from the wp_get_archives function for an aside widget?

In functions.php i have this:

function sxo_widgets_init() {
    register_sidebar( array(
        'name' => __( 'Primary Widget Area', 'sxo' ),
        'id' => 'sidebar-1',
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h1 class="widget-title">',
        'after_title' => '</h1>'
    ) );
}
add_action( 'widgets_init', 'sxo_widgets_init' );

And in aside.php template i have:

...
<ul>
    <?php wp_get_archives( array( 'type' => 'monthly') ); ?>
</ul>
...

(UPDATED) And, i forgot to say that in funtions.php:

function sxo_widgets_init() {
    register_sidebar( array(
       'name' => __( 'Primary Widget Area', 'sxo' ),
       'id' => 'sidebar-1',
       'before_widget' => '<aside id="%1$s" class="widget %2$s">',
       'after_widget' => '</aside>',
       'before_title' => '<h1 class="widget-title">',
       'after_title' => '</h1>'
   ) );
}
add_action( 'widgets_init', 'sxo_widgets_init' );

(UPDATED 2 - aside.php:)

<?php
/**
* The Sidebar containing the main widget areas.
*
* @package sxo
* @since sxo 1.0
*/
?>
<div id="secondary" class="widget-area" role="complementary">
    <?php do_action( 'before_sidebar' ); ?>
    <?php if ( ! dynamic_sidebar( 'sidebar-1' ) ) : ?>

        <aside id="search" class="widget widget_search">
            <?php get_search_form(); ?>
        </aside>

        <aside id="archives" class="widget">
            <h1 class="widget-title"><?php _e( 'Archives', 'sxo' ); ?></h1>
            <ul class="archive-sidebar">    
                 <?php wp_get_archives( array( 'type' => 'monthly') ); ?> <!--'before' => '<a class="widget-link">', 'after' => '</a>'?>-->
                  <?php /*wp_get_archives( array( 'type' => 'monthly', 'format' => 'custom', 'before' => '<a class="widget-link">', 'after' => '</a>') ); ?> <!--'before' => '<a class="widget-link">', 'after' => '</a>'?>-->


                 <?php //<?php wp_get_archives( 'format=custom&before=<p id="test">&after=</p>&type=postbypost&limit=100' ); 
                /*Step #3

                Now instead of a unordered list using <li></li>, the code will now be <p></p> and you are ready to go to town on customizations.  Endless possibilities.*/?>
            </ul>
        </aside>

        <aside id="meta" class="widget">
            <h1 class="widget-title"><?php _e( 'Meta', 'sxo' ); ?></h1>
            <ul>
                <?php wp_register(); ?>
                <li><?php wp_loginout(); ?></li>
                <?php wp_meta(); ?>
            </ul>
        </aside>

    <?php endif; // end sidebar widget area ?>
</div><!-- #secondary .widget-area -->

<?php if ( is_active_sidebar( 'sidebar-2' ) ) : ?>

     <div id="tertiary" class="widget-area" role="supplementary">
      <?php dynamic_sidebar( 'sidebar-2' ); ?>
     </div><!-- #tertiary .widget-area -->

<?php endif; ?>

(UPDATED 3) - where (code extracted from my front-page.php template) i'm trying include aside.php:

<?php
/*
Template Name: Front-page - Portada de sxo
   @package WordPress
 * @subpackage sxo
*/

get_header('front-page'); ?>

<div id="contenido" class="wrapper clearfix">
<section id="list_posts_home">
            <div id="content" class="widecolumn">
                 <?php if (have_posts()) : while (have_posts()) : the_post();?>

                     <div class="listed_post_home">
                        <h2 id="post-<?php the_ID(); ?>"><a class="linkHomeBlog" href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
                        <div class="entrytext">
                            <div style="float:left;margin-right:1.5em;"><?php the_post_thumbnail(); ?></div>
                            <p><?php
                            the_excerpt('<a href="<?php the_permalink(); ?>">Read more</a></p>');?>
                            <?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
                        </div>
                     </div>
                <?php endwhile; 
                sxo_content_nav( 'nav-below' );
                endif; ?>
            </div>
<?php get_sidebar(); ?>

</section>

(UPDATED 4) sidebar.php template:

<?php
/**
 * The sidebar containing the main widget area.
 *
 * If no active widgets in sidebar, let's hide it completely.
 *
 * @package WordPress
 * @subpackage sxo
 * @since sxo
 */
?>

    <?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
        <div id="secondary" class="widget-area" role="complementary">
            <?php dynamic_sidebar( 'sidebar-1' ); ?>
        </div><!-- #secondary -->
    <?php endif; ?>

Thanks in advance!



Solution :

Following on from the comments in my other answer. Updating sidebar.php to the following should get you what you want. This is a combination of your aside and sidebar files as posted in the original question, with comments removed for clarity.

<?php
/**
* The Sidebar containing the main widget areas.
*
* @package sxo
* @since sxo 1.0
*/
?>
<div id="secondary" class="widget-area" role="complementary">

    <aside id="search" class="widget widget_search">
        <?php get_search_form(); ?>
    </aside>

    <aside id="archives" class="widget">
        <h1 class="widget-title"><?php _e( 'Archives', 'sxo' ); ?></h1>
        <ul class="archive-sidebar">   
            <?php wp_get_archives( array( 'type' => 'monthly') ); ?> 
        </ul>
    </aside>

    <aside id="meta" class="widget">
        <h1 class="widget-title"><?php _e( 'Meta', 'sxo' ); ?></h1>
        <ul>
            <?php wp_register(); ?>
            <li><?php wp_loginout(); ?></li>
            <?php wp_meta(); ?>
        </ul>
    </aside>

    <?php do_action( 'before_sidebar' ); ?>

    <?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
        <?php dynamic_sidebar( 'sidebar-1' ); ?>
    <?php endif; ?>

    <?php if ( is_active_sidebar( 'sidebar-2' ) ) : ?>
        <?php dynamic_sidebar( 'sidebar-2' ); ?>
    <?php endif; ?>
</div>

This first displays your 'static content', then sidebar-1 followed by sidebar-2.


    CSS Howto..

    How do I fill up the remainder of a div with another div?

    How do I add a border to an (8 point star) css shape?

    How do I minify CSS and Javascript? [duplicate]

    How to drag and drop a div changing the css left and top attributes in HTML 5?

    How to create and style dropdown menus using the wordpress menus section? [closed]

    How to style Repeater item background color ontap?

    How to animate 2 css layouts from left to right or from right to left with jquery?

    show different content in multiple css popups

    how to make the title bar fixed

    How to dynamically alter the CSS of a pseudo element with JQuery?

    How to set the minimum height of a
    box in Internet Explorer 8?

    how do i remove the tab from this css megamenu

    How do I vertically centering text inside a responsive box that has a (fluid height) [duplicate]

    How to display a side panel on the left and Google maps api canvas on the right, filling remainder of page?

    How to force text to wrap inside inline-block div?

    How can I redirect a request file to real folder with htaccess?

    How to get jQuery to recognize mouse over image once per hover

    Wordpress- How do i change the default font of navigation menu?

    How do I use CSS with simple form?

    How to put banner in css?

    How can I remove a parent with a certain child inside of it (media queries)

    how to set width,height etc to particular table in html

    IE10 has extra margin above an inline header. How do I remove it?

    CSS - How to get star aligned properly on this page

    How to construct multilevel menu using CSS only?

    How to fix content leaks out of an element despite use of “overflow:hidden”?

    How to get elements by class and provide css effects?

    How can I fix this jumbotron/carousel to be the size of the image?

    How can I put CSS and HTML code in the same file?

    Google Maps visual refresh - how do disable font Roboto in InfoWindow