Skip to content

Instantly share code, notes, and snippets.

View stephenscaff's full-sized avatar

Stephen Scaff stephenscaff

61 followers · 7 following
View GitHub Profile
@stephenscaff
stephenscaff / img to background-image
Last active August 29, 2015 13:57
Turn img to a background-image of it's parent div. Great for accessing the proportional cropping of bgs while still droppin some meaningful markup.
//Parent div
$('.js-tobg').each(function() {
//Hunt down img in parent div and snag its src
var imageUrl = $(this).find('img').attr('src');
//Now add inline style with backgroud-image to div
$(this).css('background-image', 'url(' + imageUrl + ')');
//Maybe cover the badboy?
@stephenscaff
stephenscaff / gist:6736c564ca3e66404ff7
Last active August 29, 2015 14:01
Updates Styles for chefn - 5-15 1:34pm
/*----------------------------------------------
--Vendor Prefix
----------------------------------------------- */
/*----------------------------------------------
--Transition
----------------------------------------------- */
/*----------------------------------------------
--Translate
----------------------------------------------- */
/*----------------------------------------------
@stephenscaff
stephenscaff / PureJS-AddClass
Created June 28, 2014 11:15
Add Class with Pure Javascript
//Fade in page all sexy like with a css opaicty keyframe
document.getElementsByTagName('html')[0].className+=' fade-in-page'
@stephenscaff
stephenscaff / findpageurltoaddclass
Created June 30, 2014 10:15
Find page url to add class
$(function(){
//If the url contains foo
if (window.location.href.indexOf('foo') >= 0) {
//add a class on specified div
$('.myclass').addClass('myaddedclass') ;
}
});
@stephenscaff
stephenscaff / AddPlaceholders.js
Created July 5, 2014 10:26
Add global placeholders with Jquery
$(document).ready(function(){
$('form').find("input[type=textarea], input[type=password], textarea").each(function(ev)
{
if(!$(this).val()) {
$(this).attr("placeholder", "Here goes your placeholder);
}
});
});
@stephenscaff
stephenscaff / DropKickJs-remove-prompt-after-change.js
Created July 5, 2014 10:33
Remove placeholder/ first option from a DropKick.js select and corresponding unordered list output. Using DropKick in a rails app featuring a filter bar, needed to ensure select placeholders via 'prompt" would not be selectable. Since Dropkick.js makes an unordered list from selects, have to ensure that both the first select option and ul list i…
/*----------------------------------------------
--Remove Prompt after change
----------------------------------------------- */
//target all styled selects and their generated unordered list
$('.dk-drops').change(function(){
//Remove the first select option & it's corresponding generated list item
$(".dk_options_inner li:first-child").remove();
$(this).find('option:first').remove();
});
@stephenscaff
stephenscaff / Wordpress-Next-and-Previous-Posts
Created October 7, 2014 15:41
Snags next and previous posts in Wordpress. Intended for a single.php template. Can also pull images with a <?php the_post_thumbnail('thumbnail'); ?> or a catch first img function.
<!-- Single Next/Last Post nav
================================================== -->
<section class="post-nav">
<div class="row">
<?php $prevPost = get_previous_post(true);
if($prevPost) {
$args = array(
'posts_per_page' => 1,
'include' => $prevPost->ID
);
@stephenscaff
stephenscaff / Wordpress: Next and Last Post
Created December 18, 2014 16:13
Get next and last post in Wordpress, using first image from post (catch_that_image) instead of a featured image, styled as background-image for container-less half grid.
<!-- Single Next/Last Post nav
================================================== -->
<section class="sect-posts post-nav cf">
<?php $prevPost = get_previous_post(true);
if($prevPost) {
$args = array(
'posts_per_page' => 1,
'include' => $prevPost->ID
);
@stephenscaff
stephenscaff / wordpress create new user role with user-based login redirect.php
Last active August 29, 2015 14:16
First steps in creating a Client Portal with user specific content in Wordpress. Create new User Role: Client. Then redirect them away from admin on login, to wherever. In this case 'yoursite.com/client-portal'.
/*-----------------------------------------------*/
/* Create new Role for: Client
/*-----------------------------------------------*/
$result = add_role( 'client', __('Client' ),
array(
'read' => true, // true allows this capability
'edit_posts' => false, // Allows user to edit their own posts
'edit_pages' => false, // Allows user to edit pages
'edit_others_posts' => false, // Allows user to edit others posts not just their own
@stephenscaff
stephenscaff / wordpress-customize-htm-editor-buttons.php
Last active August 29, 2015 14:16
Maintain your awesome blog styles by preventing client retardery. First, remove the evil WYSI editor. Then customize the output of built in HTML editor buttons. Finally, create some custom buttons for subheaders, figcaptions, hr separators, link styles, etc. For my own purposes, some outputs for syntax highlighting via Prism JS.
/*-----------------------------------------------*/
/* Kick Rocks Visual Editor form Admin
/*-----------------------------------------------*/
add_filter ( 'user_can_richedit' , create_function ( '$a' , 'return false;' ) , 50 );
/*-----------------------------------------------*/
/* Customize Output of HTML Editor Buttons
/*-----------------------------------------------*/
function my_show_quicktags( $qtInit ) {
$qtInit['buttons'] = 'strong,em,block,del,ul,ol,li,link,code,fullscreen';