Hi, Folk!

This week, I’m going to touch on the subject of headers and footers.  These are among the easier things to modify in WordPress.

Once you’ve signed into WordPress and have arrived at your Dashboard, go to Design, then Theme Editor.  On the right hand column, under Templates, select Header.

Under <div id=”header”>, you can place any graphics that you want displayed at the top of the site.  In my own case, I put a typical html table with my logo, a secondary logo, and language for the Ad-Minister plugin.  It looks something like this:

<div id=”header”>

<table width=”974″ border=”0″ cellspacing=”0″ cellpadding=”0″>

<tr>

<td width=”272″ height=”95″><a href=”Your URL”><img src=”You logo graphic” /></a>

<h1><a href=”<?php echo get_settings(‘home’); ?>”><?php bloginfo(‘name’); ?></a></h1>

<div class=”description”><?php bloginfo(‘description’); ?></div>

</td>

</td><td width=”234″>

<img src=”My second graphic”/>

</td>

 <td width=”468″><My language for Ad-Minister, or whatever type of graphic or banner tool you wish, such as a project wonderful advert>

 </tr>

</table>

</div>

The dimensions above are set for my site, you are more than welcome to modify them to fit your site’s needs.

Next up is the menu that is above your comic.  As it stands, the menu is set to repeat the menu on the side column, which is may be OK for you as is.  For me it wasn’t because I’ve got a lot of content on my site, and I could stand all the sub-pages and sub-sub-pages messing up my navigation bar and layout as people move about the site.  That’s what will happen if you leave it.  So, my best alternative was to pull all that “Echo function” type language out. 

The menu is underneath the header, and is labeled <div id=”menu”>.  In my case, the best approach was to replace the automatic echo function language with a simple table and html links of my own creation.

<div id=”menu”>

<table width=”600″ border=”0″ cellspacing=”0″ cellpadding=”0″>

<tr>

<td><a href=”Put link here” class=”style1″><strong>HOME</strong></a></td>

<td><a href=”Put link here” class=”style1″><strong>HOME</strong></a></td>

<td><a href=”Put link here” class=”style1″><strong>HOME</strong></a></td>

<td><a href=”Put link here” class=”style1″><strong>HOME</strong></a></td>

</tr>

</table>          

</div>

With this arrangement, you can put in as many or as few links as you wish and retain control over it.

What if you don’t like the size relationships of your header elements?  Some bars are too tall, or not wide enough, or whatever?  To change this about the header, you modify your Stylesheet, not the Header file. This too is accessed via Design and then Theme Editor, this time choosing Stylesheet.  The part of this document that covers your header is under /* THE HEADER */, while the part that covers your Navigation Bar is under /* THE MENU */ and then #menubar.

Before you begin altering your CSS code in the Stylesheet doc, make sure you have backed up your database and perhaps saved a copy of the site onto your hard drive.  It’s all too easy to screw up your site if you don’t know what you are doing.  Even if you are well used to CSS, you are still playing with code that someone else wrote, and mishaps can happen. 

Well, I’ve already written more than I intended, and I didn’t even get to footers.  There’s still a lot of fun stuff on the way, and I’ll get to that in future columns.

Scott.

Hope all is well out in internet land!

Last week I wrote about setting up a WordPress/Comicpress website, and some of the plugins that would come in handy.  This week, I’m going to dive into some of the basic approaches to fleshing your site out.  I’m going to assume, for the moment, that you’ve successfully installed your site, you’ve uploaded your comics, and everything is working the way it should.  That’s assuming a lot, I realize, because these things never seem to come off without a hitch or two, but hang in there.

Most of your modifications are going to be done on your WordPress Dashboard under “Design” and then “Theme Editor.”  Within the Theme Editor, you will see a column on the right of files you many access, and on the left each file’s code, and on the bottom an “Update File” button.  Pretty straightforward, really.  I would suggest that before you go modifying these files, copy and past their language into a WordPad file and save it—this way, if you mess the site up, you have the language to paste back in and restore the website.  Do this, or copy the whole file into a safe directory on your hard drive.

