Archive for the ‘Web Design’ Category

How To Move The Twenty Twelve Sidebar to the Left

moving sidebar in twenty tweve theme

The blue highlighted “right” is about to be changed to “left”

I have just installed Twenty Twelve as Magazine Basic is doing funny things with my image map. But there is GUI to modify the layout of the page. So I had to delve into the dreaded CSS stylesheet!

Fortunately moving the sidebar to the left is easy in the TwentyTwelve theme. Here’s how you do it:

  • Go to the theme editor, from Appearance > Editor select Style.css at the bottom (it is usually auto-selected).
  • Find the .site-content and .widget-area lines of CSS
  • Change the .site-content to float: right;
  • Change the .widget-area to float:left
  • Save it. Hey presto!

This will probably work in many other themes too.

 

WordPress – Display A List Of Latest Posts But Exclude Sticky Posts

Today I finally found a solution to a problem that has been bugging me for years. In WordPress, by default, lists of your latest posts display, as you can probably imagine, your latest posts. However, if you chose to make a post “sticky”, i.e. request that it appears at the top of your homepage, category pages and tag pages, it will also appear at the top of the recent / latest posts. By the time you have made 4-5 posts sticky (e.g. one of each of 5 different categories) your latest posts lists become eternally stuck in the past.

My workaround for a while was to first not make any posts sticky, and then later to restrict it to 3 posts and then display 8 “latest posts”, so that 5 new ones always show across the site. This still sucked a bit though as it meant that any regular readers will see the same top 3 posts (the stickies) and think that I have not published anything new.

The Solution

If there was a plugin I would have used it, but nobody else seems bothered enough about this to make one. So this is what you do.

If you list your latest posts in a text widget in the sidebar, download one of the plugins that allow PHP in text widgets. I use PHP Text Widget by Stefano Lissa. It is very simple, you just install it and then leave it. From then on PHP works in the standard WordPress text widgets. Some plugins provide a special widget for PHP, but I prefer this method.

Then, in your widget, throw in some code like this:

<h2>New Posts</h2>

<?php
$args = array(
‘category__in’ => array(),
‘showposts’ => 7,
‘post__not_in’ => get_option(‘sticky_posts’),
‘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;
} //if ($my_query)
wp_reset_query(); // Restore global post data stomped by the_post().
?>

The bit in bold is the clever bit. Do not ask me to explain it, I “discovered” the solution after a hell of a lot of Googling. Been searching on and off for nigh on a year now. Many conversations about this were simply not relevant to what I needed.

So, Who Did Provide the Solution?

The solution was posted on to the WordPress support forums 2 years ago by MichaelH, one of the official volunteers. His code was actually like this:

<?php
$args = array(
‘category__in’ => array(14),
‘showposts’ => 10,
‘post__not_in’ => get_option(‘sticky_posts’),
‘caller_get_posts’=>1
);

$my_query = new WP_Query($args);
if( $my_query->have_posts() ) {
echo ’10 recent Posts for Category 14, excludes sticky posts’;
while ($my_query->have_posts()) : $my_query->the_post(); ?>
<p><small><?php the_time(‘m.d.y’) ?></small> <a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title_attribute(); ?>”><?php the_title(); ?></a></p>
<?php
endwhile;
} //if ($my_query)
wp_reset_query(); // Restore global post data stomped by the_post().
?>

However, this puts a small date in front of each listing. It is also for a specific category, not for all categories. You can find the whole conversation here: http://wordpress.org/support/topic/exclude-sticky-posts-from-query

So, there you go. Have a real list of latest blog posts, even when you also have many sticky posts.

WordPress 3.4 “Green” Offers Theme Customization

Wordpress GreenIntroduction

In keeping with the tradition of naming its releases after musicians, the most recent WordPress update, WordPress 3.4 “Green” is named after jazz guitarist Grant Green. In many ways, this update is one of the most exciting that WordPress has ever offered. Some of the most innovative changes are associated with the theme customization feature, which is more powerful than in any previous release. This innovative feature removes the worry about making changes to your blog that you might not like but would be difficult to fix.

