Thread: [TUTORIAL] Grid Layout for Featured Ads in Home Page (Take out that Carosoule!)

Featured.php
style.css
Theme-functions.php

<?php
/**
 * The featured slider on the home page
 *
 */
?>

<?php if ( get_option('cp_enable_featured') == 'yes' ) : ?>
	<?php query_posts( array('post__in' => get_option('sticky_posts'), 'post_type' => APP_POST_TYPE, 'post_status' => 'publish', 'orderby' => 'rand') ); ?>
	<?php if ( have_posts() ) : ?>
		<!-- featured listings -->
		<div id="jcssFeaturedContainer">
			<div class="featured-block-out">
				<div class="featured-block">
					<h2 class="dotted"><?php _e('Featured Listings', 'appthemes')?></h2>
					<ul id="jcssFeaturedList">
					<?php while ( have_posts() ) : the_post(); ?>
						<li class="jcssFeaturedListItems">
							<div class="jcssFeaturedListItemContainer1">
								<div class="jcssFeaturedListItemContainer2">
									<?php if ( get_option('cp_ad_images') == 'yes' ) cp_ad_featured_thumbnail(); ?>
									<div class="clr"></div>
									<p><a href="<?php the_permalink() ?>"><?php if ( mb_strlen( get_the_title() ) >= get_option('cp_featured_trim') ) echo mb_substr( get_the_title(), 0, get_option('cp_featured_trim') ).'...'; else the_title(); ?></a></p>
								</div>
							</div>
						</li>
					<?php endwhile; ?>
					</ul>
					<div class="clr"></div>
				</div>
			</div>
		</div>
		<div class="clr"></div>
		<!-- featured listings -->
	<?php endif; ?>
	<?php wp_reset_query(); ?>
<?php endif; // end feature ad slider check ?>

/******* JCSS *******/
.featured-block-out {
    /*margin:0 0 8px 0;*/
    border:1px dotted #bbb;
    -khtml-border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

.featured-block {
   /* background: url("images/block_topbg.gif") repeat-x scroll center top #FFFFFF;*/
   background-color:#fff;
    margin:0;
    padding:13px;
    border:1px solid #fff;
    -khtml-border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

#jcssFeaturedContainer{
	margin-bottom:25px;
}
#jcssFeaturedList{
	
}
.jcssFeaturedListItems{
	float:right;
	width:217px;
	display:block;
	padding:5px;
	position:relative;

}
.jcssFeaturedListItemContainer1{
	border:1px solid #bbb;
	vertical-align:middle;
}
.jcssFeaturedListItemContainer2{
	padding:5px;
	/*min-height:100px;*/
	text-align:center;
	background:url(http://cdn.appthemes.com/forum/images/ribbon.png) -4px -5px no-repeat;
		min-height:110px;
		vertical-align:middle;
}

.content_res .jcssFeaturedListItemContainer2 .attachment-sidebar-thumbnail{
    float:none;
    border:0px;
    padding:0px;
    -khtml-border-radius:0px;
    -moz-border-radius:0px;
    -webkit-border-radius: 0px;
    border-radius:0px;
    -moz-box-shadow: 0px;
    -webkit-box-shadow: 0px;
    box-shadow: 0px;
	margin-bottom:5px;
}
.content_res .jcssFeaturedListItemContainer2 .attachment-75x75{
	margin-bottom:5px;
}

$adthumbarray = wp_get_attachment_image($image->ID, 'sidebar-thumbnail');

$adthumbarray = wp_get_attachment_image($image->ID, array(75,75));