Posts Tagged ‘WordPress’

WordPress announced its new Learn WordPress.com site.

This online tutorial is ideal for beginning and intermediate WordPress.com bloggers and for folks who are migrating over from other blog platforms like Blogger and TypePad.

NOTE: For those of you who are not familiar with the WordPress platform, there are two flavors of WordPress – WordPress.com the free site and WordPress.org blogs which are custom install versions. You can get more information on the differences here.

The Learn WordPress.com tutorial breaks down the blog learning experience into 10 sections and also has an easy-to-print version (66 pages of learning fun). The site is well organized and does an admirable job addressing the gazillion ways in which people can blog.

As you may know, I have my own Getting Started With WordPress.com online class as well (launching soon). As far as I’m concerned, the more options to learn blogging, the better. My blog class includes my direct feedback and guidance on blogging topics, for those who need a little bit more than 100% self-serve learning.

I’m honored to have one of my WordPress.com video tutorials as part of the official WordPress.com curriculum. WordPress links to my “Using slideshows on WordPress.com” tutorial on its “Get Flashy” page.

Check out the Learn WordPress.com site and let me know what you think.

Here’s the Using Slideshows on WordPress.com video to get you into the WordPress.com learning mood. Enjoy!

If you liked this blog post, you may want to sign up for the RSS feed, email, “Like” and share the post, and join us on Facebook.

Photo Credit: @tiabel on Flickr, by special permission.

I use Google Analytics to track activity to and from my blog. Unfortunately, there are a lot of holes in that process, especially related to Twitter clickthroughs.

