Connecting with readers...

Many times I'm on a blog or a writer's webpage and am amazed that I can't easily find out how to get in touch with them. Some have forms where you can leave a message, but to be honest I'm put off by them. Why can't I just send them an email? I don't understand why authors put a barrier between themselves and others. So today I'm going to mention some tips to make sure you are easy to reach.

• You may notice a series of buttons at the top of this post. They are "quick links" to all the important places that are relevant for me: The Ridan Publishing site, a link to send me email, the "first page" of my blog, twitter, facebook, my inperson meetup group, and a link so they can sign up for my newsletter. These "button bars" ideally should show up at the top and bottom of every post you make. That way if someone is reading your post and like it and want to reach you, they are just one click away. This is something I should have been doing (even I am neglectful of good practices sometime) so you'll see them from now on.
  
  
• Contact page - Every blog should have a "contact page" If you've used up all your tabs then make your "About me" also your contact page. When someone arrives at the page then don't present them with a form, instead give them a table of ways to reach you (see my contact page for an example)
  
  
• List all your platforms. Think about all the places you interact do you have a goodreads group? Then you should add that as well. What about a forum? Better get a link for that one as well.
  
  
• Do you have a link to your contact information as a signature line when you post to someone else's blog? No? If you are out there interacting and people like what you're saying why are you making it difficult for them to find you?

HOW TO MAKE A BUTTON BAR
For those who would like to make a button bar similar to the one I'm using I'll give you a helping hand.

• Getting buttons to line up is really quite easy if you use a table. I'll show you how in a minute
  
  
• Sometimes making the graphics can be a challenge - So I'll let you use mine. If you want to make ones of your own make the "colored portion" 41 x 41 and then but a 1 pixel white border around them so that they are 43 x 43 and then all your buttons will be the same size.
  
  
• You'll need to know how to add .html code to your site or your blog. I use blogger and as I type there are two tabs "compose" that shows how the post will look and "edit html" which shows the "code" that is a combination of commands (enclosed by <> symbols) and the text.

Let's look at the code to make the button bars. NOTE: If I put the code in "exactly" then you'd see the "results rather than the code" so in the example below I'm going to use square brackets ([ ]) as a replacement for the pointy brackets (< >). If you copy/paste this code be sure to do a global search and replace first.

[p][table align="left" border="0"][tbody][tr][td][a href="mailto:robin.sullivan.dc@gmail.com" target="_blank"][img src="http://bitly.com/niWSgk" border="0" /][/a][/td][td][a href="http://bitly.com/lQljrE" target="_blank"][img src="http://bitly.com/nbG62a" border="0" /][/a][/td][td][a href="http://bitly.com/qmx8sX" target="_blank"][img src="http://bitly.com/rmHYzV" border="0" /][/a][/td][td][a href="http://on.fb.me/pfDtfW" target="_blank"][img src="http://bitly.com/nbCQSL" border="0" /][/a][/td][td][a href="http://bitly.com/nIF63x" target="_blank"][img src="http://bitly.com/nvJnGg" border="0" /][/a][/td][/tr][/tbody][/table][/p][br/][br/]

Don't worry if this looks like complete nonsense, we'll be going through it step by step.

• The first thing to realize about .html is most commands have a start and stop. The stop is designated by and the stop by . These will always appear in pairs.
  
  
• In some cases a command may have a start and stop in a single command and that is shown by

Let's look at the various commands used in this snippet.

• p - is used to denote paragraph begin/end
• table - is used to indicate the start/end of a table
• tbody - is used to indicate the body of a table
• tr - is used to denote the start/end of a table's row
• td - is used to denote the start/end of a table's cells
• a href - is used to indicate the URL of a link (the start/end shows what will be hyperlinked)
  
• img src - is used to indicate a graphic - and only one is needed
• mailto: - is used to indicate that an email should be started rather than a webpage
• br - is used to inicate a new line - and only one is needed

Note that in html codes nest, such that a table with two rows that have words one, two, and three in separate cells on the first row and four, five, and six in the second row would look something like this (but would need < replaced for [ and > replaced for >:

[table][tbody][tr][td]one[/td][td]two[/td][td]three[/td][/tr][tr][td]four[/td][td]five[/td][td]six[/td][/tr][/tbody][/table]

In our html example I'm using bitly urls (so that I can track them) but it makes it harder to understand - You can highlight any of the urls and paste them into a browser to see what they go to but I'll also explain them here:

• http://bitly.com/niWSgk - email graphic
• http://bitly.com/nbG62a - blogger graphic
• http://bitly.com/rmHYzV - twitter graphic
• http://bitly.com/nbCQSL - facebook graphic
• http://bitly.com/nvJnGg - newsletter graphic

You can use these same URL's so that you don't have to worry about posting your own images or uploading them to your blog.

What you will also need are URL's for where you want each button to go to - why you don't have to use bit.ly you should as it will track results for your.

Okay, now we can explain the code snippet

• We start out with codes to: start a paragraph [p], start a table that is left aligned and has no board [table], start the body of the table, start a row, start a cell
• Then we use an [a href] command to indicate where to send an email to - you can replace the address with your email. The target="a_blank" indicates whether a new window should be used or not. This does not always work for emails but it will for webpages.
• Then we have the email graphic, with no border [img src=]
• then we close the hyperlink [/a], then the cell [/td], then start a new cell [td]
• Then we have a link for the URL for my blog, followed by the blogger graphic, then closing the hyperlink, cell, and starting a new cell
• Then we have a link for the URL for my twitter account, followed by the twitter graphic, then closing the hyperlink, cell and starting a new cell
• Then we have a link for the URL for my facebook account, followed by the facebook graphic, then closing the hyperlink, cell and starting a new cell
• Then we have a link for the URL for to sign up for my newsletter (I'll explain how to do newsletters in the future), followed by the newsletter graphic, then closing the hyperlink, cell
  
• Finally we close the row, the table body, the table, and the pararaph
• Then we add a few blank lines so that the "text" of our post will show up below the buttons

And that's it. What I suggest is that you make this once by using notepad and save the file. Then each time you start a blog do the following:

• Switch to Edit HTML tab
• Paste your code (top of post)
  
• Skip down a line and type some text like: xxx
• Paste your code (bottom of post)
• Switch to compose mode

And there you have it. Having links right at people's finger tips makes it easy for them to get in touch with you. If you have any questions or problems be sure to let me know.