This is a collection of my most often used lines of code, as well as a few other examples I want to have ready at a moment's notice. These snippets focus on building HTML from scratch, linking in good web fonts, and setting up responsive styles for your pages.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* Custom Loop Add to Cart. | |
* | |
* Template with quantity and ajax. | |
*/ | |
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly. | |
global $product; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php header('X-Frame-Options: GOFORIT'); ?> | |
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>SpeedTester</title> | |
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, minimal-ui"> | |
<style type="text/css"> | |
* { box-sizing: border-box; -moz-box-sizing: border-box; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-kerning: auto; font-family: 'Source Sans Pro', 'Open Sans', Roboto, 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', 'Myriad Pro', 'Segoe UI', Myriad, Helvetica, 'Lucida Grande', 'DejaVu Sans Condensed', 'Liberation Sans', 'Nimbus Sans L', Tahoma, Geneva, Arial, sans-serif; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; cursor: default; } | |
html { font-size: 10pt; background: #ccc; -webkit-text-size-adjust: 100%; } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* bling.js */ | |
window.$ = document.querySelector.bind(document); | |
window.$$ = document.querySelectorAll.bind(document); | |
Node.prototype.on = window.on = function(name, fn) { this.addEventListener(name, fn); }; | |
NodeList.prototype.__proto__ = Array.prototype; | |
NodeList.prototype.on = function(name, fn) { this.forEach((elem) => elem.on(name, fn)); }; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
# The Mad CSScientist's Matching Height Plugin | |
written by Tommy Hodgins: http://codepen.io/tomhodgins/pen/pjmKNj | |
## Usage | |
This plugin will measure the height of a group of elements and assign each of them the highest value. | |
To group elements together, assign each element a `data-col` attribute with the same value. This way, the plugin can calculate the heights of different groups of elements on the same page. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const articles = [ | |
{ | |
title: 'How to make an example', | |
body: 'This tutorials shows you how to make a nice example. First Write some text!' | |
}, | |
{ | |
title: 'My super frustrating personal blog entry', | |
body: 'Im feeling so happy and angry and sad and glad and hungry and tired.' | |
} | |
] |
CSS Object Notation
CSSON is a superset of JSON that is parsed according to CSS syntax.
Any JSON can be parsed as CSSON, though not every CSS Style Sheet can be parsed as CSSON.
Pros:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function html(string = '') { | |
return document.implementation | |
.createHTMLDocument() | |
.createRange() | |
.createContextualFragment(string) | |
} | |
/* | |
A JavaScript function that takes a string of HTML syntax, parses it as HTML and returns a Document Fragment containing all parsed nodes. |