Skip to content

Instantly share code, notes, and snippets.

View chrisblakley's full-sized avatar
⚔️
Take that, entropy!

Chris Blakley chrisblakley

⚔️
Take that, entropy!
View GitHub Profile
@chrisblakley
chrisblakley / front-end.html
Created October 16, 2014 12:36
Use your functions file to perform AJAX calls through Wordpress
<form class="ajax-example-form">
<input type="text" class="message" />
<input type="submit" />
</form>
<div class="example-response"></div>
@chrisblakley
chrisblakley / category-query.php
Last active August 29, 2015 14:07
Various methods of using loops and queries within WordPress
<?php query_posts( array( 'category_name' => 'ideas', 'showposts' => 4, 'paged' => get_query_var('paged') ) ); ?>
<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
<div class="row">
<div class="fourteen columns centered">
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<div><?php echo nebula_meta('date'); ?></div>
<p class="postexcerpt"><?php echo nebula_the_excerpt('Read more &raquo;', 30, 1); ?></p>
<div<?php echo nebula_meta('tags'); ?></div>
@chrisblakley
chrisblakley / ooyala-markup.html
Created October 17, 2014 15:31
Snippets for using Ooyala players in a modal.
<script src='http://player.ooyala.com/v3/MzZiMzc1ZDUzZGVlYmMxNzA3Y2MzNjBk'></script> <!-- Branding ID here -->
<script src="//cdnjs.cloudflare.com/ajax/libs/simplemodal/1.4.4/jquery.simplemodal.min.js" defer></script>
<div id="lgVid1" class="simple_overlay">
<a class="closemod simplemodal-close">X</a>
<div id='playerwrapper'></div>
</div>
<a id="ooyalalink1" class="ooyalalink" href="#" rel="#lgVid1" data-ooyala="44azdwNDpSWUvfd8F30d55tXY0YH9njH">Play Video</a> <!-- Embed Code (Asset ID) here -->
@chrisblakley
chrisblakley / ajax-form.js
Created October 17, 2014 15:37
An AJAX form using Nebula
jQuery(document).on('submit', '#ajax-contact', function(e){
var contactData = [{
'name': jQuery("#ajax-contact input.name").val(),
'email': jQuery("#ajax-contact input.email").val(),
'message': jQuery("#ajax-contact textarea.message").val(),
}];
jQuery('#form-messages').html('<i class="fa fa-spinner fa-spin sending"></i> Sending...');
jQuery.ajax({
@chrisblakley
chrisblakley / bxslider-hero.css
Last active August 29, 2015 14:07
An example implementation of a hero slider with bxSlider and Nebula
div#heroslider {position: relative; height: 500px; overflow: hidden; -webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s;}
div#heroslider.closed {height: 0;}
.bx-wrapper {}
.bx-wrapper .bx-viewport {min-height: 500px; border: none; left: 0; z-index: 1;}
ul.bxslider {margin: 0; background: #222 url('images/black-linen.png'); height: 100%;}
ul.bxslider li {padding: 0; height: 100%;}
ul.bxslider li div {position: absolute; top: 30%; left: 50%; width: 70%; max-width: 940px;}
ul.bxslider li div p {display: table; position: relative; margin-left: -50%; padding: 10px 30px; color: #000; text-align: center; text-transform: uppercase; margin-bottom: 5px; background: #fff; background: rgba(255, 255, 255, 0.9); box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.2);}
ul.bxslider li div p.line1 {font-size: 48px;}
ul.bxslider li div p
@chrisblakley
chrisblakley / native-hero.css
Created October 17, 2014 15:47
Example hero slider with native code.
#theslider {transition: all .5s ease 0s;}
#theslider .sliderwrap {position: relative;}
#theslider .slider-arrow {position: relative; display: inline-block; color: #a7a8aa;}
.no-js #theslider .slider-arrow {display: none;}
#theslides {position: relative; /* min-height: 400px; */ z-index: 500;}
#theslides li {position: absolute; top: 0; left: 0; width: 100%; height: auto; margin-bottom: -8px; text-align: center; opacity: 0; z-index: 0; transition: all 1s ease 0s;}
#theslides li.active {position: relative; opacity: 1; z-index: 9999;}
.no-js .slider-nav-con {display: none;}
@chrisblakley
chrisblakley / nebula_event.js
Created November 9, 2014 04:41
nebula_event for CSS in console logs for event tracking
<script>
<?php //Using this for GA event tracking will note when events are being sent during debug mode (or for admins) without needing to additionally log the event. ?>
function nebula_event(category, action, label, value, error1, error2) {
category = typeof category !== 'undefined' ? category : null;
action = typeof action !== 'undefined' ? action : null;
label = typeof label !== 'undefined' ? label : null;
value = typeof value !== 'undefined' ? value : null;
error1 = typeof error1 !== 'undefined' ? error1 : null;
error2 = typeof error2 !== 'undefined' ? error2 : null;
@chrisblakley
chrisblakley / js_error_tracking.html
Created November 10, 2014 04:10
Track JavaScript errors with Google Analytics
<script>
if ( window.addEventListener ) {
window.addEventListener('error', function(e) {
if ( e.lineno != 0 ) {
ga('send', 'event', 'Error', 'JavaScript Error', e.message + ' in: ' + e.filename + ' on line ' + e.lineno);
ga('send', 'exception', e.message, false);
}
});
}
</script>
@chrisblakley
chrisblakley / shortcode1.php
Last active August 29, 2015 14:09
Example shortcode function
add_shortcode('yolo', 'gearside_yolo_shortcode');
function gearside_yolo_shortcode(){
//Code will go here...
}
@chrisblakley
chrisblakley / adblock_detect.html
Last active August 29, 2015 14:10
Detect if users are blocking your ads using jQuery
<style>
.hidden {display: none;} /* Just for reference. This should be in your stylesheet! */
</style>
<div class="extra_resources">
<!-- [AD_CODE_HERE] -->
</div>
<a class="blockdetection hidden" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=VALMBPW4PWH8S" target="_blank"><img src="donate_image.png" alt="Donate via Paypal" /></a>