If you have incorporated several plug-ins and widgets into your blog, you may worry about whether they are compatible with the latest update. Worry not – WordPress 3.4 “Green” is designed to allow you to continue to use the customizations you’ve made seamlessly. As a bonus, your blog pages may even load faster once you’ve updated.

Real Time Customizing

You check out WordPress regularly, and you see several themes that look interesting.  You’re curious to see how a new theme, or changes to your present blog’s theme will look. The theme customization feature allows you to try on blog changes in real time, without actually changing the theme of your blog. Check out how different headers, backgrounds and color scheme, and then choose the changes you like to apply to your live blog.  If none of the changes you’ve sampled suit your fancy, continue the process with different customizing options as many times as you like until you’re satisfied.

Embed Tweets

Use the oEmbed feature to insert tweets into your blog posts automatically. No more need for separate plug-ins or widgets to insert tweets into your posts. Simply paste the URL of a tweet you’ve posted on a separate line within your blog post, and oEmbed does the rest., complete with a “follow” button to allow blog readers to follow you on Twitter, which can boost your Twitter following.

HTML Captions

Even if you take your own photos, you may occasionally use photos taken by other people. Of course, you always provide proper attribution for work that you borrow, but providing a back link generates so much more good will, not to mention possibly gaining a back link to your own blog.  Before the most recent WordPress update, providing such attribution was cumbersome. With WordPress 3.4 “Green,” if you find the perfect photo on Flickr, you can use HTML to embed a link to the photographer’s website, with no muss, no fuss.

Developer Options

As much as WordPress 3.4 “Green” has to offer for end-user bloggers, developers, programmers and especially tech-savvy bloggers will also find much to love. WP Query performance is enhanced with the latest update; there is also an API for theme support registration for custom backgrounds and headers. External and mobile apps also have their own XML-RPC API. WordPress has created a handy field guide that outlines developer-oriented features newly incorporated into the WordPress 3.4, along with a Codex summarizes changes made in the “Green” update.

Reception

The reception among commentators, including developers, has been overwhelmingly positive. The real time customizing feature has been especially enthusiastically received among developers and bloggers.  The HTML captioning feature was much requested among developers, who reacted with a collective “at last” when it was announced as one of the included features in the new release.

This guest post was written on behalf of ThemeSquirrel.com – check out some of the best WordPress photography themes.

How To Add Your Logo To A WordPress Hybrid Theme

I post this as I had a bit of trouble working it out, so guess some others may also struggle.

Well, what I share now is not what I first did – it is the sensible option! When I first installed Hybrid News, a child theme for Hybrid, I edited the Hybrid code. But today there was an upgrade and I lost my logo, and I could not remember where I made the original edit (see, keeping logs of all changes is important!).

So today I decided the try a more sensible option – to edit the child theme – for this is the reason to have a child theme! So I needed to work out what to change in the Hybrid News stylesheet. Well, here it is:

In the style.css for your Hybrid child theme (I assume all are like Hybrid News), add this:

#site-title {
background: url("/images/logo.jpg") no-repeat;
display: block;
line-height: 100px;
text-indent: -999px; margin:0 0 10px 0;
}
#site-title a {
background: url("/images/logo.jpg") no-repeat;
display: block;
line-height: 100px;
text-indent: -999px; margin:0 0 10px 0;
}

This assumes of course that your image is in an “images” directory and called logo.jpg. You can put an absolute URL here if you like.

Save the page, delete your cache if you run a cache plugin, and hey presto, you have your own logo on your Hybrid wordpress themed website.

Quick Adsense is Dead, Long Live Ad Inserter and Global Content Blocks!

For some reason the best advert management plugin for WordPress is no longer supported. Quick Adsense is dead, the adverts simply do not appear any more. It seems that the original plugin developer sold it to another party but they have not updated it – they also do not respond to enquiries.

Now, the plugin actually stopped working a while ago as it is not compatible with the latest version of WordPress. I decided to get around this snag by not updating the WordPress core files. Risky maybe, but not so risky as having no way to display adverts within the content on my site. It all went wrong last night when I decided to update some other plugins though.

