Skip to the content

Error! Your browser is IE 6.0, released in 2001. It is not secure and lacks today's features.
Upgrade to a modern browser. You'll be a happier and safer surfer.

Client login for Goldman Design Close

How To Create This Wordpress Portfolio Site

Introduction – Core Technologies & Design Outline

About once month we’re going to pull back the curtain and show you how this site was built. We’ll cover the design ideas, CSS techniques, the CMS and some basic PHP.

Outline of Topics We’ll Cover

  • WordPress Portfolio Theme
    • Concept
    • Creating Custom Meta Fields
    • Home Page jQuery Cycle Plugin and Indicating which portfolio items show
    • Portfolio List Page (thumbnails of all portfolio items)
    • Portfolio Detail Page
    • jQuery .after and math rounding for the advance button
    • Resolving “current_item” issues in the sub nav
  • Design Concepts
    • Why the big images?
    • Why the #eee background?
    • De-cluttering, less it not easier
    • How target audience guides web design
  • Accessibility and SEO
    • How are SEO and accessibility tied to each other?
    • Why Lists?
    • Separation of HTML (structure) and style (CSS)
    • The All In One SEO Plugin
    • The Google Keyword Tool and Copy Writing
    • Permalinks – SEO Friendly URLS in WordPress
    • Headings
    • Miscellany
  • Main Menu CSS Sprite Techniques
    • The Photoshop File
    • The jQuery
    • The WordPress Tags
  • Main Sub Menu Sliding Doors CSS Technique
    • The Photoshop File
    • The jQuery
    • The WordPress Tags
  • Side Menu CSS Sprite Technique
    • The Photoshop File
    • The jQuery
    • The WordPress Tags
  • Price Quote Request Hover Animation
  • Performance, Optimization and Standards
    • PNGout
    • WP-Super Cache
    • .HTACCESS
    • YSlow
    • Disabling wpautop
  • Client Login
  • Testimonial jQuery Tabs
  • Google Analytic Goal Tracking and the Contact Form 7 WordPress Plugin
  • How to get a A/99 Yslow score

The core technologies used on this WordPress Portfolio Site:

  • Reliable Shared Hosting
    Media Temple hosts websites. Big and Small. For years Media Temple has taken complex technology and simplified it for the everyday website owner. Their products are designed to be powerful, affordable and relevant.
  • WordPress
    WordPress is a state-of-the-art publishing platform with a focus on aesthetics, web standards, and usability. WordPress is both free and priceless at the same time. Big sites like CNN and Ford use WordPress. Small sites like use it too.
  • jQuery
    jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.
  • SQLyog
    SQLyog MySQL GUI is the most powerful MySQL manager and admin tool, combining the features of MySQL Query Browser, Administrator, phpMyAdmin and various other MySQL Front Ends and MySQL GUI tools in a single intuitive interface. We may or may not dive into SQLyog. I find it much more quick and useful than MyPHPAdmin for daily MySQL tasks and maintenance. In fact, we use SQLyog daily!

WordPress Plugins Used in This WordPress Portfolio Theme:

  • All In One SEO Pack
    Essential for control of page titles and meta descriptions.
  • Contact Form 7
    Remember PHP Phorm? This plugin puts it to shame. Its just sooo simple to use. We’ll cover how to capture Google analytic goals when in AJAX mode when we get to this in a later post.
  • Really Simple CAPTCHA
    This plugin works in tandem with Contact Form 7
  • WP-Syntax
    A simple syntax highlighter.
  • WP Super Cache
    Frustrated by low Yslow scores and a slow site? We’ll take a look at WP Super Cache and some other .HTACCESS tricks to speed things up.
  • WP No Category Base
    This plugin simply removes ‘/category’ from your category permalinks.
  • Google XML Sitemaps
    This plugin generates a sitemaps.org compatible sitemap of your WordPress blog which is supported by Ask.com, Google, MSN Search and YAHOO. Nice!