Skip to content

Instantly share code, notes, and snippets.

@srikat
Last active Aug 29, 2015
Embed
What would you like to do?
Custom Full Width Widgetized Page Template in Genesis using Column Classes, Equal Heights jQuery and RSS Widgets. https://sridharkatakam.com/custom-full-width-widgetized-page-in-genesis-using-column-classes-equal-heights-jquery-and-rss-widgets/
jQuery(function( $ ){
// equal heights
function equalHeights() {
var $col = $('.news-section > .wrap > div'),
maxHeight = [],
rows = [],
rowTop = 0,
rowIndex = 0;
$col.each(function() {
$el = $(this);
$el.css('height', '');
if ($el.offset().top > rowTop) {
rowIndex++;
rows[rowIndex] = [];
rowTop = $el.offset().top;
maxHeight[rowIndex] = 0;
}
if ($el.height() > maxHeight[rowIndex]) {
maxHeight[rowIndex] = $el.height();
}
rows[rowIndex].push($el);
});
for (row = 1; row <= rowIndex; row++) {
for (i = 0; i <= rows[row].length; i++) {
$(rows[row][i]).height(maxHeight[row]);
}
}
}
$(window).on('resize load', equalHeights);
});
genesis_register_sidebar( array(
'id' => 'news-ambition',
'name' => __( 'News Ambition', 'minimum' ),
'description' => __( 'This is the Ambition News widget area.', 'minimum' ),
) );
genesis_register_sidebar( array(
'id' => 'news-accountability',
'name' => __( 'News AccountAbility', 'minimum' ),
'description' => __( 'This is the AccountAbility News widget area.', 'minimum' ),
) );
genesis_register_sidebar( array(
'id' => 'news-watermark',
'name' => __( 'News Watermark', 'minimum' ),
'description' => __( 'This is the Watermark News widget area.', 'minimum' ),
) );
wp_enqueue_script( 'equal-heights', get_stylesheet_directory_uri() . '/js/equal-heights.js', array( 'jquery' ), '', true );
.news-section .wrap .one-third {
position: relative;
}
.news-section .wrap .one-third img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
<?php
add_filter( 'genesis_attr_site-inner', 'sk_attributes_site_inner' );
/**
* Add attributes for site-inner element.
*
* @since 2.0.0
*
* @param array $attributes Existing attributes.
*
* @return array Amended attributes.
*/
function sk_attributes_site_inner( $attributes ) {
$attributes['role'] = 'main';
$attributes['itemprop'] = 'mainContentOfPage';
return $attributes;
}
// Remove div.site-inner's div.wrap
add_filter( 'genesis_structural_wrap-site-inner', '__return_empty_string' );
get_header();
// Display featured image above content
if ( has_post_thumbnail() ) {
echo '<div class="page-thumbnail">';
genesis_image( array( 'size' => 'page-thumbnail' ) );
echo '</div>';
}
// Content
// Ambition News Section
echo '<section class="news-section clearfix" id="ambition-section"><div class="wrap">';
echo '<div class="one-third first"><img src="http://ambition.wpengine.com/wp-content/uploads/2015/04/ambition-logo.png" /></div>';
echo '<div class="two-thirds">';
genesis_widget_area( 'news-ambition', array(
'before' => '<div class="news-ambition widget-area">',
'after' => '</div>',
) );
echo '</div>';
echo '</div></section>';
// AccountAbility News Section
echo '<section class="news-section clearfix" id="accountability-section"><div class="wrap">';
echo '<div class="one-third first"><img src="http://ambition.wpengine.com/wp-content/uploads/2015/04/accountability-logo.png" /></div>';
echo '<div class="two-thirds">';
genesis_widget_area( 'news-accountability', array(
'before' => '<div class="news-accountability widget-area">',
'after' => '</div>',
) );
echo '</div>';
echo '</div></section>';
// Watermark News Section
echo '<section class="news-section clearfix" id="watermark-section"><div class="wrap">';
echo '<div class="one-third first"><img src="http://ambition.wpengine.com/wp-content/uploads/2015/04/watermark-logo.png" /></div>';
echo '<div class="two-thirds">';
genesis_widget_area( 'news-watermark', array(
'before' => '<div class="news-watermark widget-area">',
'after' => '</div>',
) );
echo '</div>';
echo '</div></section>';
get_footer();
/* News */
#ambition-section {
padding-top: 0;
padding-bottom: 40px;
}
#accountability-section {
background: #f2f2f2;
padding-top: 80px;
padding-bottom: 40px;
}
#watermark-section {
padding-top: 80px;
padding-bottom: 80px;
}
.widget_rss .widget-title {
display: none;
}
.widget_rss ul {
margin-left: 0;
}
.widget_rss ul > li:before {
content: none;
}
.widget_rss ul > li {
float: left;
width: 45.0066577896%;
margin-left: 9.9866844208%;
margin-bottom: 45px;
}
.widget_rss ul > li:nth-of-type(2n+1) {
margin-left: 0;
clear: left;
}
a.rsswidget {
font-family: 'Arvo', serif;
font-size: 24px;
line-height: 1;
}
.rss-date {
display: block;
margin-top: 4px;
color: #b9b9b9;
margin-bottom: 15px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment