The code snippets below should be pasted into your child theme's functions.php file.
Here is the code to display your posts in a responsive grid.
// Display posts in a responsive grid.
add_action( 'wp', 'example_posts_grid' );
function example_posts_grid() {
// Only apply to non singular view.
if ( !is_singular() ) {
// Add grid.
beans_wrap_inner_markup( 'beans_content', 'beans_child_posts_grid', 'div', array(
'class' => 'uk-grid uk-grid-match',
'data-uk-grid-margin' => ''
) );
beans_wrap_markup( 'beans_post', 'beans_child_post_grid_column', 'div', array(
'class' => 'uk-width-large-1-3 uk-width-medium-1-2'
) );
// Move the posts pagination after the new grid markup.
beans_modify_action_hook( 'beans_posts_pagination', 'beans_child_posts_grid_after_markup' );
}
}
If you would like to apply different grid options, read the UIkit grid documentation. Everthing available in UIkit can be used in Beans.