Feeds

WordPress Hacks

 WordPress Hacks: Moving a Static HTML Site to WordPress

Submitted by Raj Dash on April 14, 2008 - 4:10pm in

[intermediate] Sonzy, a member of Hive, wanted to know, after moving a static HTML site to WordPress, how you retain the old URLs. That is, the old site's URLs ended with ".htm", and WP changes these to URLs based on postname and possibly the date, depending on how have WP permalinks set up. There are a few options, if your old URLs ended with .htm, .html, or other variations.

  1. Use 301 redirect rules in your web server's .htaccess file. Drawbacks:

    1. You are changing your entire site's URLs. Doing this might incur a temporary SERPs (Search Engine Results Pages) penalty and changing your rankings. (I'm not saying this will happen, just that it might.)
    2. The average blogger might not understand .htaccess rules.
    3. The .htaccess might not be accessible through your hosting account. (Depends on the host.)
  2. Use a WordPress URL redirection plugin. Drawbacks:
    1. This one is relatively easy to implement, but I've only ever tried it from within WP. That is, I didn't move from a static HTML site. I already had a WP site and wanted to go from an old permalink URL structure to a new one. I haven't tried it, but I think using a plugin will complicate matters in this case, unless you find a specific plugin designed to handle this.
    2. You are changing your entire site's URLs. (See above)
  3. Tweak the new permalinks and URL slugs in WordPress. This ensures that all your URLs stay the same as on your static HTML site. Drawback:
    1. Lot of manual work. Unless you know how to write SQL queries, you're going to have to do this manually. (Even if you do know SQL, you may not want to use it.)
  4. Install WordPress over top of your existing site. In the past, I've successfully had two different websites living on the same domain. One was a static site that had URLs with .html, and the newer site was in WordPress. This is a fairly simple upgrade. Drawbacks:
    1. The old /index.html page will still exist, but will not get served. That will be auto-redirected to / (your new WP home page). However, all the other old URLs will exist and be visible. So you'd have to manually port any content/ media from the old home page to the new one.
    2. Unless you change the layout of the old pages to match, they will have a different theme than your new WordPress site.

These are the options I've used to date, for moving from a static HTML site to a WordPress site. (This will apply for any platform that does not generate an /index.html for the home page.) Options 3 and 4 both retain the old URLs (with the exception of the old homepage for option 4).

If you're dead set on changing your old pages to WordPress but want to retain the URLs, option 3 is what you want. (If anyone has other suggestions, please do comment.) However, if you have lots of posts, expect tedious porting work ahead. (Note: You could have a situation where a search spider comes along and indexes your new URLs and finds your old ones missing. I'm merely pointing this out, but I'm not sure what the likelihood of this happening, on average, is.)

Option 3: Manually Tweaking Your URLs in WordPress

Read the rest of this entry


 WordPress Hacks: Using Custom Fields to Auto-Embed YouTube Videos

Submitted by Raj Dash on April 12, 2008 - 3:16am in

[intermediate] If you only use videos once in a while on your WordPress-run site, this hack probably isn't of much use to you. But if you embed videos regularly, you probably get tired of copying and pasting the embed code all the time. Another possibility is that you want your in-post videos to show only on permalink pages, not on the home page. You can satisfy those and other functionalities by using WordPress custom fields and a little bit of HTML/ WP PHP code to control how and where your video shows up.

Sounds complicated, but if you have even a little bit of experience with coding in WordPress (a combo of HTML and PHP, with WP functions and sometimes JavaScript), then process is relatively simple. I'm assuming below that you have some experience in creating a custom field. (There's a snapshot below if you haven't.) Let's go through the first-time process:

  1. From your WP admin panel, create a new post. Then create a custom field: "youtube_id". (Once you create the custom field, it will be available to all other posts, old or new.)
  2. Assign to the youtube_id field the id of the youtube video that you want to embed. It's the value after the "watch?v=" in a YouTube URL. So if the url is http://www.youtube.com/watch?v=pxNGKICfi_g, the youtube video id is "pxNGKICfi_g". This is the value you'll enter (without quotations) into the custom field youtube_id.
  3. Save the post.
  4. Insert the custom code block (shown below) in your permalink template. Usually this will be in the single.php template file of your WP theme. Place the code where you need it. I like to place videos at the end of a post, but what you do will depend on your requirements.
  5. Refresh your permalink (post) page and you should see the video embedded.

