Wordpress as a CMS- Fun with custom fields

May 14, 2009

While Wordpress obviously wasn’t initially designed to be a full featured CMS, and it still has a ways to go in competing with Drupal or Concrete, this is a great trick you can use to expand your ability to add content which is editable from the admin area. Wordpress Custom Fields will allow you to add data below the post area when you are creating a post (or a page which uses “post” info basically). You can create a Custom Field “Name” and “Value”, the name is basically a key that you can use to call the content in your template…which is the great part of this as it allows you to place editable content outside of the main post area on a page. Here is a screen shot where you can see I have added two Custom Fields, one for a picture (I didn’t add the picture value yet, but you can add a pict via the main content area then just copy the HTML info and paste it in) and one for a quote the client wants to change on each page (click the thumb for full size).

code_screen.gif

You need to actually edit your templates a bit, but it is fairly easy. Once you have created your Custom Field Name and added some content (value) you can use the get_post_meta() (click here for more detailed info) function as demonstrated below, just swap out Custom Field name where indicated and you can place this in your template-

<?php $key=”YOUR CUSTOM FIELD NAME”; echo get_post_meta($post->ID, $key, true); ?>

You can play around with adding html in the custom field or your template to get styling correct. This is how it looks in my template where I want the quote to show up.

code

I also recently discovered a nifty plug-in which will add tinyMCE toolbar functionality to the Custom Fields! Very cool.

Filed under: Tips/Tutorials, Wordpress — rswelling
Comments (0)

Productivity! Get some Self Control

March 31, 2009

Here is a small app that addresses the growing problem of web distraction due in some part to all the social media apps. Are you constantly checking email, adding Tweets…or logging in to Facebook to see if you are losing that Scrabble match? Stop the madness! This app will allow you to block certain websites and email for a specified amount of time…beware it is a commitment as it will not allow you to override it until the time is up! Call it a self imposed intervention of sorts. It is only for Mac users…we must need it most…but wait, I love my distractions, they keep me sane, ah well enough of this time sucking Wordpress BLOGGING, back to work.

Get some SELF CONTROL!

Filed under: Tips/Tutorials — rswelling
Comments (0)

Jumpcut- Multi Clipboard Mac App

February 16, 2009

My job occasionally requires a large amount of clipboard action. Cutting and pasting text from one document to another, mostly when formatting content to html for web development and various client website updates. I discovered this small lifesaver of an app which will keep track of recent text clippings you make, and provide access to them. This allows you to have access to more than one piece of clipped text, which can be extremely helpful. The app currently only works for text, not images, but it is free, and hopefully they will eventually offer image/graphics support as well. Once installed Jumpcut adds a scissor icon and drop down in your top toolbar from which you can access recent clippings or configure it’s preferences.

More info and download: Jumpcut Minimalist Clipboard

Filed under: Tips/Tutorials — rswelling
Comments (0)

Embedded Video Player Comparison

August 4, 2008

So I have been meaning to post a comparison of some of the major players in the online video publishing and sharing industry, and finally I have found time. This is some footage I shot shortly before leaving Tucson AZ of a demolition derby slash monster truck event at night. The video I am hosting and serving up with the great JW Player was compressed using the basic medium settings in the Flash encoder on2 VP6 codec. The original SD miniDV file for uploading to the online services was edited in FCP and exported using the h.264 codec, high quality, multi-pass. The file is about 2 minutes long and was 50 megs or so. FYI at the time of this post most of the Upload services will only allow you to upload 100megs. I had no problems uploading to any of these sites, the process was smooth and pretty much the same for all of them.

First off this is the source video, hosted by me, not from a flash streaming server. The .flv video source is being played using the JW Player (and a wordpress plugin FLV embed). ALSO of note I am using the embed code from each site as provided, and the window size they put in there. This code in some instances breaks standards acceptability. For a good article on that check out this post from Bernie Zimmermann and read the comments, there is some better code in there to use if you want to stay standards compliant.

Ok! let’s move on to the free hosted video options

Youtube-
They are the Google powered heavyweight, everyone knows them, and everyone has seen at least some Youtube videos. They have added some interesting options to their player recently, so you can now add multiple videos from your same account. In my opinion their compression is considerably poorer compared to these others, however they have a HUGE network of users, so if your main concern is to get your video seen…Youtube is probably the place to start.

Vimeo-
Vimeo is a newer challenger to Youtube, they have a great looking stylish player, and also offer to host and serve up higher quality HD video. Their compression looks great.


Monster Truck Derby from Eric on Vimeo.

Blip.tv-
Another new challenger to Youtube is Blip.tv, they have a nice simple clean player, and their compression looks good.

Jumpcut-
Jumpcut offers the ability to do simple edits to your own video online, which may come in handy if you are away from the editing machine and need a small change made.

In conclusion there are some really good quality challengers to Youtube now, and the better quality of these players means Youtube might need to revisit their compression options. However, many people viewing videos online simply don’t care too much, and are more concerned with speed so it will be interesting to see how it plays out. As far as your choice between using a service like Youtube, or hosting your own videos? The things you need to consider are mostly branding, bandwidth and access to a social network. Youtube type sites have their own branded players, and they link off to their sites…they are “free” obviously. You might end up sending your visitor offsite, by the same token these networks have large numbers of users everyday, so you can take advantage of some built in marketing by posting your video there.

Filed under: Tips/Tutorials, Video — rswelling
Comments (1)

CSS clear floats with overflow!

July 21, 2008

So this has been a problem we’ve all encountered when coding out sites with CSS tableless layouts. When you have divs floated left and right it takes them out of the flow of the page and basically they don’t read as content within a container div. Traditionally I’d been using another div with “clear:both” in one way or another after the floats, or *gasp* a defined height. I was searching for an alternative method when I discovered this article on the Sitepoint blog, which claims simply using “overflow:auto” on the container div will force it to behave. Initially I was skeptical, but I have been using this method for a few weeks in production, and holy smokes, it works! Additionally my comrade Mark Wyner states that “overflow:auto” does not work in ie6, however using “overflow:hidden” will work. So give it a try, you will be amazed…I was. Some report this doesn’t work in ie5 on Mac…but c’mon if you’re on a mac you SHOULD be using Safari at this point!

*update*
Mark discovered another thing about this which seems only true in Safari. If you have floats below floats this will not work, you should try additionally adding “clear:both” on your floats below.

Filed under: Design, Tips/Tutorials — rswelling
Comments (0)

CSS Tip: Adding Multiple Classes

February 14, 2008

Here is a nice CSS tip my comrade Mark passed on to me the other day. Say you have a tag and you already have an ID and a Class…you can actually add another class to it by just separating them with a comma, how handy is that in a pinch! <p id="first" class="red, bold">

Filed under: Tips/Tutorials — rswelling
Comments (0)

Illustrator CS3 Live Trace

February 12, 2008

If you are a web designer no doubt you have at one point or another been in dire need of some way to enlarge that tiny .gif logo your desperate client provided you with…CS3 to the rescue. Illustrator has the guts from the old Streamline program, which will turn a bitmap into a vector file for you, allowing you to size up without loss in quality…Here is a nice little tutorial which will get you rolling in no time.

Filed under: Tips/Tutorials — rswelling
Comments (0)