Default Twitter Bootstrap CSS Media Queries

[css] @media(max-width:767px){} @media(min-width:768px){} @media(min-width:992px){} @media(min-width:1200px){} [/css] If you’re using SASS or LESS. [css] @media(max-width: @screen-xs-max){} @media(min-width: @screen-sm-min){} /* deprecated: @screen-tablet, or @screen-sm */ @media(min-width: @screen-md-min){} /* deprecated: @screen-desktop, or @screen-md */ @media(min-width: @screen-lg-min){} /* deprecated: @screen-lg-desktop, or @screen-lg * [/css]

HTML5 video not playing on iOS devices.

We’ve all heard of it. Most sites are using it. It’s called HTML5 and more specifically for this post – HTML5 Video. For maximum browser support, use three types of video. Add them as <source> tags, wrap them all up in a video tag and you’re off and running. In its simplest form, a HTML5 […]

Change twitter bootstrap carousel transition from slide to fade

I frequently use Rachel Bakers BootstrapWP which is a great development theme for Responsive WordPress Design. There’s also a branch that comes with all the components of bootstrap 3. Still though no fade transition for the build in slider or carousel. This is easily fixed with a bit of CSS. [css] .carousel-fade .carousel-inner .item { opacity: […]

Easily create Twitter Bootstrap buttons of all colors

I love Twitter Bootstrap. The button classes are hugely convenient and the CSS3 animation is a great touch. Bootstrap comes with a few different default button colors you can implement by using the built in CSS classes. [html] //Default gray button <button class="btn">Primary</button> //Blue button <button class="btn btn-primary">Primary</button> //Orange button <button class="btn btn-warning">Warning</button> //Red button […]

Responsive design with a view full site link

A warranted preface on media queries and responsive design Does a responsive design with a view full site link really make sense?  As developers (and UI/UX designers) shouldn’t we be using the media queries to present information in a pleasant and effective manner for each and and every screen size? If you subscribe to the philosophy of ‘responsive design’, than yes. And […]

Directory jQuery Slider

Loads all images in a specified directory and creates a slide show Current Version: 0.9 Github Page: About I occasionally work on an application that is, for all intent and purposes, a CMS. This application and its subsequent ‘sites’ all use the same exact markup. There is some flexibility with some custom fields, but for reasons […]

Changing WordPress Default Taxonomies

Sometimes the native out-of-the-box WordPress Taxonomies ‘Categories’ & ‘Tags’ just don’t make sense when structuring the content. Or maybe, said taxonomies play an explicit role in  dynamically generated content and you need to make is EXTRA clear to the end user what exactly these ‘tags’ or ‘categories’ actually DO? A recent example was website where categories where […]

Responsive drop down menu with CSS media queries &#038; jQuery

Or in other words, display a custom (mobile?) menu at a user defined breakpoint. So the steps are 1)Detect browser window size onload 2)Apply appropriate menu 3)Monitor window size 4)Apply appropriate menu at breakpoint How we’re going to do it 1)Detect window size with CSS media Queies and jQuery onload 2)Apply add CSS helper class […]

Retrieve all image attachments for a WordPress post

I use this a lot. Typically becuase I have some sort of custom write panel that allows the user to upload mutiple images, attach them to the post and then said images populate a gallery – or something along those lines. Get the “posts” Image attachments are just another type of  “post” within the data […]

Custom Taxonomy Breaks Permalinks

No kidding! Chances are if you are reading this you’ve done some head scratching on this topic.I’m willing to bet the problem is you’ve changed somtheing in regards to your custom taxonomies and  a rewrite setting is persisting, thus pulling a 404, when you navigate to an archive page of said taxonomy(s). This was my problem. […]