All posts tagged ‘tutorial’

File Under: Blog Publishing

Get Started With Movable Type

You recently decided hosted blogging is for the birds. You want more control over your blog’s setup. In fact, you want total control over every last detail of your layout, functionality and design. So what do you do? Where do you turn?

One popular option is the Movable Type publishing system from Six Apart (other popular options include Drupal, Joomla!, and WordPress). Movable Type contains pretty much everything you need to get your own site up and running, plus the flexibility to get really obsessive over the details. Also, with a little creativity and some community-created plugins, you can power much more than just a reverse-chronological list of blog posts.

This tutorial won’t go into the Movable Type installation process in-depth since there are many resources online already. What we’ll cover is the process of dressing up a vanilla Movable Type installation by customizing the look and feel of your new site. We’ll also get you started with some custom features by installing some plugins.

Continue Reading “Get Started With Movable Type” »
File Under: CSS

Get Started With CSS 3

If you follow CSS, you’re probably sick of hearing promises of CSS 3 — the next generation style sheet language that should have been here several years ago.

Well, the specification document still isn’t finalized. If you’re impatient, you’re not alone. Browser manufacturers have already started rolling out support for many of the new features even if they aren’t yet set in stone.

Opera and Safari have been leading the way when it comes to CSS 3 features, but Firefox 3 packs in a few and 3.1 promises to bring Firefox alongside the others.

Yeah, we know what you’re thinking: “I can’t do it. I have to support Internet Explorer.”

Well, you’re right. Users of Internet Explorer are out of luck. Although, there’s no reason you can’t use some rounded corner properties solely for your Firefox/Opera/Safari visitors. IE will still render the backgrounds as usual, it just won’t understand the rounded corner bit.

We’re willing to admit that most of these rules are still a year or two from being mainstream, but it doesn’t mean you can’t start learning them now.

Want to bleed from the cutting edge of web design? Put on your daredevil helmet and let’s dive into some cool new design features.

Continue Reading “Get Started With CSS 3″ »
File Under: Multimedia

Get Started With OEmbed

Anyone with a blog will tell you: the best thing about the social media sharing revolution is the “sharing” part.

Popular sharing sites like YouTube, Photobucket and offer embed codes, strings of code that make it easy for you to plug a video or a song (inside a small player or display wrapper) into your page. These codes work great for sites that offer them, but embed codes and options for embedding media differ greatly from site to site. And some sites don’t offer any easy sharing codes.

It’s easy enough to post an image or MP3 if you know some HTML. But by now we’re deep into the age of the big “share” button — blog tools and widgets that offer no-brainer, one-click posting. So if you’re building a social app that allows users to share images, videos or songs, your visitors will expect something that’s as dead easy as it gets.

To that end, what if there was a standard for grabbing a full multimedia embed code from a URL? Wouldn’t it be nice if you could turn a simple URL link into an embedded Flickr image or YouTube video? Sure, you can reverse engineer many of the various embed structures offered by sharing sites, but what happens when the host of your embeded media changes its format or relocates the actual asset? Thousands of broken links suddenly litter your site.

These are the wishes (and problems) that led to OEmbed, a new proposed standard for taking a URL and generating an embed link. The proposal is the brainchild of Pownce developers Leah Culver and Mike Malone, as well Cal Henderson of Flickr and Richard Crowley of OpenDNS.

Not every site supports it, so OEmbed isn’t going to solve all your embedding needs overnight. But given that some big names — like Flickr and Viddler — have already signed on, we think others will soon follow suit.

Let’s dive in to see how OEmbed can make your life (and your webapp) easier.

Continue Reading “Get Started With OEmbed” »
File Under: JavaScript

Sanitize Text with MooTools

The code, and the template, are referred to in Webmonkey’s Get Started With MooTools reference page. In this example, the HTML page contains several forms. Using JavaScript and the MooTools web framework, we will pull out the last letter of a typed form, clean up unused space in another form and automatically format a telephone number.

Continue Reading “Sanitize Text with MooTools” »
File Under: HTML, Web Standards

Add HTML Forms to Your Site

So you’ve decided it’s time to interact with your users. You’re tired of this one-way street — you talking, them listening. You want to actually hear what your readers have to say. In order to do this, you’ll need to provide a way for people to enter information. Therefore, you’re going to need an HTML form (to process this information, however, you must implement some sort of script, which might require another tutorial).

Continue Reading “Add HTML Forms to Your Site” »