Project 1 Start Your Cartoonist or other Online Business Website Free

[MrFlicks]

Project 1

All you need for free web website is >

Twitter Bootstrap

JQuery and JQuery UI

WordPress

Web Hosting Can't afford hosting? Contact me I always need things doing - tell me your story & maybe I can help you!

In this thread 5 people, that's Keith D Mains (SEO & Writer, Cartoon Designer, Ideas Man and General All Round Tool For A Variety Of Things) Richard Duszczak (Cartoonist & illustrator), Simon Goodway (Cartoonist & illustrator), Jon-Paul McCarthy (Caricaturist, cartoonist. illustrator & artist) will all be setting up Suffusion Themed, WordPress based blogs on separate domains and will be running through the set up process.

This will not solely be about Suffusion as it is also about WordPress and some things I always do for my WordPress installs as well as anything else that crops up and is related.

The Domains being set up are all being set up on an example.com/keyword URL so the WordPress will sit in a folder with that /keyword name. This leaves the sites index page outside WordPress and is a method I always use (more on my reasons for that in other threads later).

So the domains being set up in this project and demonstration, a type of tutorial if you will, are on the following domains...

http://suffusion.co Keith D Mains
http://illustratted.com Keith & Simon
http://motivatted.com Keith & Richard
http://cartoon-illustrator.co Simon Goodway
http://hirecaricaturist.com Jon-Paul McCarthy
http://www.cartoonist.me.uk Richard Duszczak
http://www.bookillustrator.biz Richard Duszczak

To begin each of the above has a domain and the sites in question are all hosted by our very own HostTed The Hosting Ted here > http://hostted.net.

This means all have a cPanel the World's most used hosting control panel and all can easily install WordPress with very little knowledge.

This is done simply by logging in to the cPanel and scrolling down to the bottom and finding the Softalicious icon (Click that)

The next page on the left there are options to choose. Click "Blogs" (it is the first menu option) and there will be seen "WordPress" (it is the fifth menu item). Click the "WordPress" menu item..

Ignore everything on next page other than "Install" and click the menu item that says "Install". This is located in the horizontal navigation just above the word "WordPress" which is written in blue at the start of the first paragraph on that page.

Set the following parameters/settings only (leave the rest as is - unless you have reason not to)

In the "Software Set Up" section (first section). Change "in directory" to your keyword or two keywords using a hyphen only to separate the words (You could go up to three words but seriously no more than that IMHO). (Edit thinking about it, for example, I suppose you could go example.co/hire-freelance-cartoon-illustrator, but that really should be the limit and you have bear in mind repetition of keywords at a later stage so don't want to "over do" it here.

Next in "Site Settings" change the "Site Name" and "Site Description" to your desired words bearing in mind to include keywords searchable and related to your main focus of the site.

Next set the admin account settings.

Use a username you want here as it will appear as the authors name who makes the posts on your blog.

Change the password (use the little generator for now and you can change it later at any time). Make sure the email address is the one you want if not change it now.

At the foot of the page there is a field that says "Email installations details to"

Use it and send yourself an email to your desired destination..

Save your login details somewhere.

Open up both URL's you now have brand spanking new to begin your new sites journey.

At this point please don't do anything else, Google Yahoo, Bing and Ask already know you are there most likely & we will get to your first post later (please do not delete the WordPress post or comment already in place nor change the category.

Leave it alone for a few mins and open up your ftp client that you like to use..

GO and get this > http://wordpress.org/extend/themes/suffusion

Download and unzip it.

I am using filezilla so I simply do the following.

Open up your new folder for your WordPress (in the remote server in ftp) and then open "your new folder" (it is your WordPress installation). Then click "public_html" (possibly twice) and it will open up below and there will be a folder called "wp-content" please click that to open it and so you can see a further folder called "themes".

Simply drag and drop the Suffusion folder you downloaded and unzipped on to your computer and drop it in the "themes" folder.

For now don't do anything else please.

We will activate it and continue in the next posts but first let's make sure we are all on the same page here and no problems have so far arisen.

I have installed the Suffusion.co blog here > http://suffusion.co/seo-web/

Those participating please post your URL's so I know we are all singing from the same song sheet here and we will continue.

Don't do anything else at this stage please. Don't be tempted to jump ahead as there are a couple of things you may not know that I want to ensure we cover soon.

[CartoonGenius]

Keith,
I've set up my blogs:
http://www.cartoonist.me.uk
http://www.bookillustrator.biz

Regards, Richard

[simongoodway]

Mine's at http://cartoon-illustrator.co/artist-hire/

[MrFlicks]

OK some are on catch up here but the next things are

In your admin dashboard down the left hand side click "Settings"

You will see a setting called "Permalinks" Click that and then you will see a bunch of radio buttons.

Click the second or third one down and some code will appear . Strip out what is there up to leaving the following or simply copy and paste this code in place instead

/%postname%/

That gives your URL's words rather than numbers and it strips out dating the posts from in the URL, I want words in URL's not dates as toons don't go out of date, it's not like digitally stored images fade in the sun or anything LOL . Who searches a blog archive for a date a cartoon was displayed? People search for Teddy Bear Cartoon or Bart Simpson Cartoon and not 21st Aug cartoon. The words used for that are the words in the titles of your posts or the slugs if you set slugs.

You may still think "Why strip out the date etc?"

My answer would be "Why not, the date already appears on the page why duplicate it elsewhere like in the URL which is not needed as if someone is looking for something by date spiders are quite capable of finding the date on the page. Plus as I said it is already there why add extra bytes of repeated info

So we now have proper search engine friendly URL's with words that make sense and are what people search for. To my mind that is what mainly counts in regards to URL's.

OK What;s next?

Pop on over to the left side again and up at the top click "Posts"

Next Click categories.

We don't want uncategorised we want "General" so hover over the uncategorised listing and click the word edit that appears.

Change to General but >

LEAVE THE SLUG

leave the slug as uncategorised

We then have our uncategorised section as the "General" category. Seems to make logical sense to me. On page it says General and in the URL it will say uncategorised, to my mind that makes perfect sense.

Make sense.

Here are reasons why it ought to.

1 we just made sure we don't have 404 error (More on making smart 404 error pages later) pages as removing that slug changes a URL and means we have an error page. UT uh we just took care of that as our uncategorised slug (That is how the word appears in the URL - uncategorised) category is still there it is just worded on site as "General".

Believe me you will wish you had a general category at a later stage.

2 that's the other reason we leave a general category as it can be handy for anything and everything that doesn't fit into on site focus categories added later.

A quick word on "Slugs"

You will see slugs mentioned from time to time and should know that slugs are the words that appear in the URL's so always fill out slug fields with formats like the following

my-focus-key-word-on-top

The keywords for the post or page and always separated only by hyphens.

OK

Now pop on over to the left again and click "Appearance"

Click "Themes"

Click "Activate Suffusion".

Be prepared for a shock

But you will read what to do

It says

Don't panic!

I bet you never saw a WordPress theme back end like this before!

For the purposes of this thread please humour me for a while here Gentlemen and click

"Theme Skinning"

Before doing anything else please also right click on the word Suffusion on the top left just to the right of the left menu so that you open up the blog home page in another window.

Take a quick look and you will see you have a fairly boring looking page in a light grey.

OK back to the other window where you clicked "Theme Skinning" and scroll down a bit.

You will see

Gray Shade 1 on a dark theme
Gray Shade 2 on a dark theme

Please click Gray Shade 1 and click "Save" followed by "Save Theme Selection"

(You can change this at any time once we have gone though a few things in this thread but so we can see a few things easier and I don't have to put my glasses on please use grey theme 1 for now.

OK lets get everyone on the same page and give others a chance to catch up.

You will see a few changes already and now things really start to take shape. We will also need to install a couple of modifications so will go in to those soon to.

If you get bored waiting for others to catch up please go and "EDIT" the first post made by WordPress. Don't delete it just change all the details for your own purposes and repost it. Removing the comment is fine but leave the post .

You can edit the post title content etc etc but you will see an option to click and change the permalink of the "Hello-World" post

Don't do that, this is where a second 404 error page gets created if you do that.

[MrFlicks]

OK next up we need to install a couple of plugins

Please go to the left menu and click "Appearance" followed by "Plugins" "Install Plugins"

Type "WordPress SEO Yoast" in the search for plugins field and when you have Joost Van Der Valk's WordPress SEO in your sights click "Install Now"

Then click activate. You might want to take a look at your blog homepage separately for a sec here as you will see your admin bar across the top now has extra menu items. You can play with those later.

Next (this is optional but you might like it added as a bit of fun for users to rate cartoons etc)

Search again in plugins as above and search for "GD Star Rating" click install then click activate again.

Next you might as well add this as it makes a handheld device compatible version of your site for users of mobiles etc.

Search for "wptouch" in the plugins "install and activate"

Touch refers to "touch screen" which is how mobile users navigate. You likely will never even see this as you are busy so just let it do its thing delivering up mobile friendly versions of the site with no effort on your part but in the knowledge people can access your site nicely using mobile devices with those little screens designed to make opticians lots of extra money. (Each to their own LOL - Although Yes people use mobiles it is a pure myth that people will "only" use them in the future. That makes as much sense as saying "we have pasta we don't need potatoes any more".)

It might be your Dolmio day but some are still having fish on Friday and are still using their 5 year old PC's. That is a fact of life. Funny smelling talk trying to sell me stuff saying hand held's are the future and PC's are old hat reek of something that comes out of somewhere found under a Bulls tail if you get my drift.

Hmm bit of a tangent there LOL

OK next

This is where you need to humour me a few moments whilst prior to adding your posts, pages etc etc we add a little something for our use that can be edited as we like once we understand it.

We all want to display cartoons Yes?

Well all in this Project 1 do!

So please copy and paste the following temporarily for demo purposes in to the following.

Go to your admin dashboard and click "Appearance" followed by "Widgets".

On the right the seventh item is "Widgets above header"

Click it to open it.

in the left column of available widgets look for "Text"

Click on it and hold and drag it over to your "Widgets above header" menu item and drop it in there.

It will open up with two fields

Title and a body field with no title or name. Ignore the title we don't need that - you can if you like but I don't need an extra line of text as a title displaying in the following >

Please for demo purposes paste the following into the empty text field (the one I said was the body and not the title)

<table width="1000px" border="0" align="center" bgcolor="#333333" cellspacing="1" cellpadding="1">
<tr>
<td><div align="center" >
<a href="http://kd-mains.com/commission-cartoonist.htm"><strong>Hire Cartoonist</strong></a>
</div></td>
<td><div align="center" >
<a href="http://www.tted.co.uk/hire-cartoonist-illustrator.htm"><strong>Hire Artist</strong></a>
</div></td>
<td><div align="center" >
<a href="http://twitted.co/twitted-tweety-twitter/free-stuff/childrens-free-books-online/"><strong>Free Kids Books</strong></a>
</div></td>
<td><div align="center" >
<a href="http://twitted.co/twitted-tweety-twitter/free-stuff/childrens-free-colouring-pages"><strong>Free Colouring</strong></a>
</div></td>
<td><div align="center" >
<a href="http://twitted.co/twitted-tweety-twitter/services/twitted-advertising/"><strong>Advertising</strong></a>
</div></td>
<td><div align="center" >
<a href="http://hostted.net"><strong>HostTed Web Hosting</a>
</div></td>
</tr>
<tr>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/twitted-hostted-tted.gif" alt="tted the ted king of teds" border="0" /></a></div></td>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/twitted-twitter-tweeting.gif" alt="tted gets a drum roll" width="" height="" border="0" /></a></div></td>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/hostted-douobletteds-twitted.gif" alt="tted the ted teddy bear" width="" height="" border="0" /></a></div></td>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/doubletted-tted.gif" alt="Best Web Hosts" width="" height="" border="0" /></a></div></td>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/hostted-host-ted-teddy-bear.gif"alt="Most Reliable Web Hosting" width="" height="" border="0" /></a></div></td>
<td><div align="center"><a href="http://hostted.net"><img src="http://tted.co.uk/images/hostted-tted-king-ted.gif" alt="Best Value Web Hosting" width="" height="" border="0" /></a></div></td>
</tr>
<tr>
<td height=""><div align="center">
<a href="http://tted.co.uk/commission-cartoonist-simon-goodway.htm"><strong>Cartoons by Simon Goodway</strong></a>
</div></td>
<td><div align="center">
<a href="http://twitted.co"><strong>Competitions</strong></a>
</div></td>
<td><div align="center">
<a href="http://tvworlds.com/forum/register.php?referrerid=2"><strong>TV Worlds </strong></a>
</div></td>
<td><div align="center">
TwitTed The Twit Ted
</div></td>
<td><div align="center">
<a href="http://twitted.co/team-twitted/index.php"><strong>Team TwitTed </strong></a>
</div></td>
<td><div align="center">
<a href="http://www.tted.co.uk/commission-a-cartoonist.htm"><strong>Tted The Ted King of Ted's </strong></a>
</div></td>
</tr>
</table>
</div>

Now if you look now you will see nothing happened on site.

So how do we make it display?

Pop over to the left menu and click "Appearance" then Suffusion Options"

IN the menus on page click "Magazine" and pick the layout you want..

I am going with a "Double Right side bar"

Also click Show Post and show content in two of the following fields.

After that please go to "Theme Skinning" then click the third option "Header" and on the second set of options set "Header is inside the main wrapper" and save.


Check your site and you will see a Double T Ted's cartoon strip. Simon's one as it happens.

Now I am going to post this before I accidentally delete the post and will continue with an explanation as to what we have done and why and what can be done with this.

So has everyone got my Temporary" cartoon strip displaying on their own site?

PS I am using tables here and yes tables are being replaced by CSS and HTML without using tables and at some point I will work that one out but for now Tables will work fine they just won't work on hand held's.

[MrFlicks]

The next thing we will be doing is sorting the "sidebar widgets"

Like I said I am going to use a "double right" side bar - you choose your preference
we will continue once everyone is happy they are up to speed thus far.

I will go in to the aspects of what we have so far done with this display we have added first though.

[MrFlicks]

oops I accidentally deleted a previous post (Sorry )

I have been giving JP a hand and here is what I have done so far >

http://hirecaricaturist.com/UK-Artist/

You can see his images at the top one of which clicks through to his client list and one that when clicked takes people to the blog index page which it probably should (unless there is a special page that wants to be used for - which of course can change at any time at will).

So how is everyone doing - anyone need a hand?

[while]

thanks for all of these.