• First, some users bookmark the page, then revisit the site. These visitors are great because they found value in the site and are coming back for more. However, there is no way to tell if someone actually bookmarked the page or if something else happened.
• Other visitors arrive here by clicking on a link from a mobile Twitter application. Several of these applications remove the “referrer” information which causes another question mark when I go to check stats.
• If a visitor is using Internet Explorer and clicks through on a link from a site that uses a JavaScript popup, then the referrer information is lost. This sounds like a minor case but if you’re doing hardcore tracking to drill down on a marketing campaign’s ROI, this factor can be maddening.
• Lastly, if a visitor clicks on the Tweet Button and posts a link to Twitter, the URL is “automagically” shortened via Twitter’s link service (http://t.co). If a user clicks on a tweeted out link, you’ll know that the visitor came from Twitter but you won’t know where the link originated. Did a user get there from clicking on a Tweet Button link? Did someone cut and paste the blog post’s URL from the Web browser into a tweet? Inquiring minds want to know.

The Benefits

Before I started using this Google Analytics tracking technique, 16.8% of my traffic was showing up as “Direct Traffic.” After I started tracking Tweet Button clicks and Feedburner subscription clicks, that number went down to 13.45% and a new “Other” figure emerged.

This is awesome because now I can examine the behavior of visitors who click on the Tweet Button. Do Tweet Button visitors stay longer, visit more pages, or take key actions? Now I can answer some of these questions when before it was a mystery.

Because a good chunk of my blog’s traffic comes from Twitter interactions, you can see that the TweetButton clicks are in the site’s top 10 Traffic Sources. I can also see individual stats related to these visitors such as Bounce Rates, Time On Site, Goal Conversions and more.

The Hack

We’re going to address the last case with this next hack. In order for this to work, you won’t be able to use the standard Tweet Button plugin. We’ll have to add the button by hand.

1. Go to the Google URL Builder Tool page.
2. Enter your site’s URL.
3. Enter the Campaign Source, Medium, and Campaign Name. I used “Twitter”, “TweetButton”, and “Blogpost” respectively.
4. Click on the “Generate URL” button. This will build a link just below the button.
5. Copy the link. We’re mostly concerned with the end of the link, starting with the “?” mark.
6. Paste this code into your theme’s Header or Footer template files. I placed the code just before the < /head > tag in the Header.
   [php]<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>[/php]
7. Configure your Tweet Button HTML code as in this example (for WordPress.org blogs): [php]<!–Twitter tweet button–>
   <a href="http://twitter.com/share"
   data-url="<?php the_permalink(); ?>?utm_source=twitter&utm_medium=tweetbutton&utm_campaign=blogpost"
   data-via="jesseluna"
   data-text="<?php the_title(); ?>"
   data-related="niceblog:My Blogging Lab"
   data-count="vertical">Tweet</a>

   <!–/Twitter tweet button–>[/php]

   The main “hack” comes from the data-url parameter value where we add the Google Analytics formatted tracking parameters, just after the Permalink. This way, when Twitter shortens the link into it’s t.co format, the link value will contain the tracking information.

   In the above example, “data-via” is the Twitter user name that will appear on the tweet as “via .” “Data-text” is the text I want to display with the link.  In this case I’m displaying the post’s title.  “Data-related” is an optional related account that can be displayed. In this case I’m showing my blogging Lab account, @niceblog. The “data-count” value indicates how you want the button to appear on the screen. I chose a vertical format. You can see all the options on the Twitter Tweet Button blog page.

8. For WordPress.org blogs, paste the edited code into the Page, Single Post, and Main Index template files. I added the button just before the blog post content, after the title and date/author section of the templates. This will vary based on your preference and on other tweaks you’ve made to your theme.

I tried hacking Posterous and Tumblr blogs but the built in URL template tags kept blowing away the parameters once the Tweet Button was called. If you figure out how to do this please drop a comment and I’ll update this post.

Review

We just learned how to tack on a Google Analytics parameter to Tweet Button clicks on a WordPress.org blog. This will help you connect the dots on your online marketing and analysis activities.


If you find this useful, I’d be interested in how and why you would use it. Are you a marketing manager, a small business owner, or a code hacker? I’d love to find out.

You don’t have to buy a book and take a seminar or ever buy a fancy blog theme to crank up your blog’s SEO Super Powers.

These top tips will help you zoom up the organic search rankings without breaking a sweat.

1. Use friendly post and page URLs for your new blog.

Quick Note: This tip works best for new blogs. See the BIG NOTE at the end of this item.

When you set up your blog, you will have the option to configure the way your page and blog post URLs are formatted. Search engines love URLs that contain meaningful and related keywords.

Good: http://< mydomain >/awesome-blog-post-title-with-keywords

Bad: http://< mydomain >/?p=45

The standard WordPress.org custom install defaults to the “Bad” URL structure. If you want to drive search traffic to your blog, switch the structure to one that includes the post’s title. In WordPress, you can change the settings from Dashboard > Settings > Permalinks.

In Tumblr, Go to Customize > Advanced, then scroll down and check on the “Use Descriptive URLs” checkbox.

Posterous has an SEO-friendly URL structure by default. This is an example of a Posterous URL: http://jesseluna.posterous.com/curating-tweets-on-flipboard-by-using-twitter. The URL is friendly to read and search engines like that.

Big Note: If you’ve had your blog for any length of time, changing your URL structure can have a huge negative traffic impact. Search engines will have already combed through your blog pages, indexed things and added them to search results. If you’ve had your blog for a while but don’t really care about past “traction” on search engines, go ahead and change the structure.

2. Use targeted keyword terms in your blog post titles.

Try to use one or two target keywords per blog post title. If you have a blog focused on non-profits then “How to talk to small nonprofits: A guide for vendors” is a great title. The title hits on two key terms, “nonprofits” and “vendors.” A Web search over those two terms would likely position that blog post on page one of search results.

An additional tip is adding a combination of not necessarily related keywords together. For example, I did a post on a Tweetdeck’s ability to post to Tumblr and now that post shows up in the number 3 spot for the search term “Tweetdeck Tumblr“, which ranks higher than tumblr.com, second only to Tweetdeck.com.

3. Use “Alt” tags on images.

Every time you use an image on your blog, add meaningful text to the “ALT” tag.

This is the structure of an image tag in HTML:

< img src="my-awesome-image.jpg" alt=”My-awesome-alt-tag-description” />

[Note: in this and other HTML samples in this post, I'm inserting extra spaces at the beginning and end of the text to keep WordPress from rendering the code. Just a warning in case you do any cutting and pasting.]

When search engines parse through your web site, they index image Alt tags. When more of your site is indexed, that means there’s more of a chance your site will show up for related searches.

Alt tags are also very important for accessibility reasons. Meaningful tags give blind and visually challenged readers a description of the picture which can help with context.


In WordPress, you can set the image Alt tag when you select an image:

In Tumblr, the “Caption” field in the Photo Upload tool will be the image’s Alt tag.

Posterous – As far as I can see, there is no way to set the Alt tag on a Posterous blog post image. Bummer.

4. Set “keywords” and “description” meta tags

Meta tags are bits of information that may be added to Web pages to help describe the contents of the page. The contents of the tags aren’t displayed on the page but search engines use the information in the tags to help rank pages and to help display them properly in search results.

I never meta tag I didn’t like. -Old webmaster’s joke

The two main meta tags are the “description” and the “keywords” tags.


Description meta tag
The HTML for the meta tag will look something like:

< meta name="description" content="This is my awesome two to three sentence, keyword-rich, description of this page. This is my second awesome sentence." />


If you want to get crazy with the description, you can use Google’s Webmaster Tools to get feedback on whether you tried to jam too much information into your description meta tag.


Keywords meta tag
Here’s the HTML for the keywords meta tag:

< meta name="keywords" content="Awesome-keyword-one, Awesome-targeted-keyword-two, Awesome-descriptive-keyword, Awesome4,Awesome5,Awesome6" / >


You will add highly relevant keywords instead of my “awesome” ones above. The keywords should be highly related to that specific web page and to the site. You don’t want to put too many keywords there. I usually keep the list to under 20 unless there are 25 products on the page or something like that in which case I list them all.

If you’re not sure which words best describe your page, you can use an offbeat tool like Wordle.net to visualize the page’s top keywords.

The image below is a Wordle.net keyword visualization of the YouTube Adds New iPad-Friendly HTML5 Video Player blog post. I copied the post’s text, went to the Create tab on Wordle.net then pasted the text into the “Paste in a bunch of text” field and ran it.

The diagram points out that the main page keywords were “player”, “html5″, “YouTube”, “Video”,”iPad”, and “Embed” because they were used the most in the post. Of course, if you have special target keywords that should be associated with the page, you’d want to list those as well in your keywords meta tag.

WordPress.org custom install blogs
In WordPress, to add meta tags you need to add a plugin that allows you to either set the meta tags or “builds” them dynamically based on some criteria. The most popular plugin is the All in One SEO Pack. This plugin is available from the WordPress Plugin Directory. Once you install and activate the plugin, you can set it to build meta tags for each post based on the post’s tags. There are also a ton of other knobs and do-hickeys that you can set but describing them all is beyond the scope of this post.

Tumblr
If you are using a Custom Theme setup, you can set the meta tags but only on a global scale. In other words, you can’t set them on a per post basis. You can set the meta tags by going to Customize > Theme then setting the meta tag somewhere between the opening “< head >” tag and the closing “” tag.

Posterous
Posterous allows for custom meta tags but, like Tumblr, the tags can only be set on a global scale, not per post. You can set the meta tags by going to Settings > Look and Feel > Edit Theme > Advanced. Expand the area and you’ll see a couple of other meta tags. You can add your keywords and description meta tags immediately below those.

Review

We just learned how to use four key SEO tips and tricks to boost your search engine rankings and attract more site visitors. These techniques work with the content, not the other way around. You should never compromise your writing to make things more SEO friendly.

I will be adding more SEO tips in the comments over time (I didn’t want to overload you with this initial post). Feel free to comment and to leave your own tips and questions.

This post was made to be shared with the world. If you like it, set it free and share it.


Additional Resources: Google’s Search Engine Optimization Starter Guide (PDF, 560KB)


Photo: Purchased via iStockPhoto

The secret is out. Video blogging is a powerful way to engage blog readers. Video adds another multimedia dimension to a blog, it helps create a closer bond to readers, it reinforces your blog’s message, and it is great for expanding your message to other social networks, especially YouTube.

I started messing around with Web video back in 2005 while testing out the kids toy, the Vidster. At the time, I had no idea how to embed the video into a site or blog (I wasn’t on YouTube until 2006). Now, things are much easier and there are a variety of ways to get started.

Getting Started

If you don’t already have a YouTube account, do yourself a favor and go create one now. I’ll add you as a friend and subscriber if you drop me a message (I’m @cinemaluna on YouTube). YouTube is a top 5 global site and has its own rich ecosystem. And, you don’t have to “live there” to get many of the benefits.

Equipment

Dude, I dont’ even have a camera.

If you have a computer and an Internet connection, you can start recording video right now. You don’t even need a camera. You can go to Screenr.com, and do a screen recording of your computer. I do this all the time to create video tutorials and it’s a great way to add video to your site. Screenr allows you to record, embed, tweet out the video link, download the video to your computer, and upload the video to YouTube. Screenr has a 5 minute maximum on screencasts.

The process of recording your screen is called “screencasting.”

Here’s a screencast I did for a WordPress.com tutorial. This video content was actually featured on the WordPress.tv site.

Or, you can go to Animoto.com and create a video based on photos. Animoto uses an ingenious system that can combine photos, video, and text then “automagically” generate the video by matching the multimedia elements to the selected soundtrack. Here’s a simple video I created using pictures (plus a micro video) from my “staycation” a few months back. The free version of Animoto limits the video to around 30 seconds.

Wait a minute, I have a little video feature in my digital camera. Can I use that?

Many newer digital cameras have a video feature. You might only be able to record a few seconds but that’s all we need to get started today. I have an “old” HP Photosmart 320 digital camera that I bought years ago and even that has a 30 second .AVI video feature. You can use a site like http://media-convert.com/ to convert from older and non-YouTube supported file formats to a more current format. Note: I haven’t actually used Media-convert.com so use at your own risk.

In case you’re counting, this is our third way to get video up to our blog today.

I also have an old-school digital video camera. But I’ve only used it to edit things in my computer. Will that work?

If you have the right cable connection for your older digital video camera, you’re in business. I have a JVC digital video camera (model GRDVL517U) that I bought around 2000, that’s 5 years BYT (Before YouTube). I can plug in the digital video cable and connect it to my PC and have access to all the video files.

If you’re going to use an older camera like the JVC then you may run across issues like missing cables, lost mini-dv cassettes, and missing user manuals. If that is the case then you can still find many of those items, but the older the digital video camera, the higher the price you’ll have to pay. My JVC user manual is over $10, and that’s from the JVC site.

That would be the fourth way to add video to your blog.

Wait a minute, we gave my kid a little camera a while back. Would that work?

There are actually several toy cameras out there that record digital video. Cameras like the Vidster by Mattel and RipRoar’s Creation Station sold for around $80 and they both record digital video. I purchased the Vidster, uh, for myself, back in 2005. Both of these toy video cameras come with cable connectors and you’ll need them to access the digital video files. You may also need to download the software for each.

Even though there are two cameras here, I’ll only count this as one way. We’re up to five ways to get video onto your blog.

I do have a web cam, but I’ve never used it.

Now’s the time. Fire up the Web cam, go to your YouTube account, click on “Upload” at the top of the page, then select “Record from webcam” and you should be able to connect and record your video. Your cam will also come with some kind of software. You can use that if you’re not ready to dive into the YouTube pool.

A web cam is the sixth way to add video to your blog.

My cell phone records video. I assume that’ll work?

You betcha. You can record on your video-enabled cell phone and send it to your email or you can post it to one of many video posting services. I’ll list those sites towards the end of this post. I use my iPhone video as a promotion machine.

That was the seventh way to add video to your blog.

I’m hip, I use Flip. Don’t hate, I also use the Kodak Zi8

Flip video cameras are small, easy to use, and very powerful. I’ve been using a Flip Mino HD for the past year and it’s served me very well. Even though the Flips have been out for a few years, they are still very cool and discreet. There’s a big difference between recording using a Flip vs. one of those huge paparazzi cameras. You’re less likely to get the stink eye from people if you’re out recording in public.

I just got the Kodak Zi8 (thanks again @sugarjones) and so far it’s the bees knees. I’m still testing it out and have only posted one video to the site so far.

Once again, we covered two cameras but we’ll count that as one more way. That was number ocho.

How To Embed Video Into Your Blog

Thanks to YouTube, embedding videos into blog posts is super easy. Once you get your video uploaded to YouTube, all you have to do is get the Embed code and add it to your blog.

Here are some blog by blog specifics.

WordPress.org (custom install) blog

Just paste the embed code into your blog post area and Save. That’s all you need.

WordPress.com

Paste the embed code or paste the video page’s URL into a shortcode field. Actually, if you paste in the Embed code then save the post, WordPress.com will turn it into a shortcode for you. This is an example of the YouTube shortcode:” [ youtube=http://www.youtube.com/watch?v=v1zJJGLJ714&hl=en_US&fs=1&rel=0 ] ” .

Tumblr

Log into your Tumblr account, click on the “Video” button then paste in the Embed code and create the post.

Posterous

Log into your account, click the Settings button in the upper right part of the page, then click on the “Posts” tab. You’ll see a big “Post by Web” button, click on it. Paste in the Embed code and add a Title then click on the huge “Post” button.

We’ll count each blog type as one way. We’re up to twelve ways.

Blogger

Log into your account. Create a new post, switch to HTML Edit mode, paste in the Embed code and you’re all set.

TypePad

Log into your account, create a new post, click on the Edit HTML tab, paste in the Embed code and that’s it. I haven’t used TypePad for a while so please correct me if this process has changed and I’ll update things.

And, we’re at fourteen ways to add video to your blog. But wait, there’s more!

How do I resize the YouTube player. No offense, but it looks horrible in my blog at the default sizes.

You’re in luck. I wrote a blog post entitled, “How To Create and Resize A Custom YouTube Player.” The YouTube interface changed since the blog post so there may be some differences in the way things work though.

Other Very Cool Video Sites

Do I really have to use YouTube for everything? What are some other options?

You don’t have to use YouTube. There are many other video sites out there. I’ll list a few (so I can get to 20 ways ;) )

12Seconds.tv

This is a great site and one that I have used many times. 12Seconds.tv allows users to record, upload, or post mobile uploads of 12 seconds of video. If you’re intimidated by the camera, this is a great way to do a super quick post. You’ll have to be brief!

Vimeo

Vimeo is similar to YouTube only it’s a smaller community. The Vimeo video player is less clunky looking than the YouTube one.

Viddler

Viddler, a favorite site of mega video star Gary Vaynerchuk, is also a smaller video community. A smaller site means you can build a stronger following and have a chance at communicating with the company.

We’re at 17 ways!

I do everything via my iPhone. What do you have for me there? Any mobile app suggestions?

Once again, you’re in luck and these iPhone apps will take us to the end of this post’s journey.

Animoto

Yup, Animoto has an app that allows you to create videos from your iPhone. It works almost exactly like the Web version that we discussed above.

Qik

We didn’t really get into streaming video but the Qik iPhone app allows your 3gs phone to stream live video. You can then log into the Qik site and access the video and add it to your blog. Or, you can get crazy and embed a Qik player on one of your blog pages and have it stream live from your blog!

UStream Broadcaster

UStream is another streaming video site and it has an iPhone app.

Reel Director

Reel Director is a paid iPhone app. It allows you to edit video and combine photos, video, and text. It’s similar to Animoto but bumps things up a notch. This is a bonus “way” to add video to your blog today.

I’m looking forward to seeing your video creations, whether they are life vloggings, sales promos, tutorials, documentaries, or interviews.

I appreciate your feedback and look forward to continuing the conversation in the Comments.

Apple released the iPhone IOS4 software update late on June 21, 2010. The update took well over an hour to download and then sync up with the iPhone but it was well worth it.

Among the many new features, the new IOS4 update allows for the iPhone to work with wireless Bluetooth keyboards. I took the new feature for a ride and started blogging.

Did you find any other cool features in the IOS4 update? Drop a Comment below and share.

I love creating Web/blog sites and tech tutorials. Mash those two interests together and you get the video blogger WordPress theme, CineVlog.

Features of CineVlog

• Extra wide sidebar, ready to display a huge picture or a nice sized YouTube video.
• Dark theme, perfect for late night video watching.
• Green glow highlights to make important sections POP.
• Drop-down sub menus
• Dozens of hours in development time and months of live testing. I used it on this site for several months.
• VIEW CINEVLOG LIVE AND IN ACTION

FREE Download of CineVlog

• Download the CineVlog .zip file (340KB)
• VIEW CINEVLOG LIVE AND IN ACTION

Installation

To install you must extract the CineVlog theme and post the”CineVlog” directory and all its contets it to your WordPress blog’s “themes” directory. You can find more information on using Themes on the official WordPress.org site.

Software Notes

This software is available with no warranties, use at your own risk. This code is available AS IS. You can modify and redistribute this theme as you like but unless you make substantial changes to the code please keep this site’s URL (www.jesseluna.com) at the bottom of the footer page.

Karma Ware

The software is available via Karma Ware. Dozens of hours of development time and hundreds of cups of coffee went into this project.

If you’d like to say “thanks” and continue supporting free projects, please feel free to:

• Send money via the PayPal button below. The money will be used for my personal spending needs (coffee) and as my fund for making donations to worthy causes.
• Hire me to build your custom WordPress theme creation (email me at jesse dot luna at gmail dot com)
• Share this page and site with the world via your social networks (Retweet, “Like” it and Share on Facebook)
• Subscribe to this blog via email or RSS (see top right part of this page)
• Join JesseLuna.com on Facebook.
• Share a Comment on this page
• Do something nice for someone else who is in need
• If you use the CineVlog theme, I’d LOVE to see what you do with it. Leave a link below in the comments.















Photo Credit


• gunjankarun on Flickr – license