Showing Adverts Within Wordress Posts

See, this is what Quick Adsense did so well. The name was misleading, you could place any code in the fields to be displayed. Then for each piece of code you set where abouts within posts (and Pages) it appears, e.g. before the content, centre of the content, after the content, after Nth paragraph, after an image, after the “more tag” etc. etc. You could display up to 12 (I think) adverts on a page too.

Optimising Adverts / Adsense

A side note – I have been using Adsense for years and have tried just about every placement you can think of, with every ad format. By far the best is always to have 2 adverts within the content. Adsense ads in side bars suffer from serious banner blindness issues, above the content causes “Page Layout” Google search penalties. In the content works best. Not too soon, after a few paragraphs.

Quick Adsense Alternatives

So, as I said, I was careful not to update WordPress. However, last night I did update something (possibly the WordPress SEO plugin, maybe something else) and that broke Quick Adsense. I only noticed this morning so lost half and American day’s revenue (the Brits were all asleep or in the pub so did not affect them so much).

I had searched around for some alternatives before but none seemed to work. Ad Injection was tested but it killed the whole site (some sort of php error appeared instead of the website).

Finally I found half a solution, so had to add a workaround to make it a full solution.

Ad Inserter (version 1.2.0)

Ad Inserter inserts adverts into Posts. For some reason it does not insert into Pages. Not a big problem as I only run a few Pages instead of posts. It was developed by Igor Funa and can be found here: http://wordpress.org/extend/plugins/ad-inserter/.

His description:

“Integrate any HTML code into WordPress. Just paste the code and select the location and display mode. Perfect for AdSense or contextual Amazon ads.”

It does what it says on the tin.

However, for strange, historic reasons, some of my most popular pages are Pages and not Posts. So they were still without adverts. So another solution was needed.

Just spotted one issue – it inserts Adverts into blockquote areas. Annoying to say the least! Oh well. I think I will be doing a lot of manual checks and hopefully fixing on a Post level.

Global Content Blocks

Global Content Blocks is a plugin which lets you create and manage shortcodes in WordPress. Shortcodes call up more complex code so it is easier and add HTML to a post (or Page!) and easy to edit it. Global Content Blocks was developed by benz1 and can be found here: http://wordpress.org/extend/plugins/global-content-blocks/

So I created 3 shortcodes for my 3 adverts and added them manually to the Pages that needed adverts.

Now, I probably could just put the shortcodes into Ad Inserter – I only just thought of this. This would mean that all the adverts are managed via Global Content Blocks. I may try this on another site. For now, I have adverts again. Phew.

I have not had time to scrutinize these plugins, I cannot see anything “odd” happening, so for now am trusting that nothing untoward happens while my back is turned.

Ideally someone will fix Quick Adsense or build a new plugin to properly manage adverts. Ideally someone at Google / DoubleClick for Publishers will build a WordPress plugin to manage it – most publishers use WordPress don’t they?

 

Do You Need a Website? Use This Flowchart to Determine if You Really Need a Website

In an increasingly online world, the question “Do I need a website?” is one which you should consider carefully. The main thing to think about is the purpose of the website you may make. If it is for personal use, then a social network such as Twitter or Facebook may be better.

However, if the purpose is to promote an idea or product, then you may be better suited to having a website which potential customers can access quickly. There are sites, as you can see from this infographic, which allow you to build your own website efficiently with little cost. If you require more advanced or tailored programming, it may be necessary to hire a team of developers, which this chart can help you decide on. If you think that the best idea would be to create your own website, Basekit offers a huge range of content that can be included easily. This infographic can make your thought process more clear, and was designed by people who know the best use for each solution.

Should You Build a Website Infographic

If you’re sure you need a full on site why not create your own website for free with Basekit – who produced this infographic. Get embed code here.

The Plugins I use to Build an SEO Friendly WordPress Website

