Archive for March, 2008

Disabling right-click save on your blog images

Monday, March 31st, 2008

One thing I get asked about fairly frequently is how to disable people from right-clicking and saving images from our blogs. After all, we post pretty big pictures that we’re hoping to get paid for, rather than having uncle Bob steal them off of our website and make a bunch of prints at WalMart.

The good news is, it is pretty easy to disable right-clicking for all your images in ProPhoto (or any other WordPress Theme for that matter).

To do it, just do the following: In your WP Admin panel, go to “Design” (called “Presentation” in WP 2.3.3 and earlier) –> “Theme Editor.” Then click on the file “Header” (or, header.php). Then look for this line of code:

<body class="<?php sandbox_body_class() ?>">

Delete that line and replace it with this line:

<body class="<?php sandbox_body_class() ?>" oncontextmenu="return false" ondragstart="return false" onselectstart="return false">

Click to save your changes, and that should do it. This will disable people from right-clicking and saving any images, and dragging images off of your blog onto their computer. Unfortunatley, it will not prevent them from taking screen-captures of your images–but most people don’t know how to do this. This technique will probably stop 90% of the theft from your blogs.

Was this helpful? Let me know by commenting!

Bugfix: Bold and Italic styles not working

Thursday, March 27th, 2008

Shannon pointed out to me the other day that when you use the bold or italics from within the visual editor, they weren’t showing up as such when viewed in the blog.

To fix it, open up “Design” (”Presentation” if you’re on WP 2.3.3 or earlier) –> “Theme Editor” and open up the “Stylesheet” (style.css). Then, scroll down to the very bottom, and add a new line by pressing return. Then paste in these lines.

strong {
font-weight:700;
}
em {
font-style: italic;
}

Click to update the file, and you should be fine.

RSS in plain english

Saturday, March 22nd, 2008

This blog is going to become the central place for tips, bug fixes, advanced customization videos, and lots more. So, I want to make sure none of you miss any of these posts. If you don’t already use RSS to subscribe to blogs rather than having to check them all the time, you really ought to consider it. My blog feed is here, or just paste the blog address into your reader of choice. If you’re still a little fuzzy on RSS and RSS readers, watch this sweet video:

Bugfix: picture max-width issue in WP 2.5

Thursday, March 20th, 2008

If you’ve already upgraded to WordPress 2.5, you may have noticed a problem inserting pictures into your posts: WordPress keeps shrinking them, even if you click on the “insert full size” button

Well, after a little digging, I found out why this is happening. WordPress 2.5 has a new bug i mean feature that makes the default max-width of pictures 500px.

Luckily, the fix is pretty easy. All we have to do is edit a ProPhoto template file to communicate to WP 2.5 that we want to have a different max width. To do so. Go to the “Design” tab in your WP Admin area, and click on “Theme Editor.” Then, select the file called “Theme Functions (functions.php)”. Scroll all the way to the bottom and press return/enter to add a new line and paste in this:

<?php $content_width = 900 ?>

NOTE: It is extremely important that you copy ONLY the code shown above, and not any extra spaces after the last “>” character.  If you leave any extra spaces, it will break your blog.  When you paste in this line, go to the very end of the file and press delete until you are positive there are not extra spaces.

Click “Update File” and you’re good to go.

If you’ve got WordPress 2.5 and you’re not having this issue, you probably downloaded ProPhoto after I added this line to the download file, so you’re all set. But, if you’re still using 2.3.3, when you eventually do upgrade to 2.5, you’ll need to perform this fix. Unless, that is, WordPress decides to remove this silly feature in 2.5.1.

If you want to read the WordPress support thread about this, click here.

How do I create 980 x 250 px images for the header?

Saturday, March 1st, 2008

Some people get confused when trying to create images that are 980 pixels wide by 250 pixels high for the header area masthead or Flashfader images.

One common thing I hear is that people can’t figure out how to get them sized that way, because whenever they try to set one of the dimensions, it screws up the other dimension.

Basically, you’re not just resizing when you’re trying to make images into these dimensions, you’re cropping.  If you try to just resize and leave the box “constrain proportions” checked, you’ll never get it to work, because most photos are a 2:3 ratio, and 980×250 is a different ratio.

So, if you’re trying to make a single image into a header image, I would recommend FIRST just resizing the image so that the width is 980px and let the height be whatever it will be.  THEN use the crop tool to crop out a 250px tall section of the image.  Here’s what the crop tool looks like in Photoshop:

This will create a very “panoramic” look, and can be quite cool. You get some unique crops when doing this, like below, from Joel Llacar’s website:

Or, if you want to make a collage-type multiple-images-in-one-image look, then resize a bunch of images to 250px tall and let their width be whatever.  Then create a new file in Photoshop with the dimensions of 980×250px, and copy those image into it and play around with it in there.

Below is an example of such an image I created in Photoshop.  Click on it to view and/or download the full-sized version.  You can see that even though it looks like one image, it is actually several images made into one.

Some people get confused when trying to get their Flashfader to look like this and think they can upload a bunch of little images of varying widths, but you can’t.  You have to create composite images out of the small images first, like the one shown above, with the exact dimensions of 980px by 250px.