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

2 Views

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...>

Read More

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!

Post Views: 2

Related posts

2 comments

  1. 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.

  2. The register sidebar function that you are using builds the html that surrounds a widget, not the actual code within a widget. However, your code indicates that you’re outputting the links directly in a php file, not via a widget. With this in mind there are two potential solutions.

    Option 1

    You could add a class to the ul in the aside.php file and target that from your stylesheet (if this is needed).

    aside.php

    <ul class="archive-sidebar">
    <?php wp_get_archives( array( 'type' => 'monthly') ); ?>
</ul>

    style.css

    archive-sidebar a {
    // Some funky styles
}

    Option 2

    If the above is not what your after, you could add a filter to the wp call. This code is untested, but should at least point you in the right direction. Add the following to your functions.php file.

    functions.php

    function get_archives_link_mod ( $link_html ) {
    return str_replace("<a", '<a class="archive_link"', $link_html);
}
add_filter("get_archives_link", "get_archives_link_mod");

    With both options you will be able to target the link from your javascript file if you so wish. If you’re using jQuery you can achieve this with…

    $('.archive-link a')

    or

    $('.archive-link')

    depending on which option you go with.

Comments are closed.