I just completed building a complex site in WordPress in which I combined two Blogger blogs — each with several years worth of posts — with a website that contained two existing MySQL databases of painting images and art quotes.  It is now a 212-page art portfolio site and blog, with many images of paintings, many photos, some color exercises, and a lot of postings and notes.  So it was a lot of content to gather together, organize and combine into an attractive and easily navigable site.

I spent a lot of time trying out various options and a lot of different plugins. The ones listed below are the top 20 plugins that I found nearly indispensable for this particular site, which you can see in action here: Marilyn Fenn Studio.  As always, your mileage may vary.

1. WP CSS Dropdown Menu
   A three-level drop-down menu plugin for WordPress.  It uses Stu Nicholl’s final drop-down code, which is CSS only.  You can modify the style to suit your theme, include a Home page button, and exclude pages from the drop-down menu.  I tried several other promising and not-so-promising options before finding this.  Eureka!
2. Reveal IDs for WP Admin
   In order to exclude pages in the above plugin, you need to know their IDs.  This plugin reveals IDs of pages, posts, tags, and categories, all of which I found very useful in creating the above site.
3. Flexi Pages Widget
   Allows you to choose which of your pages to display in the sidebar, whether to display sub-pages, and in what order to display the pages.
4. Different Posts Per Page
   This plugin allows you to return different numbers of posts per page type.  For example, you can show five, ten or all your posts on your Archive, Category and Tag pages, but limit them to 1 or 3 or 5 on your home page.
5. WP-PageNavi
   This gives you an attractive way to scroll through your post-pages, and really aids navigation, especially on a large site.  See the bottom of the home page on the afore-mentioned art site for an example.
6. AZIndex
   This plugin will create a very flexible site index for you with the greatest of ease.  Very nice when organizing a large amount of content, and it auto-updates when new content is added.  This is such a well-written plugin, and has the best documentation of any plugin I have tried, which I really appreciate!
7. NextGEN Gallery
   I’m sure this makes it to everyone’s list.  I did not use it on this, my design site, but found it great for my art site.  I used it to include a random gallery of paintings on my sidebar, to include thumbnails of related images in posts, and to create indices of paintings and photos.  I could have used it for my art galleries of thumbnails and large images, but did not in this case, as I have my own art image database which contains a bit more information than the NextGen plugin displays.  The developers continue to improve this plugin; they have recently added the ability to include titles.
8. Yet Another PhotoBlog
   This is a very cool plugin that allows you to insert an image once, and it will create different sized thumbnails to be displayed on different types of pages; for example, you can display small thumbnails of an image in the archive pages, another size on the home page, and another size on the individual post pages, and you can specify left or right display in all cases.  It only allows for the insertion of one image per post, but you can use the standard WordPress image upload tool to add additional images.
9. TS Custom Widgets
   This plugin allows you to include different sidebar widgets on different pages.  I found it very useful in many cases; for example, it gave me the ability to remove redundencies, such as an About Me box on the About page, or a random painting gallery on the painting gallery page, and to limit certain items to appropriate pages only, such as a blog roll only on the links page.
10. Simple Tags
    This is a very flexible and powerful little plugin for managing your tags.  It allows you to mass edit your tags, show related posts, create content-sensitive tag cloud widgets, and more.
11. Contact Form 7
    This is very nearly everything it needs to be.  This plugin allows you to create multiple instances of contact forms, using the standard form elements, and includes the ability to add a simple Captcha.  The documentation could use a little help; so you may need to read through some of the responses on the plugin homepage and do some trial and error to figure out just how it works, but once you get through that, it works like a charm.  You may also want the Really Simple CAPTCHA plugin from the same developer — it used to be included, but now it’s a separate element — or the more robust WP-reCAPTCHA that I’ve used on this site.
12. Subscribe2
    A very simple plugin that allows your readers to easily subscribe to or unsubscribe from your blog.  It sends an email notification to the list of subscribers when new entries are posted.  You can also exclude notices from being sent on selected posts and pages.
13. Sociable
    This is about the fourth social network plugin I have tried that automatically add links on your posts to your favorite social bookmarking sites.  It is very flexible and unobtrusive.  I did love the look of one called “Sexy Bookmarks,” but it caused my pages not to validate.  I am using AddThis Social Bookmarking Widget on this site, and it’s great, too.  But Sociable may offer the most flexibility in what bookmarking sites you can include, and I like the faded icons that come to life when moused over.
14. Feed Reading Blogroll
    One of the things I loved on my Blogger blog was the Blog List that showed the latest updated blogs you are following, compete with newest post title and a thumbnail.  I loved seeing my artist blogger friends’ latest images displayed.  I searched and searched for something like that for WordPress, and this plugin is the closest thing I could find.  It works well, is pretty easy to set up, but lacks the thumbnail display.  Using Feed Reading Blogroll along with Interclue enabled on Firefox, I can still see the latest paintings from my artist blog list.