The files that you are most likely to access and change from the Theme Files are “Header,” “Stylesheet,” and “Footer.”  The Stylesheet is a CSS file, aka Cascading Style Sheet document, and this is where you can change all the sites colors, fonts, and many elements associated with the site’s appearance.  If anything puts off inexperienced website builders more than CSS, I don’t know what it is.  Luckily, it’s not that hard to learn. 

If you plan on changing your site’s color themes, I suggest you have the colors you want worked out in advance.  Web colors usually are expressed as hexadecimals, and they are preceded in the Stylesheet file by #.  There are many places you may go on the web to determine your color choices and their hexadecimals, such as:

http://www.htmlvalidator.com/htmlval/fontsandcolors.html

http://mediazeal.com/colorthemes.html

http://www.colorschemer.com/online.html

There are many more such online applications and guides to help you choose your colors.

Changing the colors of pages and fonts on your site is as simple as going to the existing choices in your Stylesheet and replacing your hex values for the existing one, then hitting “Update File.”  Open your site in another screen, and reload it often to see the results of your color changes.  You can also change many of your site’s design elements, or proportions, from the Stylesheet file, but I’m leaving that to a future column.

Another useful tool to use in setting up your site is Widgets.  While in the Design, go to Widgets, and there you will see an assortment of options, including Pages, Links, Meta, Recent Posts, etc.  I use Archive Dropdown, Bookmark Comic, and Text Widgets.  On the left side of the screen, next to each widget, is an “Add” button.  Hit that, and the Widget reappears on the right side of the screen.  Before you do anything with said Widget, press “Save Changes.”  You can save multiple Text widgets.

The Text Widgets are particularly useful, because you can use these to install Project Wonderful ads, Amazon.com ads, Google ads, Web Rings, and the like.  Copy your ad language, past it into one of the text boxes under Widgets, press the “Change” button at the bottom of the opened Widget, and the ad should then appear on your site.

Next week I’ll cover Headers and Footers.  See you then!  Scott.

This week, I’m doing an overview setting up a WordPress webcomic.  I’m going to do my best not to overlap too much with Bob Hickey’s excellent WordPress tutorial from Sketch no. 34, but of course there will be some overlap. 

1)      Get a host that is database compatible, and set up the database that will run your webcomic.  I use a Yahoo Small Business website, but that’s not an endorsement for them. I expect I’ll be looking for a new host within the year.

2)      Download and install WordPress.

3)      Download and install Comicpress.

4)      Download and install Comicpress Manager.

5)      If you have problems, go to this forum.  This is where Tyler Martin, who created Comicpress, and John Coswell, who built Comicpress Manager, often answers questions.  Even if Tyler and John are too busy, there are often knowledgeable people who point you in the right direction.

6)      There are also excellent forums at the WordPress site.

Before you start digging into your Comicpress code and modifying your site, there are some plugins that you might need.  In my case, I use the following:

1)      Ad-Minister (download here): I use this for rotating ads at the top of my blog.  I use this space outside my Project Wonderful ad boxes.

2)      Add to any: Share/Save/Bookmark Button (download here): Offers a wide list of social bookmarking links.

3)      Akismet: This plugin, which helps identify and quarantine spam, comes with WordPress, and it requires that you get a WordPress API key. 

4)      All In One SEO Pack (download here): This “Search Engine Optimizes” your blog.

5)      Comicpress Manager (download here): This makes loading comics, setting up archives, and thumb nailing quite easy.

6)      Eshop for WordPress (download here): My choice of shopping cart program.

7)      Google XML Sitemaps (download here): Notifies Google every time you update your site.

8 )      Lightbox2 (download here): I use this to set up galleries, such as my Fan Art gallery, and it displays pics at full size without distorting your blog setup.

9)      PrestoGifto (download here): Integrates your Café Press store into your blog.

10)  ReCAPTCHA (download here): Fights spam by requiring a random security word picture with each comment.

11)  WP Super cache (download here): Speeds up your blog by turning slow loading PHP into HTML on the client side.

