Portfolio

After researching on how to build a memorable portfolio I focused on who I am as graphic and web designer and how to highlight my personal style.
Despite the importance of a user engaging “structure” I decided to use a very simple responsive WordPress layout: logo and navigation menu on top, descriptions on the left, works displayed in the middle and list of works on the right.
I will add an About page and a Blog page for sharing quick thoughts and images.

AF Logo (my initials)

WordPress Scripts

ADD POST META DESCRIPTIONS

Open the header.php file of your theme and copy and paste the code below to the space between the opening and closing tags.

<meta name="description" content="
 <?php if ( (is_home()) || (is_front_page()) ) {
 echo ('Your main description goes here');
 } elseif(is_category()) {
 echo category_description();
 } elseif(is_tag()) {
 echo '-tag archive page for this blog' . single_tag_title();
 } elseif(is_month()) {
 echo 'archive page for this blog' . the_time('F, Y');
 } else {
 echo get_post_meta($post->ID, "Metadescription", true);
 }?>">

REDIRECT 404 PAGES TO HOME PAGE

Copy the following snippet code to the .htacess file to redirect the 404 error pages to your home page.

< IfModule mod_alias.c >
RedirectMatch 301 ^/search/$ http://your-site.com/
RedirectMatch 301 ^/tag/$ http://your-site.com/
RedirectMatch 301 ^/category/$ http://your-site.com/
< /IfModule >

DISPLAY SIMILAR POSTS WITHOUT PLUGINS

Copy and paste it to the functions.php file.

<?php
 //for use in the loop, list 5 post titles related to first tag on
 //current post
 $tags = wp_get_post_tags($post->ID);
 if ($tags) {
 echo 'Related Posts';
 $first_tag = $tags[0]->term_id;
 $args=array(
 'tag__in' => array($first_tag),
 'post__not_in' => array($post->ID),
 'showposts'=>5,
 'caller_get_posts'=>1
 );
 $my_query = new WP_Query($args);
 if( $my_query->have_posts() ) {
 while ($my_query->have_posts()) : $my_query->the_post(); ?>
 <p><a href="<?php the_permalink() ?>" rel="bookmark" title="
 Permanent Link to <?php the_title_attribute(); ?>">
 <?php the_title(); ?></a></p>
 <?php
 endwhile;
 }
 }
 ?>

DISPLAY NUMBER OF FACEBOOK FANS

Replace your current page ID with your personal Facebook page id

<?php
 $page_id = "YOUR PAGE-ID";
 $xml = @simplexml_load_file("http://api.facebook.com/restserver.php?method=facebook.fql.query&query=SELECT%20fan_count%20FROM%20page%20WHERE%20page_id=".$page_id."") or die ("a lot");
 $fans = $xml->page->fan_count;
 echo $fans;
 ?>

CREATE CUSTOM WIDGETS

Copy and paste the following code into your functions.php file.

class My_Widget extends WP_Widget {
 function My_Widget() {
 parent::WP_Widget(false, 'Our Test Widget');
 }
 function form($instance) {
 // outputs the options form on admin
 }
 function update($new_instance, $old_instance) {
 // processes widget options to be saved
 return $new_instance;
 }
 function widget($args, $instance) {
 // outputs the content of the widget
 }
 }
 register_widget('My_Widget');

DISPLAY GOOGLE USERS’ SEARCH TERMS

Paste the following code outside the header section.

<?php
 $refer = $_SERVER["HTTP_REFERER"];
 if (strpos($refer, "google")) {
 $refer_string = parse_url($refer, PHP_URL_QUERY);
 parse_str($refer_string, $vars);
 $search_terms = $vars['q'];
 echo 'Welcome Google visitor! You searched for the following terms to get here: ';
 echo $search_terms;
 };
 ?>

Research

I have been reading a lot of articles about tips for building a portfolio site that stands out from the crowd and as you can expect is not easy at all.
One might think that is all about showing your skills by showing your works, but that is a big mistake. I wish it was that simple and I really think it should be that simple. Once again the art of selling yourself is requested (I will always fail on this I’m afraid)’cause a portfolio is not a box containing your best works, is one of the most important pieces in itself. It must be original and new, showing your creativity but also following some essential rules.

Philosophy:

A lot of people advise “do not copy”, which is something I do not fully understand. I think a better advise is to be yourself and if you are coping do it your way or at least make sure that the result is better than the original.

Technics:

Your logo or your name on the top left.
Tagline summarising what you do (I do not particularly like it, but I admit is very effective).
High quality images (Screenshots must be linked to the live version) and live examples.
Offer your services clearly.
The “About me” section can help, users can form a bond and build trust with you.
Contact information easy to access.
Use social networks and update your blog possibly inherent to your job.
Each page should have a call to action, a “next step”.