[toc]
It is my belief that for anyone who is passionate about writing and not so keen on developing websites, WordPress is the best content management system (bit of website software) to build and manage a website. WordPress is great because it is fully open source (so no cash needs to be handed over to use it) and there is a very active community which supports the software.

Although some SEOs and webmasters believe that WordPress works “out of the box” perfectly well, I do like to use a few plugins to give it a boost and enhance the CMS. Here is a list of the main plugins that I use. I do not use them all on all websites, but do use them all somewhere or other. Some are handy to have, some are vital, some simply save time and others can improve your website in ways you just could not imagine (OK, I am getting over excited, they are just all OK really).

Here are my recommended plugins for enhancing and WordPress blog.

Broken Link Checker

http://wordpress.org/extend/plugins/broken-link-checker/ – Checks for broken links, also for redirects (and fixes them, careful of aff links!). Broken link checker really is an amazing tool. Not only does it scan for webpage links, it also scans all images, embedded videos and redirects. It will even report on URLs that are not linked, just written in plain text. One very powerful use for this is if you change your permalink structure in WordPress. WordPress will set up 301s for any links you have within articles, and Broken Link Checker will then tell you about redirects. You can then click to check boxes and press “Fix Redirects” and hey presto, all links are fixed. Warning: if you have short URLs and advertising URLs in place be careful with the “Fix Redirects” buttons. I once accidentally fixed some affiliate links and was linking direct to the product pages and getting no commission (it is probably only me that makes such silly mistakes!). I actually blogged about this before, WordPress Broken Link Checker is Awesome!

Category Text Widget

http://wordpress.org/extend/plugins/category-text-widget/ – I use this to provide a manual recommended sidebar list for each category. Simple and effective. I generally have around 5 main categories for any blog and then with this simple WordPress widget I can list the most important pages for each category. Much more powerful than just relying on an automated related posts widget as you can choose the words and pages yourself.

Display widgets

I have actually replaced Category Text Widget with Display widgets on one blog and this is more powerful still. I used display widgets to place all advert banners on one site so that I could stop them appearing on the homepage (I wanted to homepage to be advert free).

Follow My Links

http://wordpress.org/extend/plugins/follow-my-links/ – any links the main admin makes in comments are followed. So if you point a reader to another page on your site or to a resource on another website those links do not have the “nofollow” attribute added and these keeps the PageRank flowing.

Google Sitemap Generator

http://wordpress.org/extend/plugins/google-sitemap-generator/ – does a good job I think. The easiest way to build a Google friendly XML sitemap. I do not always bother with it on smaller sites, but on larger ones it is really handy. As the sitemap is updated on the fly each time a new post or page is added you do not need to mess around with running programs to crawl your content and then create files to be uploaded by FTP. I used to use Softplus’s GSiteCrawler until I discovered the Google Sitemap Generator.

Pages in the RSS feed

http://wordpress.org/extend/plugins/rss-includes-pages/ – It does what it says on the tin! This plugin puts pages in the RSS feed. If you run a site using pages and posts then this is a great plugin. Some of my most popular pages are WordPress Pages (historical reasons, dating back to the time the whole site was a bunch of static html files).

Merge Tags

http://wordpress.org/extend/plugins/merge-tags/ – if they have gone tag happy then this can quickly merge loads together. I used to randomly add tags like there was no tomorrow. Then I realised I had loads of tag pages with just one article listed. Duplicate content hell! Since then I keep tags to a minimum, I only use them if I feel a category needs to be subdivided (which is very rarely). In fact, I almost never add tags now.

Recent comments widget with comment excerpts

http://wordpress.org/extend/plugins/recent-comments-widget-with-comment-excerpts/ – rather than repeating the post name it shows what was written. This is a great little plugin, such a simple but important idea. If you show a list of the most recent comments on your blog sidebar, the default version will show the page title of the comment. So if the last 10 comments were all on the same page, you get a list with 10 identical links – it looks dumb. This plugin shows the first part of what the commenter has written which makes more sense.

Simple move comments