Installing plugins is usually as simple as using an FTP program to upload the unzipped plugin to your site, depositing the new plugin’s folder in your wp-contents/plugins folder.  (I use CuteFTP as my FTP application of choice, but there are many available.)  Once you’ve signed into your WordPress site, go to Plugins, then hit “activate” after each new plugin.

Well, that’s enough for this week, I would imagine.  Next week, I’ll start getting into details of getting your site up to speed, such as how to install Project Wonderful ads, changing background colors, and modifying your blog header.

Scott.

Most cartoonists, and artists in general, would prefer to just sit and draw and cartoon.  I’ve often been in the position, when engulfed in website work and business, that all I really wanted to become a cartoonist for was to draw.  A great many artists are naturally shy, are a bit introverted, and have rich inner lives.  I know what this is like, because all this describes me.  Over the years, in the indie comic world and the webcomic world, I’ve met a great number of folks who are just like me in this regard.  (Indeed, it’s shocking how man pudgy, balding guys with facial hair and glasses I’ve met who do the exact same thing I do!)

Being introverted is just fine, especially if you are drawing for your own amusement and nothing else.  Being a cartoonist, especially a webcartoonist, means that you have to break out of your shell and learn how to be a salesman and community builder.

If you are a natural salesman, and a real people person, then good for you!  This is not written for you, and you can stop reading now.  If you are a member of the “everyone else” subset of people, then take heart—you can learn to be a salesman, and to wear many hats.

Hats are as good an analogy as any for all the roles you will have to fill as a webcartoonist.  Not only do you have to cartoon, but you have to be a webmaster, a salesman, a promoter, a community builder, and a business person all wrapped into one person. 

What I’m not writing about here is how to close a sale, or how to write a press release, or how to do a book signing, or any of that.  There are great guides available for these things on the web and in bookstores.  No, what I’m referring to is changing your attitude and learning to step out of your comfortable shell and put on the promoter’s hat.  You have to promote yourself, because it’s unlikely anyone will do it for you.

First up, you have to put aside any distaste you might have of salesmanship, merchandising, and becoming commercial.  In the beginning you may well feel that you are an ‘Artist’ with a capital ‘A,’ and that commerce and sales are somehow beneath you.  Maybe you’ve never actually expressed this, but you may well feel it subconsciously, as if becoming commercial were ‘selling out.’  I won’t address the whole issue of ‘selling out’; if you have issues with it, get out in the commercial world for a few years, earn a living, pay your bills, and see art for what it is: A product.  You are a producer, and your art is a product, and as such it has a value.  If you can’t deal with this, then you may well enjoy a long career as a fine artist, and maybe your work will become quite valuable after you die.

Next, learn to tell everyone about your work.  Tell family, friends, acquaintances, perfect strangers, everyone!  Learn to mingle with crowds and introduce people to your work!  Learn public speaking, and spread the word!  Pass out business cards everywhere you go to everyone you meet!  (My webcomic has its own business card, for example.)  Wear shirts with your characters and URL whenever it is socially acceptable to do so.  Comics are meant to be shared! 

Have confidence.  You have to believe that your webcomic is simply the coolest thing ever, that you are doing people a favor by telling them about it.  Do you feel uncomfortable taking money for your product?  Do you routinely cut special deals for people you like or feel sorry for?  Stop It!  Find the right price and stick to it!  If people want your art, and they have the money for it, they’ll buy it!  If they want it, and they don’t have the money, they won’t!  (But, maybe later, when they do have the money, they’ll be back.)  That’s just basic marketing—it’s not personal, it’s business!

Don’t be a Luddite.  I’ve met so many art school students who ‘don’t do the computer thing,’ or just aren’t interested in the internet.  This astounds me whenever I hear it—there was no internet to speak of when I went to high school and college!  I have avidly watched for and usually adopted every new technological advance or internet trend that has come along!  Some younger people may believe that being aloof from the net makes them cool, or rebellious, or different, or whatever.  It doesn’t.  It makes them turtles in the age of hares. 

So, if you learn to sell, have confidence in your work, learn to casually talk with everyone, and use the computer for all it’s worth, you are well on your way to becoming a promoter!