ProPhoto - Premium Wordpress Theme for Professional Photographers - Single Column, big pictures - Blog Template

I get lots of emails that basically say this:  my comments aren’t working, people can’t leave comments unless they visit the single-page permalink for the post.  If you’re having this problem, your comment area probably looks like this:

You can see how many comments there are, but there are no links to add a comment or show comments, just a lonely pipe line-thingy floating out in the breeze.

Fixing this is super simple.  It is caused by skipping a step in the installation.  This is what happens when you forget to activate and tweak the Ajaxed-Wordpress plugin which allows for the inline comments on the main pages.

To fix it, go back to this section of the tutorials, watch the video and carefully follow the instructions and your comments will work just fine.

Someone just emailed me and asked how she would center her post-titles. I thought it was a good question, so I’m sharing the answer with all of you.

If you want to center your post-titles and post-dates, so they look like this:

Just open up your “Stylesheet (style.css)” with your Theme Editor (under the Design tab) and add a line at the bottom and paste in this code:

h2.entry-title, h3.entry-title, div.entry-date { /* center post titles & dates */
text-align:center;
}

If you only want the title centered and not the date, change it to this:

h2.entry-title, h3.entry-title { /* center post titles */
text-align:center;
}

Click update file and you’re set!

I’ve been asked a couple times how to force ProPhoto to show full posts when people visit your archive or category pages. Right now, the default for ProPhoto is to show excerpts of the posts in the category and archive pages. So, when a user clicks on an archive month, this is what they see:

If you want to change this so that the full posts are seen, in your WP Admin area, you’ll need to go to your “Design” tab (”Presentation” in WP 2.3.3 and earlier) and select “Theme Editor.” Then choose the file called “Archive (archive.php)” to edit it. (NOTE: don’t get confused with the file called “Archive (archives.php)” - they are named almost exactly the same - you want the one that is not plural.) In that file, look for a line that says:

<?php the_excerpt(''.__('Read More <span class="meta-nav">&raquo;</span>', 'ProPhoto').'') ?>

Delete it and then paste in this line:

<?php the_content() ?>

Click “update file” to save your changes and then check your work.

You can also do this with your category pages as well. Just open up the file “Category Template (category.php)” and do the same edit.

A word of caution, however. The ProPhoto theme was built to display excerpts only on these pages for a reason. That reason is to avoid ‘duplicate content,’ which search engines don’t like, and which can get you a small penalty in Google and other search engines. Basically, the issue is, search engines don’t like it when websites have multiple pages with exactly the same content. That seems spammy to them, because a lot of spammy websites have hundreds of pages of duplicate, computer-generated content. When you leave your full posts open on your category and archive pages, you end up with a good deal of duplicate content, because your posts may be shown in full in 4 or more pages: your home page (or paged interior pages), your single post permalink page, your category page, and your archive page. This is why a lot of WordPress themes excerpt posts on archive and category pages. It is also why lots of blogs even excerpt posts on their home page.

Technically, the best search engine friendly way to do things is to have only your single-page permalink post page show the entire post, and have every other place show an excerpt. Now, that’s a little extreme, so ProPhoto was built to be a compromise between what’s good for your readers and what is good for the search engine robots. You’re more than welcome to change your archive and category pages to show the full post, just do it with the awareness that there is search engine optimization tradeoff. At the end of the day, most people’s blogs are for people and not search engine robots, so you may decide that ease-of-use for your readers is more important. I just thought you might like to know why the theme (and many themes) are built that way.

Some people have asked me about where and how to find good background images for their blogs. Here’s a couple thoughts:

This website: http://squidfingers.com/patterns/ has a bunch of cool backgrounds that are free to download. They are all small, lightweight, tiling GIFs, which are perfect for blog backgrounds, because they follow the guidelines of my #1 all-time blog tip.

This website, which I just found, is also pretty sweet.  Maybe better than that last one.

Another place you might check is http://www.sxc.hu/. That’s where I found the cool paisley background for my wife’s blog, although I had to pay a buck for it. I found it by searching for “paisley.”

To add a background image to your ProPhoto blog, save your background image as “bg.gif” and upload it into the “images” folder of the “prophoto” theme folder, overwriting the existing “bg.gif” file.  If you are using a “.jpg” instead of a “.gif” for your background image , you’ll need to modify line 29 of the “Stylesheet” (style.css) so that it says “bg.jpg” instead of “bg.gif.”

Finally, I was hoping some of you knew of some additional resources. Where do you find cool free or cheap backgrounds? Post them in the comments so we can all benefit. Thanks!

[Note: you might also want to read this post, about the problem where your image upload box freezes and turns white, not allowing you to insert images.]

Hey all, I thought I’d quick post because some people have been having trouble with the image uploader feature of WordPress 2.5. These issues seem to be mostly experienced by those using PC’s and Internet Explorer. Often, using FireFox instead is enough to get it working. If not, you may want to read this thread and try some of the things they recommend.

http://wordpress.org/support/topic/164999

Hopefully WordPress will have this resolved when they release 2.5.1 in a few weeks. If you use a PC and haven’t upgraded yet, this is probably a good reason to wait.

By the way, this is a WordPress problem, and not a ProPhoto problem, so I can’t provide support for you if you’re having trouble. WordPress is an open-source platform used by millions, so there are lots of resources out there. If you’re having trouble, try googling your problem (if you’re getting an error message, try googling the exact error message) or visit the WordPress support forum:

http://wordpress.org/support/