Those are the steps that you take the first time, for each unique custom field you create. The next time you want to use the same field in another post, you only need to do steps #2, 3 and 5.

The Technical Details

Read the rest of this entry


 Jazz Up Your Site: 28 Ways To Use WordPress Custom Fields

Submitted by Raj Dash on April 1, 2008 - 5:20pm in

Are you tired of the boring old WordPress blog you've set up? The platform does have CMS capabilities, as 48 Unique Ways to Use WordPress proved, so you can create some pretty powerful websites and web applications. To do this, use a powerful but relatively underused WordPress feature known as Custom Fields, which allows you to add "meta" information for each post page and manipulate it with bits of HTML/ PHP code and WordPress functions.

Reasons To Use Custom Fields

You create a custom field, then choose on a post by post basis what information you will add. That information can be manipulated by custom WP/PHP code to present additional textual or visual content when a visitor views a post page. To summarize:

  1. Add metadata for reporting or other purposes.
  2. Add visually cohesive elements to your site.
  3. Manipulate information and control its display programmatically.
  4. Make global changes across all your posts with a single code change, instead of manually updating each post.

The lists below show some ways that WP custom fields can be used to provide more textual and visual info to your site visitors. If you decide to change something, say a border or background or even placement on the post page, without custom fields you would have to make changes manually to each and every post. If you have hundreds of posts, you'd have a daunting task. With custom fields, you have structure and homogeneity through custom handler code.

Read the rest of this entry


 WordPress Hacks: Techmeme River of News Clone, Part 2

Submitted by Raj Dash on March 31, 2008 - 12:16am in

[Advanced users] To review, a river of news is a mashup of RSS feeds, arranged in (reverse) chronological order and presented on a web page. Normally, an RSS reader might suffice to monitor a blog niche, but my intent is to produce a Techmeme clone. A step in that direction is a Techmeme River clone, which is what this post is for. Either tool can be immensely useful if you want to keep on top of

Please review Part 1 of this mini-series, which goes over the basics of building a clone of Techmeme River. In that article, we produced an HTML badge that shows a block of headlines collated from multiple source feeds. The intent in this article is to present the headlines block in the content area of a blog instead of in the navigation column.

As with the previous article, I am not supplying 100% of the code, just the basics. This article, unlike the last, is intended for advanced WP users as a stepping stone for producing a Techmeme River clone that lives on its home page. If you're serious about building your own version, I'm assuming you will likely pursue your own development, based on what I discuss here. (If you simply need such a tool, I'm available for consulting.)

I've built a tool, RideSpottr, for monitoring automotive niche blogs, and I'll use it as an example below.

What You'll Need

Read the rest of this entry


 WordPress Hacks: Build a Techmeme River of News Clone, Part 1

Submitted by Raj Dash on March 28, 2008 - 3:22am in

[Intermediate users] If you've seen sites like Techmeme and Megite and find them handy, you might be wishing you had something similar for a specific niche. Techmeme's owners do have similar sites for specific niches (including politics, baseball, celeb gossip), but maybe you want something for a different niche. Since as a freelancer, I cover a number of niches on a regular basis, I've got my own personal dashboard tools for monitoring niches. But I've been on a quest to find/ build a generic tool similar to Techmeme/ Megite. Fortunately, you can produce something similar: a river of news. It doesn't offer the topical clustering that makes Techmeme and Megite so useful, but it's a start.

What's a River of News, and Why Use It?

Read the rest of this entry


 WordPress Hacks: Upgrading Versions

Submitted by Raj Dash on March 27, 2008 - 2:39am in

[Advanced users] Upgrading WordPress to a new version can be a pain in the behind. If you're like me, you might fear affecting the live site before ensuring that the latest WP will work with all your active WP plugins, not to mention your selected theme. If you are not an administrator but have some advanced WP skills, here's a "safe" approach to upgrading WordPress. (Warning: I have not yet used this approach, but it's technically sound. Only recommende for advanced advanced WP users.)

Read the rest of this entry


 WordPress Hacks: Build a Photo or Movie Poster Gallery

Submitted by Raj Dash on March 21, 2008 - 3:52am in



Use number #4 of my 48 Unique Ways to Use WordPress article was "image gallery/ photoblog". Item #29 was for a CSS or site awards gallery using a WordPress Gallery theme, such as the free one from OS Designer or the paid one from WP Designer. I know that OS Designer's theme can be used to build a photo or movie poster gallery, as I'll discuss shortly. I'm guessing that WP Designer's theme can be used as well.

The idea for this WordPress hack comes from Jason Schuller's visually impressive TrailerFlick site. Jason has hinted that he might someday release something similar. I couldn't wait, so I used OS Designer's gallery theme to build Posters@FilmScenic (which is still under development). That's a movie poster site, but I'm also planning to use the them to build up FotoFiler.com.

This hack is really quite easy, but there are a few things you should know.

Read the rest of this entry


 WordPress Hacks: Build a Web Directory

Submitted by Raj Dash on March 14, 2008 - 3:09am in

In the comments of 48 Unique Ways to Use WordPress, Michael Zebold asked about #47, using WordPress to build a web directory. There are actually a few ways to use WordPress to build a web directory, and I'll look at two. Please note that I'm only providing a light treatment; I've linked to a few articles if you want to learn more.

Using a WordPress Plugin

Earlier in the comments of "48 Unique Ways", commenter Sofimi pointed out the Link Directory Plugin. (The link in the comments redirects to a page on Alec Tang's site, so I've used that link instead.) This is one of two wordpress directory plugins that showed up numerous times in a Google search. (The rest of the results were articles pointing to either of the two plugins.)

Besides Alec Tang's WP-LD (WP Link Directory) plugin, there's also the WP-Directory plugin from Linksback.org. Neither one works in WP 2.3.2 (which is the only version I had time to test), but comments on various articles seem to indicate that both of them work (with earlier versions of WP).

The two plugins behave and display differently. If you're interested in trying out the WP-LD plugin you may want to read Sizlopedia's article, which expands a bit on the installation instructions. This plugin is a bit more complex than the Linksback.org's WP-D plugin, and the web directory will reside in a subdirectory of your blog called "directory/". (For the WP-D plugin, the directory resides on your home page.)

The result of the WP-LD plugin is more of a "link exchange" (for reciprocal linking) than a web directory, and has features that will help ensure that submitters are linking back to you. If they are not, the plugin will report their link to you.

Read the rest of this entry

Using a Gallery Theme


 WordPress Hacks: Adding TinyMCE Editor to the Prologue Theme

Submitted by Raj Dash on March 10, 2008 - 7:02am in

[UPDATED: Please see my first comment before reading.]

In 48 Unique Ways to Use WordPress, the Prologue WP theme figured very significantly in the examples. Prologue, if you're not familiar with it, gives WordPress users (both wordpress.com and self-hosted) Twitter-like microbloggging functionality. But out of the box, the theme has a very plain edit area (see image below), and adding links, images, etc., is tedious.

http://www.freediagrams.net/pix/performancing/prologue-add-tinymce/snap-filmscenic-no-tinymce-700w.jpg

Fortunately, there's a really easy fix to this problem: TinyMCE editor. TinyMCE is a Javascript-based freeware editor. If you have a recent version of WordPress, it's the default "visual" editor that you get in the admin panel. Thanks to its easy integration features, we can use this as a replacement to the default HTML message editor in the Prologue theme. And you won't believe how incredibly easy it is to hack it. I think it took me about 2 minutes, not including download and installation. I'm actually surprised that Automattic didn't do it themselves.

How to Install TinyMCE

Installing TinyMCE takes three simple steps:

Read the rest of this entry