15. Broken Link Checker
    This checks your posts for broken links and missing images and notifies you on the dashboard if any are found.  Very handy for keeping link-rot out of your blog.
16. Maintenance Mode
    This plugin will add a splash page to your blog to lets visitors know your blog is down for maintenance.  Yet you can continue to work on and view your blog as a logged in administrator.
17. DashBar
    This plugin adds a tiny logo in the upper corner, if you are logged in, with a two-level drop down menu bar that appears on mouseover.  It allows easy access to the dashboard or to add, edit or manage new posts/pages/links, and more.  I find it very, very handy, though the logout does not seem to work for me.
18. Akismet
    For keeping out the spam in your comments.  It seems to work very well.
19. StatPress Reloaded
    Excellent and very detailed stats displayed right in your WordPress dashboard.    You can export them out, too.
20. Google Analyticator
    Easy to use plugin for adding your Google analytics code to your WordPress blog.  Works very well.

OK, I just moved my newly designed Design site from a testing server to the real deal — right here!

I’ve tested and retested, and most of the bugs have been worked out.  (The previous post deals with the list of known issues, which I will fix if I find out how.)

I’ll miss my pretty little previous site, but it had no blog and the portfolio design was too complex to update very often.

So, welcome again, and if you see anything that looks amiss — especially if you have a fix for it — I’d love to hear from you.

Or — if you just like something about it and nothing is amiss, I’d really love to hear from you!

Or “Site Validates, but has Layout Problems.” Artist as Designer ready to throw in the towel! (almost…) Or just throw the towel.

In the previous post, I made reference to all hell breaking loose when you miss an opening or closing div.

Or maybe not. Last Wednesday, after a small struggle getting the footer to behave, I finally achieved what seemed to be success in parsing all the bits and pieces of the css and html to the proper php files, and my pages looked pretty good in most browsers. Not IE, of course, but isn’t that to be expected?

So I tested the pages in Firefox, Opera, Chrome, Safari, IE7, IE6, IE5.5 and even an old version of Netscape, and the layout was perfect in everything but the IE browsers, so surely I have all the right divs in all the right places, right?

It sure looked that way, so I kept working on the smaller details and finished finding and creating the desired size images for my portfolio pages, and put the three portfolio pages together. I wanted to hard-code the main content portion of these three pages, and find a way to incorporate the static center portion with my pre-existing dynamic header and footers. I kept reading, researching, trying things, (and even found a big list of premade gallery scripts one could use, but none were just what I wanted). Well, I was done with that part anyway. I never did find a way to accomplish the hard-coded static portfolio content with the dynamic header and footer, though, and finally decided to put that idea aside for now, and start focusing on completing all the other niggling tasks on my to-do-before-going-live list.

Two days of efforts later, and I try again to validate my pages. Almost all of them get the same 5 errors: it’s missing a closing div tag (and I’m guessing the rest of the errors are caused by that). So I start looking around at my various php pages again, and lo and behold, I didn’t close the right-side content column after the second sidebar, so I fix that, and now, the footer is out of place on every page in every browser!

So I took all the basic parts from all the php pages, fitted them together, removed the php code, added back in a few necessaries, and tested again, and now it totally validates, but the footer’s out of place!

Why exactly did I decide to get into coding websites, and specifically, why did I decide to create my new design in WordPress? I could have been painting! Argh!

Creating your own theme in WordPress can be a bit challenging — more so if you’ve had no previous experience with WordPress, and very little experience or true understanding of PHP.

I think I could have had my beautiful new website completed in about 2-3 days if I hadn’t decided to try to create it in WordPress. It only took me a day to come up with the visual design, and less than a day to code it in XHTML and CSS, and my design and pages validated at that time for both HTML and CSS. Admittedly, this was probably a bass-ackwards approach, but I started with what I knew, figuring I would figure out the WordPress stuff later.

And mostly, I have. Well, not like I could rewrite much more PHP code than a tiny expression or two, but at least I get the way WordPress breaks up the whole content and style across various parts that come together when the page is called. The header, the index page (and it’s work-alikes, such as the the archive page, the “page” page, etc.), the sidebar(s), and the footer get assembled with an external css file when the page is called, and together — with any images and database content — make up the complete page that is displayed. Your website consists of no html files — it’s all php files that may have some css and some html included within, plus the css stylesheet(s), images, and some javascript files. The content primarily resides in a database.

But the tricky part is that divs may begin in one php file and end in another, and if your content, style and code are fairly complex, you can get lost, and leave out a crucial beginning or ending div from the proper file, and then all hell breaks loose, position-wise!

Then, of course, there are the browser issues.

And finally, in my case, I knew I wanted a very specific style of css gallery for my design portfolio images, and had created it even before designing the visual look of my new site — and it’s simple in a way, but complex in another.

More details forthcoming later today.