One thing I’ve been asked a few times is: how do I replace the default dotted line separating posts with a custom image that matches my branding? Like Shari’s blog, for instance, shown below:

Well, here’s how:

Step 1: Upload an image for your separator, it should be no wider than 900px, into your prophoto/images folder. Use an FTP program or your web-based file manager utility. Note carefully the name and spelling of your image, and it is case sensitive.

Step 2: in your WP Admin area, go to “Design” (”Presentation” in WP 2.3 and earlier) and click on “Stylesheet (style.css)”. (It might be a good idea to copy the whole file and paste it into TextEdit (Mac) or WordPad (PC) first as a backup in case you mess something up.) Then scroll down to line 346 to this chunk of code:

.meta-inner {
margin: 0;
padding: 0 0 25px 0;
border-bottom:1px dotted #CCCCCC;
}

Delete that chunk and replace it with this:

.meta-inner {
margin: 0px 0px 1px 0px;
padding: 0 0 85px 0;
background: url(images/myFile.jpg) no-repeat center bottom;
}

Except put your own file name and extension (.jpg,.gif, or .png). Then, just fiddle with the bottom padding (”85px” on the third line) until it looks right–this will probably need to be at least as many pixels as your image is tall. You may want to add some margin below the image as well, which you can do by fiddling with the “1px” on the second line.

I get asked a lot how to change the background color of the blog’s body.  So often in fact, that in the next minor release I’m going to feature this CSS rule much more prominently in the simple edits area and in the tutorials.  But for now, I’ll address it here and point people to this post.

If you want to change the background of the body portion of your blog, say you want to turn it black, like Frank’s blog, open up your Theme Editor under the “Design” tab (”Presentation in WP 2.3.3 and earlier) of your WP Admin area. Click to edit the “Stylesheet (style.css).”  

Scroll down to line 153 where you will see this:

#wrapper {
 width: 980px;
 margin: 0 auto;
 background-color: #FFF;
}

Just change “#FFF;” to the six-digit color code of your choice, and you’re all set.

Furthermore, if you wanted to change just the background of the header area next to the logo to be something unique and different by itself, scroll down just a bit further and look for this bit of code:

#header {
 height: 108px;
}

Between the two brackets add a line to specify a background color of your choice, like so:

#header {
 height: 108px;
  background: #000000;
}

Click to update your changes and you should be golden.

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!

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.

One of the great things about switching to WordPress is that you can very easily import your old blogs. This post will cover how to import blogs from three platforms: Blogger (blogspot), TypePad, and WordPress.com. Together, these three types of blogs probably make up 95% of the blogs that people want to import into self-hosted WordPress blogs.

NOTE: after successfully importing an old blog, DO NOT delete that old blog. Just let it sit there. Your photos from your old blog are not actually moved over to your new blog, they are simply referenced by your new blog and must be left in place to display correctly.

For all three types, you start by going to “Manage” –> “Import” in your WP Admin area, which looks like this:

Importing a Blogger Blog:

If the blog you are importing is a blogger blog (i.e., ends with a .blogspot.com), follow these steps. (NOTE: if you have a blogger blog that was set up to publish via FTP or SFTP (fairly uncommon), see this post for info on how to get it imported.)

1. Open up your blog’s WordPress Admin area, and go to “Manage” –> “Import.”
2. Next, open another tab of your browser, or a new browser window, log in to your Blogger account. Make sure you are logged in and not just visiting your blogger blog.
3. Then, go back to your WordPress Admin area and click on the “Blogger” link, then click “Authorize.”
4. If you did step 2 right, you should see a screen that looks like this:
5. Click to grant access, and then you will be able to click an “import” button for the blog you want to import, shown below:
6. When it is done importing, the “Magic Button” will change to saying “Set Authors.” Click it and map your blogger users to WordPress users. If you haven’t created any WordPress Users except the default “admin” you can navigate away from this page and click on “users” in the upper right of your screen, create some users and come back to this screen to map them correctly. That’s it. You’re done!

Importing a TypePad (Movable Type) Blog:

I’ve only done this a handful of times, and I don’t have a TypePad account that I have access to so that I can take screenshots, so I’ll have to do this section from memory. As I recall, the steps are:

1. Login to your TypePad blog admin area. There should be an option somewhere that says “Export.” Click it and download the file it creates.
2. Then, rename the download file “mt-export.txt”
3. Next, in your WordPress blog’s admin area, go to “Manage” –> “Import” and click on the link that says “Moveable Type and TypePad”.
4. In the next screen, click on the “browse” button and locate the “mt-export.txt” file.
5. Click on “upload file and import.”
6. The rest should be simple

NOTE: I have noticed that imported TypePad blogs occasionally display weird behavior in ProPhoto WordPress blogs, where instead of showing full posts on the homepage, they only show excerpts. To fix this, in your WP Admin area, click on “Design” –> “AWP Managment”. Then click on the “Posts & Pages” module, and disable inline posts. Scroll down to save your changes, and your posts should now display in full.

Importing a WordPress.com Blog:

If you have a free blog through WordPress.com and are switching to a self-hosted WordPress installation on your own domain and webhost, the steps to import are pretty simple.

1. First, log into your old WordPress.com blog admin area and click on “Manage” –> “Export” and then click on “Download Export File.”
2. Next, log into your new, self-hosted WordPress blog, and click on “Manage” –> “Import”. Click on browse and locate the file you just downloaded, and then click “Upload file and import.”
3. Finally, map your old users to existing users in your new blog or create new users to map to and click submit.