http://wordpress.org/extend/plugins/simple-move-comments/ – may be handy if you want to delete some posts and merge. I have used this on a site that needed a lot of tidying up. There were a lot of short and similar articles, which after the Google Panda updates no longer ranked. So I merged and deleted articles, bur before doing so moved all the comments on to one page. All done in a click with this plugin. It does not allow you to move individual comments though, which is a shame (hint hint developers!).

Subscribe to comments

http://wordpress.org/extend/plugins/subscribe-to-comments/ – This simply allows a commenter to subscribe to the page when they leave a comment. Very useful in a blog where people are asking questions, and helps to bring people back to the site too.

Breadcrumbs

http://wordpress.org/extend/plugins/breadcrumbs/ – You want breadcrumbs? Then this makes breadcrumbs. You just need to chose some options and put the code somewhere in your theme (e.g. in the header.php below the site menu).

WP Super Cache + WP Minify for speed

I have tried a few caching plugins and this combination generally results in fewest errors and good response time. Although if you get the WHITE SCREEN OF DEATH first disable the WP Minify as this does cause the problem sometimes. On one blog I am using an alternative minify solution, Better WordPress Minify, which seems to reduce these errors.

Utech List Post Titles

Utech List Post Titles – http://wordpress.org/extend/plugins/utech-list-post-titles/ – create lists of latest posts for specific category. Simple and effective. You just add a shortcode to a WordPress Post or Page specifying the category and it shows the most recent posts. I use it on some homepages to order the content better.

List category posts

For custom HTML sitemaps I use List category posts – http://wordpress.org/extend/plugins/list-category-posts/. This will allow you to list all posts in a category in alphabetical order on any page using shortcodes. I use it to make custom HTML sitemaps (for people to read, not for googlebot).

There are other plugins that I run for various things, on some sites I use the AZIndex instead of the List category posts. For a simple contact form I often use the Dagon Design Form Mailer or the Fast Secure Contact Form.

To help with Google+ profiles I use the Allow REL= and HTML in Author Bios which I have blogged about previously.

The other plugins I use are more admin related and not designed to enhance user experience. I may discuss those in the next post, if this post proves to be popular.

The Best Magazine Theme For WordPress

Last night I noticed that on one of my sites there were hundreds of duplicate files being crawled. These files were all generated by the WordPress Theme as it appended a version number to the end of each javascript file each time an edit was done. However, there was nothing in place to “remove” old version numbers, so I had a whole bunch of virtual files, all identical, all being crawled.

As I felt that this could be deemed duplicate content by Googlebot (I was actually looking at the access logs of the site to see if Googlebot had been as the last 2 articles I had written had not been indexed) I decided action was needed.

Magazine Basic by Bavotasan.com

I had spent some time (days, weeks?) editing and modifying my WordPress theme (I am not going to name the theme that created all the silly file names in case I upset someone, again….) so was a little reluctant to update it. But I threw caution to the wind (I do that a lot, as well as added little remarks in brackets) and decided to use the trusty old (and regularly updated) Magazine Basic theme by Bavotasan.com. It is actually the theme that I use for Webologist at the moment too.

What I like about Magazine Basic is:

  • It is free
  • It has a nice layout with images in the excerpts
  • Lots of layout options
  • Sidebar options (1 or 2, left or right etc)
  • Logo and adverts can be placed in the header section
  • WordPress Menu built in.
  • Very easy to edit
  • FAST! My pages load so much quicker than they did with the old bloated theme

Bavotasam provides a Support Forum for his clients. As well as the free Magazine Basic he also has some impressive looking premium themes which start from $39.97.

Magazine Basic is his most popular WordPress theme I think. It was first released in October 2008 and he keeps it updated well. Another free one that I have been meaning to test out is Feed Me, Seymour which provides a grid like magazine front page for wordpress.

Magazine Premium is the enhanced version of the most popular freebie. If offers various new features such as full width posts, improved headers and backgrounds and a 3-column front page. Also the footer for the site is much better with, I think, widgets in the footer section. Something I was trying to hack yesterday. As I type this blog and review what is on offer, I am starting to think that the premium version may actually be a good move….

