|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
function jma_thumbnail_link_icon_name($class) { return str_replace(array('film'), array('youtube'), $class); } add_filter('themeblvd_thumbnail_link_icon_name', 'jma_thumbnail_link_icon_name'); //framework/general/media.php //to change all three for left to right.... I think... function jma_thumbnail_link_icon_name($class) { return str_replace(array('film', 'plus-square', 'long-arrow-alt-right'), array('youtube', 'if-you-wanted-to-replace-the-plus-sq-also', 'and-this-one-too'), $class); } add_filter('themeblvd_thumbnail_link_icon_name', 'jma_thumbnail_link_icon_name'); |
Check for Children
Want to be able to use one condition which includes or excludes pages based on weather they are children of a specific page? Add this code to functions.php:
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
function is_kid( $pid,$includeparent = 0 ) { // $pid = The ID of the page we're looking for pages underneath //$includeparent = 1 to include the parent page, 0 to exclude global $post; // load details about this page if ( is_page($pid) ) return $includeparent; // we're at the page $anc = get_post_ancestors( $post->ID ); foreach ( $anc as $ancestor ) { if( is_page() && $ancestor == $pid ) { return true; } } return false; // we aren't at the page, and the page is not an ancestor } |
then use this in your page template:
|
0 1 2 3 4 5 |
if (is_kid($page_id,1)) //1 to include the parent page, 0 to exclude { code here } |
Clearfix
In the event we are dealing with some situation where it is not convenient to add the clearfix class (which is available frequently including in JumpStart), we can add the styling to the div that needs clearfix. So if we had markup like:
|
0 1 2 3 4 5 6 7 8 9 |
<div class="wrapping-div-that-i-cant-change"> <div style="float: left; width: 45%"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie co </div> <div style="float: right; width: 45%"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut </div> </div><!--wrapping-div-that-i-cant-change--> |
we could add this css to clear:
|
0 1 2 3 4 5 6 7 8 9 |
.wrapping-div-that-i-cant-change:before, .wrapping-div-that-i-cant-change:after { content: " "; display: table; } .wrapping-div-that-i-cant-change:after { clear: both; } |
Complex Query Over-rides
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 |
function jma_spout_args( $query, $args ) { if ( isset( $args['query'] ) && $args['query'] == 'spouts' ) { $query = array( 'post_type' => 'product', 'post__in' => array( 126,128 ) ); } return $query; } add_filter('themeblvd_posts_args', 'jma_spout_args', 10, 2); |
CSS Columns
Need to style code into columns. This is for simple auto-generated paragraph in a post or page.
|
0 1 2 3 4 5 6 7 8 9 10 |
.postid-1121 .entry-content > p { width: 48%; margin-left: 4%; float: left; } .postid-1121 .entry-content > p:nth-of-type(2n+1) { clear: both; margin-left: 0; } |
or for three col:
|
0 1 2 3 4 5 6 7 8 9 10 |
.postid-1121 .entry-content > p { width: 30%; margin-left: 5%; float: left; } .postid-1121 .entry-content > p:nth-of-type(3n+1) { clear: both; margin-left: 0; } |
or four:
|
0 1 2 3 4 5 6 7 8 9 10 |
.postid-1121 .entry-content > p { width: 22%; margin-left: 4%; float: left; } .postid-1121 .entry-content > p:nth-of-type(4n+1) { clear: both; margin-left: 0; } |
CSS3 Drop Shadows
This is simple stuff, but good code to keep handy. This covers all current major browsers and add backward compatibility for ie. The first number is horizontal shift (right is positive), 2nd number is verticle shift (down is positive), 3rd is radial blur and forth is, in this case hexadecimal color (#3d424d is a dark […]
Read MoreCustom Bullet Icons for Lists
I prefer this method because it gives me more control over bullet position.
|
0 1 2 3 4 5 6 7 |
<ul class="pdf-list"> <li><a href="http://address.pdf">Title</a></li> <li><a href="http://address.pdf">Title</a></li> <li><a href="http://address.pdf">Title</a></li> <li><a href="http://address.pdf">Title</a></li> </ul> |
and the css (adjust padding based on the size of the image):
|
0 1 2 3 4 5 6 |
ul.pdf-list li { background: url('../images/pdf-icon.png') no-repeat left center; padding: 3px 0px 3px 30px; list-style: none; } |
In this case I used this image (your url path in line 2 above will depend on your site structure): or use bootstrap: http://fortawesome.github.io/Font-Awesome/icons/
|
0 1 2 3 4 5 6 7 |
<ul class="fa-ul"> <li><i class="fa-li fa fa-check-square"></i>List icons</li> <li><i class="fa-li fa fa-file-pdf-o"></i>can be used</li> <li><i class="fa-li fa fa-spinner fa-spin"></i>as bullets</li> <li><i class="fa-li fa fa-square"></i>in lists</li> </ul> |
Custom Grid with Pagination
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
function pract_grid() { $args = array( 'post_type'=> 'practitioner', 'meta_key' => 'last_name', 'orderby' => array( 'menu_order' => 'DESC', 'meta_value' => 'ASC' ), 'posts_per_page' => 15 ); if ( get_query_var('paged') ) { $args['paged'] = get_query_var('paged'); } else if ( get_query_var('page') ) { $args['paged'] = get_query_var('page'); } else { $args['paged'] = 1; } $x = new WP_Query($args); if( $x->have_posts() ) { echo '<div class="jma-custom-grid">'; while ( $x->have_posts() ) { $x->the_post(); get_template_part( 'content', 'pract_result' ); } echo '</div>'; themeblvd_pagination( $x->max_num_pages ); }else{ echo 'no results'; } wp_reset_postdata(); } add_action('your_favorite_hook', 'pract_grid'); |
Detect Shortcode
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
if(!function_exists('jma_yt_detect_shortcode')){ function jma_yt_detect_shortcode( $needle = '', $post_item = 0 ){ if($post_item){ if(is_object($post_item)) $post = $post_item; else $post = get_post($post_item); }else{ global $post; } if(is_array($needle)) $pattern = get_shortcode_regex($needle); elseif(is_string($needle)) $pattern = get_shortcode_regex(array($needle)); else $pattern = get_shortcode_regex(); preg_match_all( '/'. $pattern .'/s', $post->post_content, $matches ); if(//if shortcode(s) to be searched for were passed and not found $return false array_key_exists( 2, $matches ) && count( $matches[2] ) ){ $return = $matches; }else{ $return = false; } return $return; } } |
Display List of Related Pages from Hierarchy in Sidebar
Linked pages related to the current page. If is root page shows itself as title with all children below. Else shows immediate parent as title with all pages at its level below (depth can be changed, with -1 showing all without hierarchy).
|
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
function jma_sidebar_addon() { global $post; if($post->post_parent) { $children = wp_list_pages('title_li=&child_of='.$post->post_parent.'&echo=0&depth=1'); }else{ $children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0&depth=1'); } ?> <?php if ($children) { ?> <div class="maincontent"> <h3>More <?php echo get_the_title($post->post_parent);?></h3> <ul class="blog-list"> <?php echo $children;?> </ul> </div><?php } } add_action('themeblvd_sidebar_sidebar_right_before', 'jma_sidebar_addon'); |