Welcome to Moosch, the blog of Moosch Media

This is where I write little snippets of knowledge that I've worked out, or come across, during my work. I find it useful, and I hope others do too.

Use Twitter Bootstrap to build the wp_nav_menu

When building a super simple WordPress theme I created a really simple way that you can use Twitter Bootstrap to build the wp_nav_menu. I’ve played with twitter bootstrap for a while now and I’ve got to say it’s pretty awesome for knocking up some great looking, responsive sites. You can build a really nice and …read more

A nicer upload button

We’ve all come across the ugliness of html form upload inputs. They are by default not that aesthetically pleasing. But with the magic that is css we can style them up real nice like. Granted there are a few alternatives, such as using javascript like the examples found on Appelsiini,  and even Filament Group have a …read more

jQuery Full-screen Images

I recently read about Full-screen mode on the Mozilla Developer Network and it looked really interesting. So after a little playing around of my own I managed to get this working with a jQuery trigger to view an image in full-screen mode. So here’s how I did it. First whip up a simple web page with …read more

Reduce http requests with Data URI’s

Any front end developer worth their salt will know that it’s important to reduce load time on a website. One way is to reduce the number of http requests the page has. Sounds simple right? Well guess what…it is! You can reduce http requests with data URI’s in no time at all. Data URI’s have …read more

Use mobile touch events to navigate wordpress posts

There are lots of ways to detect in-browser touch events on mobile devices, but we are going to look at the humble swipe event to navigate posts in your wordpress instillation. First I’m going to assume you have your wordpress theme set up, and have optimised your theme for viewing on mobile devices. If not …read more

Create an Animated GIF with Photoshop

This tutorial helps you create an animated gif with Photoshop’s Animation feature. We are going to create a simple loading gif, like the ones you see on sites with Ajax calls. I’m going to assume you have Adobe Photoshop installed and that you have a basic working knowledge of how to use it. If not …read more

How to make quick Photoshop patterns

We all know how great photoshop is, and if you’re a regular user you’ll probably have had a play around with the patterns feature. In web design it’s commonly used to create textures and creating a bit of depth on the page. But how do you make your own photoshop pattern? There are lots of …read more

Thoughts on Google’s recommended mobile SEO config

Google recently released a developer page outlining their stance on mobile SEO. It goes into great detail explaining how to adhere to their three specifications for serving up web pages for mobiles and desktops. The three points are: Sites that use responsive web design, i.e. sites that serve all devices on the same set of URLs, …read more

Creating a holding page with signup using PHP

Holding pages can be very useful for data capture while you are working out the kinks in your website. You can promote the site before launch and a data capture page lets you monitor public interest, and notify those people when you finally launch. Wonderful. So here’s a quick and simple way to get your …read more

Web Design Inspiration

Design inspiration is a great way to see what techniques other web designers are using and to what advantage. These sites are great examples of some of the awesome things web designers and developers can achieve with a little css, html and javascript. If you have any other examples please post them in the comments …read more