Magazine Flow is another premium theme, built for WordPress 3.1. It uses David DeSandro’s Masonry plugin to create an improved front page grid – I may take a peek at that plugin later too. It gets rid of the side bar/s on the home page to make the blog look much more like a professional website. In fact, I am now liking this….

My problem is that I am constantly tinkering. One thing I like most about Magazine Basic is that it is very easy to quickly set up and modify to make it look unique. I am loving Magazine Flow now – see here - http://demos.bavotasan.com/magazine-flow/ – it even embeds YouTube videos in excerpts on the homepage. Wow.

For photo enthusiasts Bavatasan also offers Elemental Portfolio, it looks smart, but maybe needs some more work.

He showcases some of the best looking sites on his blog: themes.bavotasan.com/category/showcase, some very smart examples there of why WordPress is no longer just a blog CMS.

OK, my boy is crying now, better help him find his dummy so he goes back to sleep.

Drupal Gardens – The Best Free Website?

Just came across this – Drupal Gardens - http://www.drupalgardens.com/

Like Ning, but using Drupal. More like WordPress.com really, but using Drupal.

Many people have a free website for their personal blog or business. Generally they opt for WordPress.com, Blogspot.com, Google Sites or just make do with a Facebook page these days.

Drupal is an open source content management system that is very popular amongst web developers as it is easy to install, easy to learn and highly configurable. Like WordPress.org, you can bolt on modules (like plugins, add-ons etc) to enhance the site. If installed on your own domain it is a very powerful CMS.

With Drupal Gardens there is a choice of themes, all the usual Drupal features – pages, stories, forum, plus gallery and comments. At the moment you cannot install extra modules. It seems a good place to build a free site, if you are into that sort of thing. I set up an experimental blog here: http://howtoloseweight.drupalgardens.com/

It took me about 30 minutes to set that up, although most of the time was spent writing the first blog post (and yes, I know that it has not been proof read and is full of grammatical errors). In fact, I wrote a blog post, then realised that it should have been a page, so made a page, then deleted the blog post / story, then changed the URL/permalink to the page, then set it to show in full on the front page. Also deleted all the example items that are installed when you set up the Drupal Garden site.

If you are looking to build a community site, then I think that Drupal Gardens is a good option. The comments are better than Blogspot, the forum is better than comments alone, it has some pretty stylish features, such as flashy looking featured items.

As you can see, what I just created is pretty bare, but there is potential there for a good community, and since Ning is now closed to free accounts, Drupal Gardens could fill that vacuum better than WordPress, Blogspot or Facebook.

BBC News has Had a Design Makeover

BBC News is looking extremely sleek today. At first I thought I was on the wrong page! I always read their Health News pages and today was pleasantly surprised by the vibrant and modern new look.

The BBC have decided to remove the old fashioned left sidebar and now have all their navigation along the top of the page. The right hand side shows features, most popular news of the week and also has relevant links to video material on iPlayer.

They have provided a guided tour of their new layout which helps to explain where things are and why they have moved. The design aims to be cleaner and provides more space for better quality pictures and videos.

Alongside each story they now show other relevant stories. Each video page displays a better quality and larger video with links to other videos. This will possibly revolutionise the way the BBC share its news content.

They are now provide social networking links to that we can share the news easier with friends and family. Well done BBC! Right, now time for a Webologist.co.uk makeover!

New BBC News Design

What Is A Playful, Engaging, Persuasive Web Site?

Adding Flair to a Boring Page

Adding Flair to a Boring Page

An interesting discussion has been kicked off by Kim over at Cre8asiteforums.com – what types of website should be emotionally engaging, which should be minimalist, clean, “professional”? And what is meant by “professional style” in web design? A site for Children will look very different from one for stock brokers, but both will surely be “professional”.

Personally I prefer clean, minimalist sites. I think that the web template should be just like a frame to hold navigation, advertising (annoying at times but essential) and little else. The flair and passion should be in each article. Using images and other media within articles is the simplest way to add passion to a website, without changing the entire theme. This of course allows for a website to be have both serious and more playful sections without risk of upsetting and readers.

