Skip to content

Instantly share code, notes, and snippets.

@bbmatt
bbmatt / custom-labels.less
Last active December 21, 2015 03:19
Bootstrap 3.0 Label arrow gist. Add arrows to labels, plus a plain text label. (no background) To use, simply override the default bootstrap mixin by adding your own custom mixins less file and compile and also add a relative position and inline-block display to your custom bootstrap .labels file.
.label {
position: relative;
display: inline-block;
}
@bbmatt
bbmatt / research.txt
Last active December 24, 2015 21:29
Drupal - get the path of an image without resorting to modules / Custom views-view--fields template
Views template API docs:
https://api.drupal.org/api/views/theme!theme.inc/group/views_templates/7
Function file_create_url:
https://api.drupal.org/api/drupal/includes%21file.inc/function/file_create_url/7
Function field_get_items:
https://api.drupal.org/api/drupal/modules%21field%21field.module/function/field_get_items/7
@bbmatt
bbmatt / nojs.less
Last active December 27, 2015 09:09
Bootstrap 3.0 - no javascript. This solves a number of accessibility issues that may arise with Javascript disabled - it may cause a few issues too :)
//
// no-js
// --------------------------------------------------
// Modernizer.js provides us a class to use if Javascript is disabled.
// (https://github.com/Modernizr/Modernizr/blob/master/src/setClasses.js#L9)
// Bootstrap .collapse - no javascript?, display it as block. Anything using .collapse 'expanded' by default.
.no-js .collapse {
@bbmatt
bbmatt / mymodule.info
Last active December 31, 2015 20:08
Drupal & parsley.js - very quick method to enable parsley.js on drupal forms. Create a drupal module, in this case, I've called it parsley_form and enable it.
; $Id: $
name = Parsley.js form enabler
description = Adds necessary elements to form to enable parsley.js validation
core = 7.x
@bbmatt
bbmatt / content-banner.php
Last active August 29, 2015 14:25
Responsive wordpress background image example (metabox - cmb2)
<?php
$image_id = get_post_meta( get_the_ID(), '_banner_image_id', true );
if(!empty($image_id)):
// Get responsive image sizes.
$banner_small = wp_get_attachment_image_src($image_id, 'banner_small');
$banner_medium = wp_get_attachment_image_src($image_id, 'banner_medium');
$banner_large = wp_get_attachment_image_src($image_id, 'banner_large');
// Construct inline style
echo "<style>@media (max-width: 640px) { .banner-image { background-image: url($banner_small[0]); } } @media (min-width: 641px) and (max-width: 1023px) { .banner-image { background-image: url($banner_medium[0]) } } @media (min-width: 1024px) { .banner-image { background-image: url($banner_large[0])} }</style>";
@bbmatt
bbmatt / wordpress-tinymce-functions.php
Last active August 29, 2015 14:26
Get tinymce to behave with custom styles, blockformats and editor buttons in Wordpress.
<?php
// Wysiwyg editor configuration (Tiny MCE)
function my_format_TinyMCE( $in ) {
$in['remove_linebreaks'] = false;
$in['gecko_spellcheck'] = false;
$in['keep_styles'] = true;
$in['accessibility_focus'] = true;
$in['tabfocus_elements'] = 'major-publishing-actions';
$in['media_strict'] = false;