Last active
August 29, 2015 14:14
-
-
Save srikat/0d1f9d2f4b8593dbe042 to your computer and use it in GitHub Desktop.
Displaying Posts output by Display Posts Shortcode in Masonry.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//* Enqueue Google Fonts and JS script | |
add_action( 'wp_enqueue_scripts', 'magazine_enqueue_scripts' ); | |
function magazine_enqueue_scripts() { | |
wp_enqueue_style( 'google-fonts', '//fonts.googleapis.com/css?family=Roboto:300,400,700|Raleway:400,500,700,900', array(), CHILD_THEME_VERSION ); | |
// wp_enqueue_script( 'magazine-entry-date', get_bloginfo( 'stylesheet_directory' ) . '/js/entry-date.js', array( 'jquery' ), '1.0.0' ); | |
wp_enqueue_script( 'magazine-responsive-menu', get_stylesheet_directory_uri() . '/js/responsive-menu.js', array( 'jquery' ), '1.0.0', true ); | |
//* Enqueue Masonry | |
wp_enqueue_script( 'masonry' ); | |
//* Initialize Masonry | |
wp_enqueue_script( 'masonry-init', get_stylesheet_directory_uri() . '/js/masonry-init.js', array( 'masonry' ), '1.0.0', true ); | |
} | |
//* Add new image size | |
add_image_size( 'masonry-thumb', 146, 0, true ); | |
add_filter( 'display_posts_shortcode_author', 'sk_remove_by_author' ); | |
/** | |
* Remove 'by' before author name in Display Posts Shortcode output | |
* | |
* @author Sridhar Katakam | |
* @link http://sridharkatakam.com/ | |
*/ | |
function sk_remove_by_author( $author ) { | |
$author = ' <span class="author">' . get_the_author() . '</span>'; | |
return $author; | |
} | |
add_filter( 'display_posts_shortcode_output', 'be_links_in_new_window', 20 ); | |
/** | |
* Add a target="_blank" to the anchor tag in posts output by Display Posts Shortcode | |
* | |
* @author Bill Erickson | |
* @link https://github.com/billerickson/display-posts-shortcode/wiki | |
*/ | |
function be_links_in_new_window( $output ) { | |
return str_replace( '<a ', '<a target="_blank" ', $output ); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
[display-posts posts_per_page="10" include_author="true" image_size="masonry-thumb" meta_key="_thumbnail_id" wrapper="div" tag="se-policies"] |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery( function( $ ){ | |
var $container = $('.display-posts-listing'); | |
// initialize Masonry after all images have loaded | |
$container.imagesLoaded( function() { | |
$container.masonry({ | |
itemSelector: '.listing-item', | |
gutter: 5 | |
}); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Masonry effect on Display Posts Shortcode | |
--------------------------------------------- */ | |
.listing-item { | |
border-radius: 0; | |
width: 19.4666666667%; /* 146px via http://cl.ly/image/3g2V100s3Q3d */ | |
overflow: hidden; | |
background: #ddd; | |
margin-bottom: 5px; | |
} | |
.listing-item a img { | |
vertical-align: top; | |
} | |
.listing-item a.title { | |
display: block; | |
padding: 10px; | |
color: #000; | |
line-height: 1.3; | |
font-weight: 700; | |
font-family: 'Raleway', sans-serif; | |
word-wrap: break-word; | |
} | |
.listing-item a.title:hover { | |
color: #f41d00; | |
} | |
.listing-item .author { | |
padding: 10px; | |
font-style: italic; | |
font-size: 15px; | |
line-height: 1.3; | |
display: inline-block; | |
font-family: 'Roboto', sans-serif; | |
} | |
@media only screen and (max-width: 1024px) { | |
.listing-item { | |
width: 24.375%; | |
} | |
} | |
@media only screen and (max-width: 768px) { | |
.listing-item { | |
width: 19.4366197183%; | |
} | |
} | |
@media only screen and (max-width: 568px) { | |
.listing-item { | |
width: 24.2661448141%; | |
} | |
} | |
@media only screen and (max-width: 480px) { | |
.listing-item { | |
width: 32.5617283951%; | |
} | |
} | |
@media only screen and (max-width: 320px) { | |
.listing-item { | |
width: 49.1319444444%; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment