Website for Earth Treasure Vase
For Thanksgiving Day 2009, the official website for the Earth Treasure Vase Global Healing Project was completed and published. Visit EarthTreasureVase.org to see how this interesting and profound spiritual practice was illuminated using an unusual circular introductory video and an interactive geo-tagged google map.
This site is 100% WordPress powered, meaning that as new Earth Treasure Vases are buried, the client can edit the content, photos, videos etc. without assistance.
www.EarthTreasureVase.org
Website for “under the rose”
Today I designed and donated a simple website to launch under the rose, an album featuring master oud player Rajim AlHaj and nouveau flamenco pioneer Ottmar Liebert. The musicians who recorded this album are giving it away for free in support of Direct Aid Iraq.
Click above to listen to under the rose
Website for Green Psychology
This website was designed for Jake and Hannah Eagle, co-founders of Green Psychology™. The content management system for this site is based on WordPress so that the client can easily update web pages, articles, and hosted discussions.
www.GreenPsychology.net
How to search for ‘backdoors’ in a hacked WordPress site
If your WordPress site has been hacked, then you’ve probably already been advised to:
- Backup your WordPress database and wp-content directory
- Reinstall WordPress from scratch (the latest version, of course)
- Restore your database and wp-content directory
Next, you need to make sure there are no ‘backdoors’ installed in your wp-content directory. Here are a couple of tips. They all require that you have shell (SSH) access to your server, and at least a little familiarity with the command line.
If a backdoor has been installed on your site, it is almost certainly located in your wp-content directory. The reasoning behind this is that once you discover that your site has been hacked, you will most likely wipe out every single file on your server except for your wp-content directory, where your uploads, plugins, and themes are installed.
Begin your investigation by logging into your website via SSH and changing to your wp-content directory:
cd ~/public_html/wp-content
Here’s what to do next:
1. Search wp-content for every instance of an ‘eval’ command
grep -R eval * | more
A number of plugins have legitimate uses of the eval command but if you see anything like this (especially at the very top of a .php file) OR if you see an eval anywhere in your uploads or themes directories, then you should be suspicious. And if the contents of the eval command are hidden inside of a base64_decode and/or gzinflate command like you see in the example below, then you’re definitely looking at a backdoor.
Actual example of backdoor hack inserted into the PodPress plugin
Really, the best thing to do regarding plugins is to delete your plugins directory, and reinstall your plugins from scratch.
2. Search the uploads directory for any .php files
find uploads -name "*.php" -print
There is absolutely no reason for a .php file to be living in your uploads directory. Delete any you find.
.php files should not be in your uploads directory
3. Delete any inactive themes
Backdoors may have been installed in your unused themes so delete those, including the wordpress ‘default’ and ‘classic’ themes.
If you have a local copy of your theme, delete your themes directory altogether and re-upload your theme anew.
4. Investigate all recently modified files
While it’s possible to fake the modification time of files, many hackers won’t bother. What this means is that many backdoor exploits will have a timestamp that sets them apart from your regular files. In most cases, I advise running the following command from your html root directory (usually “public_html” or “www”):
find . -mtime -10 -print
Replace 10 with however many days you want to look back. I advise going back at least 14 days beyond when you are certain your site was hacked, since a vulnerable site may be compromised multiple times in the same time period.
What you are looking for is any files that you don’t remember uploading or updating (e.g. the footer.php file in your theme) or anything like what is described above (e.g. a PHP file living in your wp-content/uploads directory, or your wp-config.php file, where exploits are often inserted).
5. Scan your WordPress database for exploits and spam
Exploits such as rogue PHP functions and new administrative accounts may live in your database, as well as spam (e.g. hidden ads for pharmaceuticals). If you’re not experienced with digging through your SQL tables with a tool like phpMyAdmin, then you will have to rely on plugins like this one.
6. Erase and re-create your .htaccess file!
In 2011, for the first time I found a WordPress hack that was completely outside of the WordPress install. This meant that even a completely clean WP install (with no themes, no content, etc.) would still contain the hack. The magic was in a couple of nefarious ‘RewriteRules’ added to the main .htaccess file that routed all traffic to the site through an innocuously named “images.php” file.
The safest route is to delete your .htaccess file (after taking note of any additions you’ve put in there like 301 redirects) and then go to WordPress Settings:Permalinks to recreate your .htaccess file anew.
7. Visit your site using a ‘google’ user agent
The .htaccess hack described above was re-writing the HTML for any page on-the-fly to insert spam links, but only if the visitor was the ‘bot’ responsible for populating Google’s search results. This meant you could only see the spam links in Google search results. If you looked at the same page using Firefox, your page and source code looked fine. To make sure that Google is seeing the same thing that you are, figure out how to change your user agent on your browser, otherwise your site may still be hacked.
Tutorial: How to wrap text around an image in Photoshop (Video)
Wrapping text around objects
I just recorded a quick screencast video tutorial for a colleague on how to use paths or shapes to wrap text to avoid objects or circumscribe shapes (circles, etc.) using Photoshop. This is something more often done in Illustrator, but PS does the job pretty well too.
When mocking up websites in Photoshop, this is a great way to illustrate how text will flow around an inline image.
(Click here to watch. 1 min 35 sec)
Help for “bablooO” hacked / attacked WordPress Sites
Hopefully, this information will be of use to some people out there who are unlucky enough to be hit by the “bablooO” wordpress security exploit. I believe this hack can impact anyone using WordPress version 2.8.0 and earlier. See this recent advisory, which I believe is related.
If you do a ‘view source’ on your WordPress blog and you see a bunch of spammy links beginning with the comment code:
<!-- bablooO-start -->
…then here are some tips for how to recover from this problem:
- Make sure your theme is okay. If you have a backup of your theme, restore your theme from backup as your theme files themselves may have been molested. In this particular exploit, footer.php may have been rewritten.
- Don’t trust your WordPress installation. The actual core files may include injection code / backdoors. (wp-blog-header.php for example may have an obfuscated ob_start();eval(base64_decode()) call in it. The safest thing to do is:
- backup your wp-content directory and your WordPress database
- wipe out your entire installation
- reinstall the latest version WordPress from scratch
- restore your wp-content directory and database, and then examine both for any suspicious content. Here are some critical tips on how to search your wp-content directory for “backdoors”.
- Make sure your database is okay (posts/pages). One tip I read about here is to use the export function (under the WordPress admin Tools menu) to save a giant XML file of all your posts/pages/comments to disk, and then you can use a text editor to search for strings like ‘viagra’ and ‘casino’ — two words which probably do not appear on your own blog, but are very likely to appear in the hidden content of these spammy links. You will have to fix these by hand.
- Password-protect your admin directory using the .htaccess method to protect yourself from similar future exploits.
Related discussions:
http://ckon.wordpress.com/2009/06/05/bablooo-spammer-attack-on-several-wp-blogs/
http://wordpress.org/support/topic/280748
http://milw0rm.com/exploits/9110
How to remove ‘Web Hosting Provided by Bluehost.com’ WordPress footer
The Culprit
Recently bluehost made an update to their “SimpleScripts” installer so that when you install WordPress, no matter what theme you’re using, your site gets a “Web Hosting Provided by Bluehost.com” footer advertisement.
This can be pretty aggravating at first, especially since it seems like the only way to remove the promotional message is by commenting out the wp_footer() call in your theme. (Bad idea, will break some plugins.)
Fortunately, the fix is pretty easy once you know where to look:
- Go into your WordPress admin page
- Click plugins from the sidebar
- Deactivate “SimpleScripts Footer“
Shame on BlueHost for (a) forcing its clients to switch to SimpleScripts by not providing WP updates via Fantastico anymore, and (b) automatically installing and activating a plugin that ads a promotional message on the websites of paying customers.
Using free WordPress templates for fast & affordable redesigns
Here are two beautiful, highly functional, self-editable websites that were launched on shoestring budgets by making good use of off-the-shelf WordPress templates:
Deva Foundation
www.deva.org
I started off with this freely available WP theme. Then my client found a nice stock image of clouds on iStockPhoto.com that I converted into an ephemeral background. Finally, I popped in a new header graphic, improved the font styling (and IE compatibility) and integrated iContact for email newsletter signups and and PayPal for ecommerce.
Ta-da! Deva Foundation’s brand new site was completed in less than 20 hours, from concept to completion.
Maria Benitez
www.MariaBenitez.com
This website for the legendary Santa Fe flamenco dancer Maria Benitez was completed in even less time by taking advantage of the excellent — and freely available – “Yoghourt” WordPress theme.
Strip www off URLs at GoDaddy using .htaccess mod_rewrite
Here’s how to remove the www. from your domain name so that Google won’t “split” your pagerank as a result of some inbound links going to www.foo.com and others going to foo.com. (Google will see this as two separate sites.) This tip is tuned to work at GoDaddy, where using mod_rewrite can be a real pain because GoDaddy has some unfortunate default Apache settings that prevent ordinary rewrites from working properly out-of-the-box.
Add these lines to the top of your .htaccess file:
# Override GoDaddy defaults that inhibit URL rewriting
Options -MultiViews
rewriteEngine On
# Rewrite URLs to remove www from domain name
RewriteCond %{HTTP_HOST} ^www\.(.*)$ [NC]
RewriteRule ^(.*)$ http://%1/$1 [R=301,L]
Olympus E-620 Noise Reduction and Gradation (SAT)
So far I’m enjoying my new compact digial SLR, the Olympus E620, but I’m having a lot of trouble deciding whether or not to shoot JPGs with built-in noise reduction (NR) and/or “Gradation” (SAT) settings. Shadow Adjustment Technology is something I usually do in-computer instead of in-camera, using iPhoto and/or Photoshop’s shadow / highlight adjustments.
E-620 noise reduction / gradation test
I figure I’m not the only person out there with this quandary, especially as the E620 risks being a little noisy, and using SAT can make that noise really jump out at you… But then again, you get photos that are so usable right out of the camera. So I’ve published a webpage that makes it easy to compare how a couple of shots look different when taken with and without NR and SAT. You be the judge!
http://cantonbecker.com/olympus-e620-noise-and-gradation
“Narrowing down your design preferences”
CSS Zen Garden
Sometimes a tricky process during a website design or redesign project is to figure out what kind of a general look and feel the client wants for the new site. Asking a client to “just go find some sites you like and send me the links” is a bit like asking “just go find some stars in the sky you like and point them out to me.”
Introducing an old favorite of mine: CSS Zen Garden. It’s great when a client can visit this site and send back links to two or three designs that feel right for the project we’re working on together. The CSS Zen Garden is also a superb place to demonstrate how form and content can be separated from one another. A properly built website will have the ability to change form at a later date with a minimum penalty, i.e. having to rebuild content.
Flash Site for GCI
Working from Illustrator mockups (graphic design by avantgarde) this 100% Flash site was built with gorgeous full-screen portfolios, custom text and photo scrolling classes and efficient loading / pre-loading behaviors.
www.gci-sf.com
GCI is a succesful San Francisco based commercial contracting / construction management firm.
“What makes a great newsletter?”
Click to see the whole newsletter
Here’s an example of a really super email newsletter. Even if you’re not a Yogi, it should be clear that this newsletter offers real value to its readers.
Here’s what makes it so great:
- It’s not too long: You don’t have to set aside a special time in the day to read the whole thing. It’s distraction friendly.
- The marketing ‘call-to-action‘ — the teaching schedule — is nicely separated out in the sidebar and highly visible, and it doesn’t overwhelm the newsletter with self-promotional material.
- The introduction is personal and friendly and is relevant to the intended audience.
- The cooking recipe at the bottom gives the newsletter real value. This is giving something away for free, and it’s a great incentive to keep visitors subscribed to the newsletter.
- The overall layout is easy on the eyes, and has a good balance of text to images.
Prototyping for PayPal
I really enjoy doing rapid prototyping, and from a business perspective there’s no better way to figure out how to bring a new product to market. This month, AnswerLab (San Francisco) hired me to produce web prototypes to test a new financial product for PayPal.
Here’s how this type of study works:
- Figure out what different messages or images you think might help to sell your product
- Produce a prototype (fake) website that simulates purchasing that product, with variations for each message or image you want to test
- Send users to test out each variant of the website
- Conduct statistical analysis of users’ browsing behaviors to figure out which variation produced the best results
“Agile design and just getting it out there”
This morning, a friend and client of mine emailed me regarding the work we’re doing to get his new website built:
I interest myself in how the structure of our site will influence our behavior … As the website design develops, so does my clarity. It’s obvious to me that “site review and evaluation” will be an opportunity for us to reflect on our goals … I mean that the site is, for me, kind of like a biofeedback device that informs me about myself and helps me develop my goals. At least that’s how it feels at this stage in the process.
This is a great reflection on how the actual process of making a website helps to make more concrete the actual project or work that the website is supposed to communicate. This kind of thinking caused a seismic shift in the philosophy of webdesign and web programming a couple of years ago. It’s called “agile design” and I think it’s fascinating.
The basic idea behind agile design is that you minimize the amount of forethought and planning on paper, and instead take advantage of technologies that let you easily update the website once someone has actually clicked through the Real Thing.
Before agile development we said to our clients: “Get it right on paper, or else we’ll bill you astronomical fees for change-orders.” Now we say: “Let’s just get the basic sketch online, play with it, and then keep tweaking things until it feels right.”
This is one of the reasons I build a lot of sites for my clients using WordPress. It means that we can change our minds about lots of things — even the fundamental look and feel — without having to build everything over again from scratch.
Next Page »