Grumpus makes a very good point for the web designer that works alone:

Playful and amusing are one way to go. Appealing to my sense of logic is engaging as well – which your articles do, in spades. For every right brained user you turn off by being “boring” you have a left brain user who you have turned on by getting to the point and laying it down on the table for them.

This is why I’ve always found the “one (wo)man show” that a lot of us here on the Internet run to be quite challenging. I have a way of presenting things – I want you to not only know why I am doing it or thinking it, but I want you to also understand WHY I am doing it. To me, I feel like I can’t ask you to assess my recommendations on a consulting job unless you can understand the reason I’m suggesting it. Half of my clients really appreciate that approach. Half of them tell me they’d wish I would just shut the hell up and tell them what to do.

Even though I’ve gotten better over the years at being able to read my clients and know which ones want me to shut up and do and which ones want me to give them what they are paying me for, it’s still hard for me to do that “shut up and do” thing. I can “act” like that’s how I do things and make the person happy, but inside I want to slap them in the head and say, “Are you really going to do that based upon one person who you have never met telling you that’s what you should do? That’s my first recommendation for you… stop listening to people without knowing at least a little bit about where they are coming from! Someone is really going to take advantage of you one day!”

Web design studios, businesses with several employees each skilled in different areas, do have it much easier. Most will employ a qualified designer, a technician, marketer, copywriter and of course the most valuable salesman. Sole traders have to do all this on their own. Usually an individual web designer will focus on their strengths and sell this to clients. This is what I do. I build fast, reliable website that can easily be updated, tweaked and modified. Minimalist but with room for growth and flair.

The biggest selling point of a minimalist, “professional” site is that it is less likely to go out of fashion. A site built today could well still be online in 10 years or more, and if it supports a company well they may see no reason to change. So long as the content management system can be kept secure then the site can out last many small time web designers. This has to be a key selling feature for any small to medium enterprise that wants a new website, and does not want to risk having to make large annual investments to update it as tastes and trends change.

Web HTML Font Families

Sometimes the easiest way to make a quick and dramatic change to a website is to change the font. There are several popular font families that work well together to keep the appearance of your website the same across a range of different operating systems and web browsers. Her we provide a list courtesy of Ampsoft.net.

Windows fonts / Mac fonts / Font family

Normal style Bold style
Arial, Arial, Helvetica, sans-serif Arial, Arial, Helvetica, sans-serif
Arial Black, Arial Black, Gadget, sans-serif Arial Black, Arial Black, Gadget, sans-serif
Comic Sans MS, Comic Sans MS5, cursive Comic Sans MS, Comic Sans MS5, cursive
Courier New, Courier New, Courier6, monospace Courier New, Courier New, Courier6, monospace
Georgia1, Georgia, serif Georgia1, Georgia, serif
Impact, Impact5, Charcoal6, sans-serif Impact, Impact5, Charcoal6, sans-serif
Lucida Console, Monaco5, monospace Lucida Console, Monaco5, monospace
Lucida Sans Unicode, Lucida Grande, sans-serif Lucida Sans Unicode, Lucida Grande, sans-serif
Palatino Linotype, Book Antiqua3, Palatino6, serif Palatino Linotype, Book Antiqua3, Palatino6, serif
Tahoma, Geneva, sans-serif Tahoma, Geneva, sans-serif
Times New Roman, Times, serif Times New Roman, Times, serif
Trebuchet MS1, Helvetica, sans-serif Trebuchet MS1, Helvetica, sans-serif
Verdana, Verdana, Geneva, sans-serif Verdana, Verdana, Geneva, sans-serif
Symbol, Symbol (Symbol2, Symbol2) Symbol, Symbol (Symbol2, Symbol2)
Webdings, Webdings (Webdings2, Webdings2) Webdings, Webdings (Webdings2, Webdings2)
Wingdings, Zapf Dingbats (Wingdings2Zapf Dingbats2) Wingdings, Zapf Dingbats (Wingdings2Zapf Dingbats2)
MS Sans Serif4, Geneva, sans-serif MS Sans Serif4, Geneva, sans-serif
MS Serif4, New York6, serif MS Serif4, New York6, serif

