Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have been struggling with this for a few hours now...

I want to add a link to my recent posts widget title.

I have tried a number of options given in forums but nothing seems to work.

Tried adding link tags around and in between echo $before_title . $title . $after_title; but must be going wrong somewhere.

Please can you have a look at the widget code and let me know if adding a link to widget title is possible?

<?php
/**
 * Widget Name: Recent Posts with Excerpts Widget
 * Description: A widget that allows to display a recent posts with excerpts and date and author info (optional).
 * Version: 0.1
 *
 */

/**
 * Add function to widgets_init that'll load our widget.
 * @since 0.1
 */
add_action( 'widgets_init', 'latest_posts_load_widgets' );

/**
 * Register our widget.
 * 'Latest_Posts_Widget' is the widget class used below.
 *
 * @since 0.1
 */
function latest_posts_load_widgets() {
    register_widget( 'Latest_Posts_Widget' );
}

/**
 * Custom Category Widget class.
 * This class handles everything that needs to be handled with the widget:
 * the settings, form, display, and update.  Nice!
 *
 * @since 0.1
 */
class Latest_Posts_Widget extends WP_Widget {

    /**
     * Widget setup.
     */
    function Latest_Posts_Widget() {
        /* Widget settings. */
        $widget_ops = array( 'classname' => 'widget-latest-posts', 'description' => esc_html__('The most recent posts with teaser text', 'purevision') );

        /* Widget control settings. */
        $control_ops = array( 'width' => 150, 'height' => 350, 'id_base' => 'latest-posts-widget' );

        /* Create the widget. */
        $this->WP_Widget( 'latest-posts-widget', esc_html__('Digi - Recent Posts', 'purevision'), $widget_ops, $control_ops );
}

/**
 * How to display the widget on the screen.
 */
function widget( $args, $instance ) {
    extract( $args );

    /* Our variables from the widget settings. */
    $title = apply_filters('widget_title', $instance['title'] );
    $category_id = $instance['category_id'];
    $num_posts = absint( $instance['num_posts'] );
    $post_offset =  absint( $instance['post_offset'] );

    /* Before widget (defined by themes). */
    echo $before_widget;

    /* Display the widget title if one was input (before and after defined by themes). */

    if ( $title ) echo $before_title . $title . $after_title;

    /* Display the Latest Posts accordinly... */
    echo '<div id="widget-latest-posts">';
    $cats_to_include = ( $category_id ) ? "cat={$category_id}&": '';
    $num_posts_query = new WP_Query( "{$cats_to_include}showposts={$num_posts}&offset={$post_offset}" );
    if( $num_posts_query->have_posts()) : ?>
        <div class="latest_posts">
        <ul>
                    <?php while( $num_posts_query->have_posts()) : $num_posts_query->the_post(); update_post_caches($posts); ?>
    <?php
    $thumb = get_post_thumbnail_id(); 
    $postimage = vt_resize($thumb, '', 58, 58, true );
    ?>
            <li>
            <div class="pop-wrap">

            <h3><a title="<?php the_title(); ?>" href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>

            </div>
            </li>
    <?php endwhile; ?>
        </ul>
        </div><!-- end widget_recent_posts -->
    <?php endif;
    echo '</div><!-- end widget-latest-posts -->';

    /* After widget (defined by themes). */
    echo $after_widget;
}

/**
 * Update the widget settings.
 */
function update( $new_instance, $old_instance ) {
    $instance = $old_instance;

    /* Strip tags for title and name to remove HTML (important for text inputs). */
    $instance['title'] = $new_instance['title'];
    $instance['num_posts'] = strip_tags( $new_instance['num_posts'] );
    $instance['post_offset'] = strip_tags( $new_instance['post_offset'] );
    /* No need to strip tags for dropdowns and checkboxes. */
    $instance['category_id'] = $new_instance['category_id'];

    return $instance;
}

/**
 * Displays the widget settings controls on the widget panel.
 * Make use of the get_field_id() and get_field_name() function
 * when creating your form elements. This handles the confusing stuff.
 */
function form( $instance ) {

    /* Set up some default widget settings. */
    $defaults = array( 'title' => esc_html__('Latest Posts', 'purevision'), 'category_id' => '', 'num_posts' => 3, 'post_offset' => 0);
    $instance = wp_parse_args( (array) $instance, $defaults ); ?>

    <!-- Widget Title: Text Input -->
    <p>
        <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php esc_html_e('Title:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'title' ); ?>" type="text" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" class="widefat" />
    </p>

    <!-- Show Categories -->
    <p>
        <label for="<?php echo $this->get_field_id( 'category_id' ); ?>"><?php esc_html_e('Pick a specific category:', 'purevision'); ?></label>
        <?php wp_dropdown_categories('show_option_all=All&hierarchical=1&orderby=name&selected='.$instance['category_id'].'&name='.$this->get_field_name( 'category_id' ).'&class=widefat'); ?>
    </p>

    <!-- Number of Posts -->
    <p>
        <label for="<?php echo $this->get_field_id( 'num_posts' ); ?>"><?php esc_html_e('Number of posts to show:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'num_posts' ); ?>" type="text" name="<?php echo $this->get_field_name( 'num_posts' ); ?>" value="<?php echo $instance['num_posts']; ?>" size="2" maxlength="2" />
        <br />
        <small><?php esc_html_e('(at most 15)', 'purevision'); ?></small>
    </p>

    <!-- Post Offset -->
    <p>
        <label for="<?php echo $this->get_field_id( 'post_offset' ); ?>"><?php esc_html_e('Number of posts to skip:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'post_offset' ); ?>" type="text" name="<?php echo $this->get_field_name( 'post_offset' ); ?>" value="<?php echo $instance['post_offset']; ?>" size="2" maxlength="2" />
        <br />
        <small><?php esc_html_e('(offset from latest)', 'purevision'); ?></small>
    </p>

share|improve this question

1 Answer 1

I've updated your widget code to include a new field called "Title Link". This, along with some additional markup, will create a link around your widget title. You'll probably need to add better validation to the Title Link field.

<?php
/**
 * Widget Name: Recent Posts with Excerpts Widget
 * Description: A widget that allows to display a recent posts with excerpts and date and author info (optional).
 * Version: 0.1
 *
 */

/**
 * Add function to widgets_init that'll load our widget.
 * @since 0.1
 */
add_action( 'widgets_init', 'latest_posts_load_widgets' );

/**
 * Register our widget.
 * 'Latest_Posts_Widget' is the widget class used below.
 *
 * @since 0.1
 */
function latest_posts_load_widgets() {
    register_widget( 'Latest_Posts_Widget' );
}

/**
 * Custom Category Widget class.
 * This class handles everything that needs to be handled with the widget:
 * the settings, form, display, and update.  Nice!
 *
 * @since 0.1
 */
class Latest_Posts_Widget extends WP_Widget {

    /**
     * Widget setup.
     */
    function Latest_Posts_Widget() {
        /* Widget settings. */
        $widget_ops = array( 'classname' => 'widget-latest-posts', 'description' => esc_html__('The most recent posts with teaser text', 'purevision') );

        /* Widget control settings. */
        $control_ops = array( 'width' => 150, 'height' => 350, 'id_base' => 'latest-posts-widget' );

        /* Create the widget. */
        $this->WP_Widget( 'latest-posts-widget', esc_html__('Digi - Recent Posts', 'purevision'), $widget_ops, $control_ops );
}

/**
 * How to display the widget on the screen.
 */
function widget( $args, $instance ) {
    extract( $args );

    /* Our variables from the widget settings. */
    $title = apply_filters('widget_title', $instance['title'] );
    $titlelink = $instance['titlelink'];
    $category_id = $instance['category_id'];
    $num_posts = absint( $instance['num_posts'] );
    $post_offset =  absint( $instance['post_offset'] );

    /* Before widget (defined by themes). */
    echo $before_widget;

    /* Display the widget title if one was input (before and after defined by themes). */

    if ( $title ) {
          echo $before_title;
          if ( $titlelink ) { 
                echo '<a href="' . $titlelink . '">';
          }
          echo $title;
          if ( $titlelink ) {
                echo '</a>';
          }
          echo $after_title;
    }

    /* Display the Latest Posts accordinly... */
    echo '<div id="widget-latest-posts">';
    $cats_to_include = ( $category_id ) ? "cat={$category_id}&": '';
    $num_posts_query = new WP_Query( "{$cats_to_include}showposts={$num_posts}&offset={$post_offset}" );
    if( $num_posts_query->have_posts()) : ?>
        <div class="latest_posts">
        <ul>
                    <?php while( $num_posts_query->have_posts()) : $num_posts_query->the_post(); update_post_caches($posts); ?>
    <?php
    $thumb = get_post_thumbnail_id(); 
    $postimage = vt_resize($thumb, '', 58, 58, true );
    ?>
            <li>
            <div class="pop-wrap">

            <h3><a title="<?php the_title(); ?>" href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>

            </div>
            </li>
    <?php endwhile; ?>
        </ul>
        </div><!-- end widget_recent_posts -->
    <?php endif;
    echo '</div><!-- end widget-latest-posts -->';

    /* After widget (defined by themes). */
    echo $after_widget;
}

/**
 * Update the widget settings.
 */
function update( $new_instance, $old_instance ) {
    $instance = $old_instance;

    /* Strip tags for title and name to remove HTML (important for text inputs). */
    $instance['title'] = $new_instance['title'];
    $instance['titlelink'] = $new_instance['titlelink'];
    $instance['num_posts'] = strip_tags( $new_instance['num_posts'] );
    $instance['post_offset'] = strip_tags( $new_instance['post_offset'] );
    /* No need to strip tags for dropdowns and checkboxes. */
    $instance['category_id'] = $new_instance['category_id'];

    return $instance;
}

/**
 * Displays the widget settings controls on the widget panel.
 * Make use of the get_field_id() and get_field_name() function
 * when creating your form elements. This handles the confusing stuff.
 */
function form( $instance ) {

    /* Set up some default widget settings. */
    $defaults = array( 'title' => esc_html__('Latest Posts', 'purevision'), 'category_id' => '', 'num_posts' => 3, 'post_offset' => 0);
    $instance = wp_parse_args( (array) $instance, $defaults ); ?>

    <!-- Widget Title: Text Input -->
    <p>
        <label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php esc_html_e('Title:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'title' ); ?>" type="text" name="<?php echo $this->get_field_name( 'title' ); ?>" value="<?php echo $instance['title']; ?>" class="widefat" />
    </p>

     <!-- Widget Title Link: Text Input -->
    <p>
        <label for="<?php echo $this->get_field_id( 'titlelink ); ?>"><?php esc_html_e('Title Link:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'titlelink' ); ?>" type="text" name="<?php echo $this->get_field_name( 'titlelink' ); ?>" value="<?php echo $instance['titlelink']; ?>" class="widefat" />
    </p>

    <!-- Show Categories -->
    <p>
        <label for="<?php echo $this->get_field_id( 'category_id' ); ?>"><?php esc_html_e('Pick a specific category:', 'purevision'); ?></label>
        <?php wp_dropdown_categories('show_option_all=All&hierarchical=1&orderby=name&selected='.$instance['category_id'].'&name='.$this->get_field_name( 'category_id' ).'&class=widefat'); ?>
    </p>

    <!-- Number of Posts -->
    <p>
        <label for="<?php echo $this->get_field_id( 'num_posts' ); ?>"><?php esc_html_e('Number of posts to show:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'num_posts' ); ?>" type="text" name="<?php echo $this->get_field_name( 'num_posts' ); ?>" value="<?php echo $instance['num_posts']; ?>" size="2" maxlength="2" />
        <br />
        <small><?php esc_html_e('(at most 15)', 'purevision'); ?></small>
    </p>

    <!-- Post Offset -->
    <p>
        <label for="<?php echo $this->get_field_id( 'post_offset' ); ?>"><?php esc_html_e('Number of posts to skip:', 'purevision'); ?></label>
        <input id="<?php echo $this->get_field_id( 'post_offset' ); ?>" type="text" name="<?php echo $this->get_field_name( 'post_offset' ); ?>" value="<?php echo $instance['post_offset']; ?>" size="2" maxlength="2" />
        <br />
        <small><?php esc_html_e('(offset from latest)', 'purevision'); ?></small>
    </p>

You'll have to add additional styling since you're using a link in your header tags now:

  .widget h3 a {
        // Same colour and style as h3 //
  }
share|improve this answer
    
Thanks Dave, huge progress, but how do I now make it look the same as all other widgets in the footer, title heading style and spacing I mean. It looks like the H3 style is not applied to the title. –  Kat Sep 26 '12 at 15:41
    
You'll probably need to add additional styling now that it is a link, I've updated my answer with a CSS example –  Dave Hunt Sep 26 '12 at 15:50
    
It worked wonders. Thank you very much for your help. –  Kat Sep 27 '12 at 8:37
    
You're welcome! Would you be able to mark my answer as correct? Much appreciated! –  Dave Hunt Oct 12 '12 at 17:30

protected by Community Sep 30 at 10:02

Thank you for your interest in this question. Because it has attracted low-quality answers, posting an answer now requires 10 reputation on this site.

Would you like to answer one of these unanswered questions instead?

Not the answer you're looking for? Browse other questions tagged or ask your own question.