[Plugin: Featured Page Widget] How to make selected pages display horizontally

Okay I’m kinda halfway there with this, but was unable to get the custom template to work. (even though I put the template in the specified folder, this plugin still used the standard.php template file..) So I had to modify the standard layout to make it happen.

I replaced the entire contents of the wp-content/plugins/featured-page-widget/templates/standard.php file with the following code:

<?php
if ( preg_match('#' . basename(__FILE__) . '#', $_SERVER['PHP_SELF']) ) {
     die('You are not allowed to call this page directly.');
}
/**
 * order-list.php - Displays entries as an ordered list with the excerpt as the title of the link.
 *
 * This can be copied to a folder named 'featured-page-widget' in your theme
 * to customize the output.
 *
 * @package Featured Page Widget
 * @subpackage templates
 * @author GrandSlambert
 * @copyright 2009-2011
 * @access public
 * @since 2.0
 */
?>

<ul id="featured-post-list">
     <?php if ( $featured->have_posts() ) : while ($featured->have_posts()) : $featured->the_post(); ?>

               <li id="featured-post-list" class="featured-post-widget">
     <?php if ( has_featured_post_image ( ) ) : ?>
          <div class="featured-post-image align<?php echo $instance['imagealign']; ?>">
               <?php the_featured_post_image(); ?>
          </div>
     <?php endif; ?>
	      <h3 id="featured_post_title_<?php the_id(); ?>" class="featured-post-title">
          <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
     </h3>
     <div id="featured_post_content_<?php the_id(); ?>" class="featured_post_content">
          <?php the_featured_post_content(); ?>
     </div>
     <p  id="featured_post_more_link_<?php the_id(); ?>" class="featured_post_more_link" style="text-align:<?php echo $instance['linkalign']; ?>;">
          <?php the_featured_post_read_more_link(); ?>
     </p>
               </li>
     <?php endwhile;
          endif; ?>
</ul>

I added the following declarations to the bottom of the stylesheet wp-content/plugins/featured-page-widget/templates/featured-page-widget.css.

ul#featured-post-list,
ul#featured-post-list li {
/* Setting a common base */
margin: 0;
padding: 0;
}

ul#featured-post-list li {
display: inline-block;
width: 32.9%;
min-height: 300px;
background: #ccc;
}

You may need to adjust the width and min-height settings in the stylesheet for your own layout, but with these settings I was able to get three pages appear in a horizontal layout.

You can see the result here: https://i53.tinypic.com/ei9wu8.png

Next up is to replace the “Read More” link with a button..

thanks for this!
this widget is very good and easy to use!
and I also think it’s pretty good if you can make it horizontally!
I saw you used it for post! but I want to use it for video.
I tried what you said but it turned out an error ” no header….” something like that.

Do you know how to fix it?

Nope.. I’ve moved on..

A much easier way is to create a ‘featured-page-widget’ folder in your theme (that way if you update the plugin you wont lose all your changes) copy the ‘featured-page-widget.css’ to that folder and comment out or delete the ‘clear: both;’ css command on line 13.