Tuesday, June 26th, 2018
Add the following in your mixins .scss file:
// RESPONSIVE FONTS @include fluid-type(1.3rem, 1.7rem);
@mixin fluid-type($min-font-size: 1.3rem, $max-font-size: 2.2rem, $lower-range: 540px, $upper-range: 960px) {
font-size: calc(#{$min-font-size} + #{(($max-font-size / ($max-font-size * 0 + 1)) - ($min-font-size / ($min-font-size * 0 + 1)))} * ( (100vw - #{$lower-range}) / #{(($upper-range / ($upper-range * 0 + 1)) - ($lower-range / ($lower-range * 0 + 1)))}));
@media screen and (max-width: $lower-range) {
font-size: $min-font-size;
}
@media screen and (min-width: $upper-range){
font-size: $max-font-size;
}
}Then call that mixin within your theme .scss files with:
.div {
@include fluid-type(1rem, 3rem);
font-weight: 300;
}Finally, make sure you set your html tag to have a set font-size as a percentage e.g. 62.5%…
html {
font-size: 62.5%;
}Tags: CSS, Fluid type, mixin, SASS, SCSS
Posted in CSS | No Comments »
Tuesday, June 26th, 2018
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.
Click the link to view the code
Tags: ACF, Functions, Responsive images, SRCSET, WordPress
Posted in PHP, WordPress | No Comments »
Thursday, June 14th, 2018
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'
);Tags: PHP, Query, Taxonomy, Term, Terms, WordPress
Posted in PHP, WordPress | No Comments »