Responsive WordPress images using SRCSET and ACF
Make sure your image field is set to an array in ACF and then use the below.
‘150px’ is the maximum width your image will ever display.
Custom query on taxonomy page | WordPress
This will go in taxnonomy.php or taxonomy-name.php templates.
$term = get_term_by( 'slug', get_query_var('term'), get_query_var('taxonomy') );
$customField = get_field('custom_field_name')];
$args = array(
'posts_per_page' => '-1',
'post_type' => 'service_centres',
'tax_query' => array (
array (
'taxonomy' => 'regions',
'field' => 'slug',
'terms' => $term->slug
)
),
'meta_key' => 'custom_field_name',
'meta_value' => 'custom_field_value_value'
);Grab first image from post
Function for grabbing image from post and using it instead of a featured image for example.
Add this to functions.php
// Get URL of first image in a post
function catch_that_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$matches[1][0] = '';
if(preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches)){
$first_img = $matches[1][0];
}
// no image found display default image instead
return $first_img;
}And call in the theme with
<img src="<?php echo catch_that_image() ?>" onerror="this.style.display = 'none';"/> Query posts by current post category
Great for showing ‘related posts’ by current post category. The current post has an ID, the query grabs that ID, checks with categories are associated with that post, creates an array and passes these through to the query, also excluding this current post from the loop.
Output is posts from the same category/categories as the current post (active page).
<?php
$args = array(
'posts_per_page' => 3,
'post__not_in' => array( get_the_ID() ),
'no_found_rows' => true, //Np pagination needed so query is quicker
'post__not_in' => array($post->ID) //Excludes current post
);
$cats = wp_get_post_terms( get_the_ID(), 'category' );
$cats_ids = array();
foreach( $cats as $wpex_related_cat ) {
$cats_ids[] = $wpex_related_cat->term_id;
}
if ( ! empty( $cats_ids ) ) {
$args['category__in'] = $cats_ids;
}
$wpex_query = new wp_query( $args );
foreach( $wpex_query->posts as $post ) : setup_postdata( $post ); ?>
//CONTENT HERE i.e. post data and title
<?php endforeach; wp_reset_postdata();?>Preparing for Gutenberg
If you want to pre-disable Gutenberg for when it launches, install the following plugin, activate and untick the checkbox in the settings: https://wordpress.org/plugins/classic-editor/
If you also want to avoid the 5.0 update, you can always hide the update banner:
//Add to functions.php file to remove WordPress update notice
function hide_update_notice() {
remove_action( 'admin_notices', 'update_nag', 3 );
}
add_action( 'admin_notices', 'hide_update_notice', 1 );Limit WordPress Revisions
Add this to you wp-config.php file and change the number for how many revisions you want to limit your pages to:
define('WP_POST_REVISIONS', 10);Or use the below to globally turn off post revisions:
define('WP_POST_REVISIONS', false);Default comments SCSS | WordPress
/* =========================================================
Comments
========================================================= */
.comments-area {
padding: 20px 40px;
textarea#comment {
width: 100%;
}
#submit {
@extend .button;
}
ol.commentlist {
list-style:none;
margin:0 0 1em;
padding:0;
text-indent:0;
li {}
li.alt {}
li.bypostauthor {}
li.byuser {}
li.comment-author-admin {}
.comment-body {
border-bottom: 1px solid #ddd;
padding:1em;
.comment-author {} // end .comment-author
div.vcard {
font-weight: 14px;
cite.fn {
a.url {}
} // end cite.fn
img.avatar {
border:5px solid #ccc;
float:right;
margin:0 0 20px 20px;
} // end .avatar
img.avatar-32 {} // end .avatar-32
img.photo {} // end .photo
span.says {} // ebd .says
} // end .vcard
div.commentmetadata {} // end .commentmetadata
div.comment-meta {
font-size: 11px;
a {
color: #ccc;
} // end a
} // end div.comment-meta
p {font-size: 12px;} // end p
ul {
font-size: 12px;
list-style: none;
margin: 0 0 0 20px;
} // end ul
div.reply {
font-size: 11px;
a {font-weight: bold;} // end a
} // end reply
ul.children {
list-style:none;
margin: 12px;
text-indent:0;
li {} // end li
li.alt {}
li.bypostauthor {}
li.byuser {}
li.comment {}
li.comment-author-admin {}
li.depth-2 { border-left: 5px solid #ccc; margin:0 0 10px 10px; }
li.depth-3 { border-left: 5px solid #bbb; margin:0 0 10px 10px; }
li.depth-4 { border-left: 5px solid #aaa; margin:0 0 10px 10px; }
li.depth-5 {} // you get the idea
li.odd {} // end .odd
} // end ul.children
} // end li.comment
li.even {background:#fff;}
li.odd {background:#f6f6f6;}
li.parent {border-left:5px solid #ddd;}
li.thread-alt {}
li.thread-even {}
li.thread-odd {}
} // end commentlist
}Get author Twitter handle | WordPress
$twitterHandle = get_the_author_meta('twitter');
echo $twitterHandleCustom fields in custom taxonomy archive page | WordPress
$queried_object = get_queried_object();
$taxonomy = $queried_object->taxonomy;
$term_id = $queried_object->term_id;the_field('custom_field_name', $queried_object);jQuery in the footer
Add this to your functions.php
function my_init()
{
if (!is_admin())
{
wp_deregister_script('jquery');
// Load a copy of jQuery from the Google API CDN
// The last parameter set to TRUE states that it should be loaded
// in the footer.
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js', FALSE, '1.11.0', TRUE);
wp_enqueue_script('jquery');
}
}
add_action('init', 'my_init');