How to Add Widget Areas to Your WordPress Theme

Just found this fantastic tutorial on adding widget areas to any WordPress theme. I successfully set up a new widget area below the content of my posts on another blog I write for in about 5 minutes.

Addwidget Area to Theme: Step 1.

In the index.php file in your theme directory, add the following code to an area where you would like a new widget area. Directly below the content is a good idea if you wish to place adverts, or further reading there. Note we have had to wrap this line of code so it displays. Careful of too many spaces.

<div>

	<?php if ( !function_exists('dynamic_sidebar') || 
!dynamic_sidebar('Post Widget') ) : ?>
	<?php endif; ?>

</div>

Step 2.

Then in the functions.php file add the following line, directly below the current widget code:

register_sidebar(array('name'=>'Post Widget',));

Step 3.

Finally, to style the wdiget, add this code to the style.css file:

.widget_post {
	background: #FFFFFF;
	margin: 0px;
	padding: 10px;
	width: 600px;
	}

It really is as simple as that. When you next go to the widgets area in your WordPress control panel, you will see an option for “Post Widget”. There is a more detailed explanation on StudioGrasshopper’s website.

Source: Studiograsshopper.ch -How to add a Widgetised area in a WordPress theme

Website Logo Competition

We are proud to announce that we have been chosen the host the MotleyHealth.com logo competition. MotleyHealth.com has decided that it is time to upgrade their current logo, and have decided to search for a new logo by way of a competition.

The logo should be on the theme of Fitness, Strength and Weight Loss. It should be a similar size to the current logo, and fit in with the site colour scheme.

Jon Wade from MotleyHealth.com has scribbled his idea for a new logo, which is based on an image of a man bench pressing, while another spots. This is the doodle that Jon produced earlier while going through some ideas:

The name MotleyHealth.com and the tag line, “Fitness Strength and Weight Loss” should both be present in the logo.

The Prize

So, what is the prize? The prize is simple – the winning designer will be awarded free advertising for life (or the life of Webologist) for their web design company on the sidebar of Webologist. Advertising can be by way of a suitable text message or a banner (either a 125px square or a 234px by 60px half banner in the side bar).

Entries should be emailed to [email protected] All entries will appear in this post. Suitable entries should be scaled to the correct size (e.g. 300px by 75px) and narrative to explain the inspiration for the logo and meaning etc. There is currently no deadline for this competition, but as soon as a winning logo is chosen the designer will be contacted and winning logo will be announced.

So, get your paint brushes out and start creating!

Current Entries:

Designs from MorrowTech.co.uk:


Fitness Couple

Simple design

Designs from Creativehat.co.uk (THE WINNER!)

This has been chosen as the winning logo. Well done Ferg from CreativeHat.

How To Test a Website Before Updating Name Server Details

If you are moving a site to a new server, or building a site for a client, and wish to test it before updating the name servers, then this task is very simple to do, especially if you have a Linux PC.

All you need to do is add a line in the etc/hosts file like this:

00.00.000.000 www.test_the_domain.com

Where 00.00.000.000 is the IP address of the new server.

From now on whenever you look at www.test_the_domain.com in a browser you will see the version on the specified server rather than the version where the name servers at the registrar point to. This is possibly one of the most useful and yet most basic testing tools when rebuilding a website for a client, as it gives you an easy way to view and test the site while you are building it without comprimising the live version. The new site can be built and tested fully before updating the name servers and putting the new site into the “production environment”.

It can also be done on a Windows machine, just reboot the pc after amending the hosts file (there is no need for a server restart on Linux). Locatation the hosts file in Windows (Windows NT/2000/XP/2003/Vista/7);

%SystemRoot%\system32\drivers\etc\ – this is the default location, which may be changed. The actual directory is determined by the Registry key \HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\Tcpip\Parameters\DataBasePath.

Remember to always test thoroughly before passing a new site to a client.