Skip to content

Instantly share code, notes, and snippets.

@About2git
Forked from srikat/functions.php
Created February 13, 2015 21:28
Show Gist options
  • Select an option

  • Save About2git/307392bc3926e50b17a2 to your computer and use it in GitHub Desktop.

Select an option

Save About2git/307392bc3926e50b17a2 to your computer and use it in GitHub Desktop.
How to show high resolution logo on retina displays in Genesis using Foundation Interchange.
<?php
//* Do NOT include the opening php tag
//* Enqueue Foundation Interchnage
add_action( 'wp_enqueue_scripts', 'sk_foundation_interchange' );
/**
* Load Foundation and Foundation Interchange in the Footer.
* Initialize Foundation in the Footer.
*
* @author Sridhar Katakam
* @link http://sridharkatakam.com/show-high-resolution-logo-retina-displays-genesis-using-foundation-interchange/
*/
function sk_foundation_interchange() {
wp_enqueue_script( 'foundation', get_bloginfo( 'stylesheet_directory' ) . '/js/foundation.js', array( 'jquery' ), '', true );
wp_enqueue_script( 'foundation-interchange', get_bloginfo( 'stylesheet_directory' ) . '/js/foundation.interchange.js', array( 'foundation' ), '', true );
wp_enqueue_script( 'global', get_stylesheet_directory_uri() . '/js/global.js', array( 'jquery' ), '', true );
}
$logo = '<img src="' . get_stylesheet_directory_uri() . '/images/logo.png" alt="' . esc_attr( get_bloginfo( 'name' ) ) . '">';
$logo = '<img data-interchange="[' . get_stylesheet_directory_uri() . '/images/logo.png, (default)], [' . get_stylesheet_directory_uri() . '/images/logo@2x.png, (retina)]" alt="' . esc_attr( get_bloginfo( 'name' ) ) . '">';
jQuery(document).ready(function($) {
// Initialize Foundation
$(document).foundation();
});
/* Foundation Interchange */
meta.foundation-version {
font-family: "/5.4.7/";
}
meta.foundation-mq-small {
font-family: "/only screen/";
width: 0em;
}
meta.foundation-mq-medium {
font-family: "/only screen and (min-width:40.063em)/";
width: 40.063em;
}
meta.foundation-mq-large {
font-family: "/only screen and (min-width:64.063em)/";
width: 64.063em;
}
meta.foundation-mq-xlarge {
font-family: "/only screen and (min-width:90.063em)/";
width: 90.063em;
}
meta.foundation-mq-xxlarge {
font-family: "/only screen and (min-width:120.063em)/";
width: 120.063em;
}
meta.foundation-data-attribute-namespace {
font-family: false;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment