In this blog series, we've been focused on our blog signatures and how we can best utilize this part of our digital presentation. You've worked hard on a blog post and have connected with your reader. What will you offer them next so they can stay with you and not move on elsewhere? This is where your blog signature comes into play. This is part 3 of the series and we are on the final stretch! (note: if you want to catch up on part 1 or part 2, you can use those links to get there)
In the illustration below, you'll see the example that we are using to demonstrate what can be done. Your signature might not include a map like Nick's but maybe just a photo or two. However, I'm sure you have some ideas by now! In our ActiveRain settings, we can indicate what we want to show up automatically after each of our posts.
In order to set up your blog signature, you need to click on your photo (avatar) in the upper right corner of the page above, choose "My Home". Once there, on the left hand sidebar, look for and click on "Blog Settings". On that screen a few items down you'll see the box where you can set up your blog signature. I'm going to give you a tech tip right now though: Don't compose your blog signature here! Instead start a new blog post draft (a post that will never be actually be published). Unlike the blog settings page, a draft post has two advantages. (1) the editor box is bigger and gives a little more room to compose in, and (2) on a blog draft post, you have a "preview" button that you can see how your creation is coming along and you can get it just right before you commit to it. Once you are happy with your creation, just copy and paste it into the blog settings screen.
So, now that you are on a new draft blog post to create a signature. Let's take the first step from our example. You probably are familiar with the concept as a table in page layout apps. We're working on the web, but similarly Microsoft Word has tables for layout. Microsoft Excel spreadsheets are essentially big tables. Tables have cells for content, you can organize into rows and columns. In our case, we need a very simple table. One row, two cells (or two columns). The reason why a table helps us keep things neat is because if we have text on the right column and there happens to be more content on the right than on the left, we don't want it to wrap around the image and come over to the left margin. Our table cell creates a hard boundary that contains our text where we want it.
In ActiveRain blog editor, notice on the toolbar there is a button for creating tables. Once you click it, you will have a pop-out that allows you to indicate how many rows and columns you want your cells to be. See the illustration below, we want just two cells across.
If you are familiar with the main content area of an ActiveRain post, this width is 700 pixels wide (good to know when you are formatting your photos for posts). However, the signature area is padded with extra space which leaves us only 680 pixels for our signature. So, immediately after you create the table, click the table button (pulldown) one more time and click on table properties. In the dialog above you can see how to set the 680 width. (See the snapshot below if you are curious about how we determine the width by using the "Inspect" tool in our browser window).
After you set the overall width, next click to set your cursor in the left column cell. Once there, go back to the table button, this time choose cell > cell properties. You'll need to set the width of the left column to 340, which is exactly 50% of the total. This step is important as it helps us create white space between the left and right sides as you will see below.
In the left cell of the table, we simply need to insert the image (composition) file that we created in part 2 of this series. Important Note: the width of the inserted image is very critical. In the image properties box that pops up when inserting images, set the width of the image to be 330 (see example below). If you don't set the width, your two equal column layout will not work. Also, by setting 330 (shy of the 340 halfway point), there will be some white space between your image and the adjacent text making it more readable. Tech tip: when you set a specific width in the image dialog box you'll need to either Tab to or click in the height edit box. Notice the "constrain proportions" setting is, and should be on. But until you click in the next box, it doesn't actually recalculate the height. If you insert without doing this, your image will be very oddly stretched.
Now, on the right cell of the table, we can begin entering the text that we want to show.
As you enter the text in the right column, you'll note that it is aligned vertically in the middle. As you add more text, the right column will grow taller and the left and right columns will become more equal in height. Using a 12 point font is something you may want to consider for better readability. (select your text and then use the toolbar to set your font height). Also, time for another tech tip that many aren't aware of. Paragraphs are typically styled on the web to have space after in order to separate it from the next paragraph below. Sometimes when you press ENTER you don't want that extra space between. For example you are typing out your address which is multiple lines tall. Press Shift+ENTER after each line and you are inserting what is called a "line break" (i.e. new line, but same paragraph). That way your text will not have the extra white space between lines since you are not ending the "paragraph".
One of the mistakes that I see far too often is the "too much information" or TMI syndrome in a signature. (hint: if you have to scroll to get from the top to the bottom of your blog signature, that's a clue that it is too long) Let's pick just the essentials and give them some really useful choices to work with. For starters, your name (don't forget that!) and a short bio paragraph is helpful that explains the basics about who you are and what you do is a good starting point. Your phone number is also a critical piece of info if you want to hear your phone ring. Your website link is also a critical funnel element. (I find it extremely distracting when people show several website addresses, pick one - your main target destination and show that). I like a link that says either "My Blog" or "See my other recent posts" which points to your blog home page which lists all your posts. That may seem unnecessary but a guest to ActiveRain may not be aware of any other easy way to find your other posts. It is very convenient for us to give them a quick way there. Finally, a link that enables them to email you is also very useful. However, a word of caution, using a mailto: link in plain text on a website is an invitation for email spambots to harvest your email address and add you to their spam list. I recommend that you have your email link go to your website contact page where you should have a contact form where your email address cannot be harvested.
Are you still with me? Time for a seventh inning stretch?? ⚾⚾⚾
I know this all may seem like a lot, three fairly long blog posts about this topic to get here. I hope you see the potential! A little time invested has a valuable and worthwhile result. We still have to talk about social media icons. (I'm tempted to go to part 4 post, but hang on with me just a little more and we can close out this series now... and I can move on and blog about something else LOL)
First of all, let me say Craig's rule about social media icons. If you don't post to a platform, don't show your social media icon for that site. For example, you may have a twitter account, but only tweeted once in 5 years. If that is the case, let's not show twitter. That is just a frustrating experience for somebody clicking to go to a place where there was no benefit (remember this is our opportunity to build TRUST). The typical social sites you will probably consider showing are: Facebook (page), Instagram, Twitter, LinkedIn, Pinterest, and YouTube. Again for emphasis, if any of those sites are not your thing for posting content (yet), then do NOT show your icon until if and when you do have a meaningful presence there.
If you search google for "free social media icons" there are all kinds of results. But as you read the fine print, most require attribution. You could put it in small text somewhere but to me this is just a nuisance I want to avoid. I've been looking around for some that do not require attribution and iconmonstr.com is one site that thankfully does not require attribution (however, I am happy to plug them here now) And as a bonus gift to you for sticking with me through this entire series, I've made it one step easier for you. If you like the gray circle icons shown above, you can copy/paste them from this post into your own signature editing screen. I have already downloaded them from iconmonstr and uploaded and formatted them to a good size. The only thing left for you to do is create the hyperlinks to your own sites.
The final result of our three-part series on blog signatures will produce something like this: