Archive for how to

Offline Blog Editors: w.bloggar

One of the neatest programs to take the blogging world by storm (somewhat) has been Windows Live Writer, a program from Microsoft that allows you to create drafts, and publish to your blog from just about anywhere, no browser needed. I almost got to the point of downloading it, but then I thought of a program that was already on the computer.

The program is one that had laid dormant for quite a while, but is now again in part-time development - w.bloggar, a piece of freeware developed by a guy in Brazil, who has had this around for quite a few years now. It was the first offline editor that I had used (mostly because it worked with Blogger, and allowed me to quickly edit posts without having to deal with Blogger’s old system of constantly having to republish the blog every time you made a post.

There are obviously other offline editors out there (most notably WLW, which I have not used, but almost downloaded before digging this program out of the archives), but w.bloggar is the one that I’ve used almost exclusively, unless you want to count EditPad as an offline editor (which is just as valid) ;) .

Getting started

When you download the program (if you want to use a portable version, that is available as well as a full version that can work with either Internet Explorer or Mozilla with an installer), you can go ahead and install it, or just run if if you downloaded the portable or zip versions. Now, since I’ve already got it installed and set up, I will just jump to getting your blog set up on here.

The program works as an extension of your blog; when you first start up the program, you may be shown this screen -

If you do start with that screen, then you’ll need to click on the little button next to the drop-down box and select new. This will bring up the new account wizard -

As you can see, you don’t even need to have a blog to get started with w.bloggar, but for the case of this tutorial, I’ll show you how to go about making a new account for a blog you already have (it’s fairly self-explanatory, so the screenshots will just be a guide).

The first screen you’ll see after selecting that you want to add your current blog as a new account is one where you can select which blogging platform you’re using (the program supports a whole host of them), along with setting an alias for the blog you’re setting up. For this tutorial, I’ll use my testing blog and aptly call the account Sephy Test.

In the next screen, this is where you put in the information about your blog - since I like to keep my test blog’s address somewhat quiet, I’ll leave the sample stuff in there for the shot. Anyway, simply put in the address of your blog (only the domain name, i.e. www.sephyroth.net), and then in the Path box, put the directory that you have WP installed on, followed by xmlrpc.php (so, if your blog is in the /blog/ subfolder, then you’d put /blog/xmlrpc.php; if it’s in the root, then /xmlrpc.php). You can also adjust the port you use, turn on encryption, and choose if you want to use UTF-8 encoding.

The next screen is quite simple - just put in your username and password for your blog - if you want to save it, go ahead, otherwise you can leave the box unchecked.

And, that’s it - you’ll now be in the editor window, ready to make a post to your blog! (well, of course, now I have this post in there as a draft, but you know what I mean. ;)

Touring the editor window

Now, let’s take a quick tour of the editing window. The first few buttons on the first toolbar are fairly obvious, through to the spellcheck.

After that is one of the features that I didn’t even know about until starting to write this (in fact, there’s a lot of hidden stuff in here - so if you decide to get it, do some exploring!); as a matter of fact, it’s quite a handy feature - custom tags. This button allows you to put in your own HTML tags that you use frequently (i.e. for me, one making a centre-aligned paragraph would be useful because of all the pictures I post).

Then you have a control area - Options, a pseudo-logout button, which brings you back to the w.bloggar start window. Next is your blog list - if you use Blogger, this is a very handy tool - it will retrieve your full list of blogs, and you’ll be able to select the blog you want to work on. The next button (the one with the red checkmark on it) is the Blog Properties button, if you click it, you will be brought to this window, where you can make custom settings for previewing, how you upload your images (yes, you can upload images properly to WP - with thumbnails!), and media information -

The other buttons of importance on the first row are the next one - go to blog site, which loads the blog in either IE or your default browser (a simple option you can switch in the options), and the Posts button - if you click on the down arrow next to Posts, you’ll be able to edit the last number of posts, or choose a post number to edit (if you know the number of the exact post you want to edit, that is ;) ). The Template button that you see at the end, before the Help button is grayed out because you can’t edit the template for WP blogs, only for Blogger blogs that use classic templates.

If you select a number of posts to edit, you’ll see this dialog, from which you can select a post to edit (by the way, it doesn’t have to have been made in w.bloggar to edit) -

The second row of buttons is a standard formatting bar, with a couple of buttons that are important at the end - first is the upload button, which allows you to upload a file to your blog. There’s also the Post and Post & Publish buttons - Post is used to save a post as a draft on your blog’s site, and Post & Publish is used to publish the post to your blog.

This is what the Upload dialog looks like -

Now, in the main body of the screen, you have your basics, like post title, and categories (which are culled from your category list; if you want to use more than one category, click the ellipsis to bring up your tag list and tick as many boxes necessary. The tabbar that is there is used to create options - More is for if you want to have a jump in your post, and preview allows you to look at your post in what should be your blog, but so far I’ve had issues with getting it to work properly with WordPress.

One of the features accessible from the More panel is the Advanced options. This is where you can set your trackback and comment settings, along with text filters (if enabled), and edit the date and time.

Using these advanced options has created an interesting problem - if you choose to edit the time of your post, WordPress will read that as having been posted at the time you set, GMT. For example, if I set a post in w.bloggar to have a timestamp of 4 PM, my blog would think that it was published at 10 AM, or 6 hours behind server time. However, if you use the current date & time option, it will publish the post at the time it currently is on your blog.

The status bar has the usual stuff - date, lock info, insert/overwrite status, and a couple of other things - first, the WordPress logo is clickable - that will bring you to the account properties, where you can adjust the settings from the original setup, and the notes brings you to the Media page from the Blog options dialog

Using the Editor

It’s simple to use the editor in w.bloggar - it’s just like using any other plain-text editor (EditPad, or the WordPress “code” view), where you need to insert the HTML code manually, but the program does give you a generous helping hand, by way of the Format and HTML menus, along with the HTML toolbar.

You’ll notice that the HTML toolbar and the HTML menu have the exact same layout, save for the Custom Tags item appearing in the menu and not the toolbar as it is already in the main Toolbar. If you want to try a preview of how it would look on your site, you can try the Preview tab, but it has some pitfalls, as this is what a preview of this post looks like in there -

As always, your mileage may vary with your platform, but so far I’ve had issues with WordPress, and when I used this for Blogger, they didn’t have the customised CSS functionality that I remember.

Give it a go!

If you’re interested in giving w.bloggar a go, check out the download page - there you’ll find links to download all the versions of the program. It is Windows-only, with a selection of languages available. If you’re adventurous, you could always use the first stable version, but then you’d lose a lot of the additional functionality of the newest versions, including uploading files. ;)

I have to say, by the way, that I’m actually pretty sold on this program again - it’s simple to use, there isn’t that much of a learning curve, and the best feature of all - I’ve had it running for quite a while, and done a lot with the program today, and it’s only using 17 megs of virtual memory, and 25 megs of RAM; I bet Windows Live Writer can’t live up to that. ;)

Comments (2)

Securing Firefox, Part 1: NoScript

This is the start of a short series on making your browsing on Firefox, which is already a more secure browser than Internet Explorer, but there are some improvements that you can make on your own to increase the security you have when browsing.

The first of those is to download an easy-to-use extension called NoScript. The purpose of it is to take all of those various scripts and objects that you find on a webpage and block them from getting to your browser. Needless to say, it is one of the most popular extensions for Firefox out there, consistently in the top ten in terms of downloads. However, there are some detractors who may ask why you’d want to use this, and also those who wonder how it works.

Why NoScript?

Have you ever wondered why it takes a site seemingly forever to load? Does your browser freeze on you when you’re viewing a page? Are you concerned about picking up a virus from an unfamiliar page on the internet?

A lot of the time, these issues all come back to the same sources - a script; either JavaScript, or possibly an object on the page (Flash, Windows Media Player, and Quicktime for example). Depending on the site you go to, there could be a lot of scripts and objects that get loaded as you visit the page. These could be loading just about anything - from those “most recent visitors” widgets, to Entrecard, ads, site counters, and even click-tracking scripts which are used to find out where people are clicking on a site.

Of course, most of these are scripts of the “friendly” variety, but there are some scripts that can be used to your detriment, by trying to exploit a security flaw, or in some rare instances, try to put a virus on your system.

Why not NoScript?

In the interest of fairness, there are several detractors to this particular extension - they point out that Firefox is already a very safe browser, which is true, but the point of NoScript is to allow you to choose which scripts run on a page. My personal favorite is this plea posted in the reviews section for the addon -

Please, for all that is sacred in the world of Web 2.0, do not use NoScript. Firefox is a secure browser, JavaScript can do no damage to your computer, the browser, your privacy or any personal data.

Of course, he goes on to explain how Cross-site scripting can be used to damage your personal data (by the way, NoScript blocks Cross-site scripting attempts).

Another common complaint about NoScript is that it is somewhat confusing for novice users to use, especially when the visit a site that says that they cannot view the contents because of JavaScript being blocked or disabled on a site. The truth is that NoScript can be a bit cumbersome to use to start out with, but the learning curve is not too steep if you have a basic understanding of menus on a program.

Installation & Getting started

To install NoScript, it is no different to installing any other Addon - simply visit the Mozilla Addons site and install the extension. After restarting Firefox, you’ll likely be directed to the NoScript website to see the change log (you’ll be directed to that site every time that it updates as well - you can turn that particular feature off; instructions are available in the FAQ).

When you visit the next site (except for sites that are already preloaded in the whitelist - Google, Yahoo, Microsoft, Mozilla Addons, and the author’s sites), you will receive a notification that looks like this -

Scripts blocked message

You may also hear a sound from NoScript telling you that scripts have been blocked on the page. If you want to allow the scripts on a page, simply click the Options menu and choose to either Permanently or Temporarily allow the site’s scripts.

Options menu

After allowing the scripts, you will need to reload the page to activate them - this is something you will always have to do whenever you select to allow or disallow scripts on a page. Also, when you allow a site, you can revoke the permission by clicking on the NoScript icon in the status bar - which is the blue S in a circle, possibly with a crossed circle on it if there are other scripts on a site which are still blocked.

Also, if you have turned off the notification bar, you can use the S in the status bar to adjust permissions on a site by site basis. This is what the menu looks like after allowing mozilla temporarily (a temporary permission is in italics and a permanent permission is in bold) -

Status bar menu

So far, I’ve only shown mozilla.com which does not have any external scripts running on the site.

More advanced usage - sites with external scripts

However, where NoScript comes into its own is when you’re browsing a site that has a lot of external scripts. For this example, I’ll show you my site. First off, this is what a page on my site looks like with NoScript turned off (i.e. allowing all scripts to run globally) -

My site with scripts turned on

And then, this is what the site looks like with scripts turned off; you’ll notice the missing elements all in the right hand column - Entrecard, MyBlogLog, Blog Catalog and Alexa.

My site with scripts turned off

And, just to show you all the sites that have scripts on here, this is what the menu looks like when I’ve got all scripts blocked (note that this is the status bar menu, and not the information bar menu) -

Script list for my site

This is where, for some users, NoScript can become quite tedious. If you want to allow a script to run on a site, you need to both the site that hosts the script (for example, with Entrecard, you need to allow both amazonaws.com (to show the card), and when you refresh the page to show the card, entrecard.com - so that you can drop your card). This is what the widget looks like if you only have amazonaws.com allowed -

Entrecard with entrecard.com blocked

As you can see, you can see the card, but the Drop yours link is not there. When you allow entrecard.com and reload the page, you will then see the link to drop your card -

Entrecard with entrecard.com allowed

Now, an important thing to know is that even if you have allowed a site to display its scripts, you need to allow the host site to show scripts before you can see things like Entrecard, MyBlogLog and Blog Catalog.

To use a practical example of how this works, this is what SCHWOIT looks like with schwoit.com blocked (note that the Entrecard widget should appear right in the upper-right corner of the site) -

Schwoit without schwoit.com allowed

If you view the full size image, you’ll notice that the information on the info bar has changed. Since there are scripts on this site from other sites that I’ve permitted to show scripts, it now says that scripts are partially allowed, and tells you how many sites are allowed out of the number of sites that have scripts on that page. Now, if I go to allow schwoit.com, this is how the window looks -

schwoit with schwoit.com allowed

More advanced features

There are a few more advanced features that are included in NoScript, such as a pseudo blacklist - that is available in the menu under Untrusted. However, since NoScript is a whitelist-based add-on, the only thing that this untrusted list does is prevent a site from appearing in the list you see of sites to allow when you open the Options menu, status bar menu, or right-click menu.

For a full list of features, along with the full range of settings that are available to you in NoScript, you can check out the features page at the author’s site.

Any questions?

If you have any questions about how this all works, or if you have more advice on making the NoScript experience better, feel free to leave a comment.

As always, if you’d like a how-to written up about something, all you need to do is drop me a line via the contact form. If I know how to do it, I’ll write it up, but even if I don’t know how to do it, I will go and figure it out and then write up the how-to on getting it sorted out. :)

Coming soon

Sometime in the next week or so, I’ll have the other half of the combination that makes (at least) my browsing experience so much more improved - Adblock.

Comments (10)

How-to: Password-protect a post

 This is one of those simple how-tos for WordPress, but I was asked on how it worked, so here ya go. :)

Why would you want to do this?

Sometimes you have that post you want to publish, say on a testing blog, that you don’t want all and sundry to read. Of course, you might also have a post on your blog that you only want your close friends to see, and not the whole world. Either way, it is useful to know how it works so that if you need to use it, you have an understanding.

Setting a password

As usual, for the purposes of this demo, I’ll be using my test blog which has the slow TinyMCE editor which lags behind my typing. It’s fun to type the letters then see them about 20 seconds later, but I digress. When you’re writing a post and want to put in a password, all you have to do is look to the right of the editor for the Post Password box in the right-hand column of options.

Setting a password 1

To set the password, all you need to do is type it in.

Setting a password2

From there, just publish the post like normal. When you and your visitors go to your blog, they will see this -

What you will see on your blog

How this works for the user

In the last shot, you’ll see that I have included the next post, which is also password-protected. I did this for a reason - it has a different password to the first post. I’ll explain that a little bit later. However, to get the post to show, all you and those you’ve given the password to will need to do is just put in the password and click submit. If you use Firefox, you may be asked to save the password; I’d just go with Not Now. And now, you can see the protected post -

What happened to the second post?

Now, we reach the sticky wicket and the time when I should advise anyone who is averse to technical explanations to tune out for a moment. :)

You’ll notice that the second post has gone back to protected status. There is a simple reason for this - cookies. When you have a protected post and a user enters the password for that post, that password gets stored as a cookie for ten days. This means that any protected post with that password will be visible by anyone who knows the password for one of the posts.

If you use multiple passwords, however, you can only see the posts protected by one password because the cookie that is set has the same name, but the value changes to match the last password you put into the form. If you’re making a lot of protected posts, I personally think that it’s unlikely that you’ll be making separate posts for separate groups of people thus requiring separate passwords, so you’re probably fine using one password for all protected posts.

This ends the technical explanation for those who had tuned out. :)

The simple explanation is that if you have two posts with two separate passwords, visitors will only be able to see one post at a time, even if they know the passwords to both. If they have the same password, visitors will be able to see both posts if the know the password.

I should also mention that if you have a password-protected post, this is what readers will see in the RSS feed -

There is no excerpt because this is a protected post.

Other things to note

I did a little bit of testing to see what did and what didn’t work with regards to the password protection. Simply put, if you protect a post, all that will be seen is the prompt. After entering the password, the post acts like normal. If there’s a more tag in there, you will have to click to read more of the post. Also, if you read the site’s feed using something like IE7’s built-in feed reader, you will be able to see unlocked posts in the RSS feed. Other online or offline readers will require you to visit the site to see the post.  Also, if the reader accepts it (like Firefox livemarks), the excerpt will show if you have unlocked the post.

All in all, password protecting a post in WordPress isn’t that hard, but if you choose to do it, you should be sure that you trust those you give the password out to, depending on the content you put in the locked posts. As always, if you have something you’d like explained, feel free to drop me a line, and I’ll go through it and learn how to do it, then write a post about it. ;)

Comments (2)

How-to: Inserting a poll into a post

This is something that was asked on the Aussie Bloggers forums, and has been sitting on my to-do list for a couple of days now. It’s a short post, geared to users of the WP-Polls plugin for WordPress.

Basically, there are two ways you can show your polls - in your sidebar via the widget (or by manually editing the sidebar to add some PHP code), or within a post. Depending on the context in which you want your poll, you might want to have it within a post. Here’s how you do it.

First off, if you are wanting it to be a new poll, then you’ll need to make a new poll in the Polls section of your admin panel. For the purposes of this post, I’ve made a timely cricket-related question -

Who will win the CB Series?

  • Australia (86%, 6 Votes)
  • India (14%, 1 Votes)
  • Sri Lanka (0%, 0 Votes)

Total Voters: 7

Loading ... Loading …

So, now you can see the poll within the post (RSS readers, you may have to visit the site to see the poll). But how did it get there?

A simple bit of coding, but you don’t need to know anything other than the poll number, as there is a button on your toolbar to insert a poll. Depending on the editor you use, the button itself will vary.

For Advanced TinyMCE users, the button looks like this, on the top row of buttons -

Poll button in Advanced TinyMCE

And, if you have opted to stick with the original TinyMCE editor, this is what the button will look like (yeah, it’s a bit spiffier ;) ) -

Poll button in Regular TinyMCE

All you have to do is click on that button, and a dialog will come up, which looks like this (obviously, the address of the site will be your address) -

Enter Poll ID here

Now, you just have to put in the number of the poll you want to insert. In this case, it was number 2, but if you check out the list of polls on the main Polls page in your administration panel, you will see the Poll ID in the left column -

List of Poll IDs

Simply put that number into the dialog box, and it will insert the code to show that poll. If you’re curious, the code that it will insert is this (broken apart so that it doesn’t show the poll again ;) )

[ poll = {PollID} ]

I made a mention about RSS readers needing to come to the site to view the poll because how WP-Polls works is that it’s actually all run from within the page, with the votes all being logged by the plugin. These are functions that just can’t be replicated in an RSS feed (for the most part). In fact, I did some checking now, and this is the message you will see in place of the poll -

Note: There is a poll embedded within this post, please visit the site to participate in this post’s poll.

There are plugins which will allow you to put a poll in an RSS Feed - Democracy should be able to, according to a reply by Sueblimely in the thread, but I have not personally tested it to verify it. If anyone wants to test it and see if it works on their own blog, or if you use a different plugin for your polls which allows this, feel free to drop a comment. :)

Comments (4)

How-to: Put Gravatar on a WordPress site

Last week, I had a post published on the Aussie Bloggers blog about how to get your own Gravatar set up. This is the natural extension of that - making your blog Gravatar-friendly. This guide is for WordPress blogs, but there will be some information available at the end of the post about other platforms. First off, an important question is if you’re already using gravatar and might not know it, because you’re using a Gravatar-ready theme.

Gravatar-ready themes

There are a few themes out there which are already set up for Gravatar - including one of the more common themes that I see on a daily basis - Freedom Green & Widgetized. It’s the theme in use on the Aussie Bloggers blog, on Snoskred’s, Lightening’s, and quite a few other blogs. Any site that is running this theme really doesn’t need to read further. Of course, I’d like it if you did anyway. ;)

Gravatar plugin

If you’re not running one of those themes, you’ll need to do one of two things - hack your own theme’s code to match the code that you can find in the Gravatar-ready themes, or you can make it easy for yourself and download the Gravatar plugin. You will still have to fiddle with your site’s code, but going this way, it’s only a matter of adding a simple bit of code into your comments file.

Gravatar says on its site that the plugin is only for WordPress 1.2, however, I have tried this on a blog that is on version 2.3.2, and I know that it works up to and including the latest editions of WordPress with no problems.

Installing the plugin is no different to installing any other plugin. Simply download the zip file, expand it to your system, and then upload it to your blog. Then, in the Plugins page, activate it. Now, what you need to do is find the file that controls your comments.

Generally, that will be found in your Theme’s directory - and is normally called comments.php. If you have the permissions set where you can edit files while they’re on the server, then you can edit it using the Theme editor, which can be found in Presentation -> Theme Editor. When there, click on Comments, and you can edit the file.

A word of advice

Before getting into showing you how to put the Gravatar into your comments, I want to give you some important advice about styling. As you will see in my example here, I haven’t done any styling to the image. I’m just putting it in there as a proof-of-concept that it works. You will have to take some time to play around with the CSS to get it where you want it. If you would like some assistance with that, feel free to contact me, and we can work something out.

Also, I am doing this on my personal testing bed (which has a very stylish black theme which I modified; I gotta say that I’m a bit chuffed about it, but I digress), and you should do the same thing; with the same theme that you are using on your blog, so that it is simply a matter of copy the code that you’ve come up with and paste it into the same files on your current theme. I’m a firm believer that end users probably shouldn’t be the ones checking out live testing of something. ;)

With that out of the way, let’s go back to the show. :)

So, in the comments.php file - either in your offline editor, or in the built-in editor in WordPress, you will want to look for a section that looks like this in the file -

Code in comments.php to look for

If you don’t find something exactly like that, searching for “comment_text()” should come back with what you are looking for in the file.

Now, again, this is why it’s just a proof-of-concept showing you how to put it in there, I’m going to put the Gravatar code into the comments.php file just before the comment text. An important thing is that you need to put in image tags around the Gravatar code. Otherwise, you’ll see the address that your blog is looking for to load the image.

The code that you will need to put in is this - <img src="<?php gravatar(); ?>" alt="Gravatar" />

There are variations to the code that you can make to restrict the types of Gravatars that appear - you might want to restrict by Rating (G, PG, R, X). You might also want to set the size of the Gravatar that shows by putting in a number. It will then show the images in that size, up to 80×80 which is the maximum for a Gravatar. A special function that you can control is what shows when the user doesn’t have a Gravatar by telling it what address to cull the image from to put in its place. Lastly, you can put in a border if you want by declaring the Hex code for the border you want.

In my example, I’m going to use just change the image size to half-width, so the code will look like this -<img src="<?php gravatar("" ,40) ?>" alt="Gravatar" />

This is what the code looks like in situ in the rest of the file -

Code after inserting Gravatar

And, then, this is the output of the code as I have it:

Gravatar in use on site.

Other blog platforms

If you aren’t using self-hosted WordPress, then your success at using Gravatar will vary. On the Implement page, they are open about what blogging platforms it will work with - TextPattern (using a hack), MovableType, WordPress, Expression Engine, PMachine, Nucleus, YACS, Blojsom, and instructions for PHP, PERL, ColdFusion and Java. However, two services that it doesn’t work with are Blogger and LiveJournal.

If you use Blogger, there are third-party services that you can use, but those services only mean that you and your readers are dependent upon another party getting everything together every day to serve up your comments. While Blogger’s commenting system is quite flawed, it is my personal opinion that you are better off just going with Blogger’s default and waiting for them to hopefully get something going where you can have the option of using Gravatar.

If you have questions

If you have any questions about implementing Gravatar on your WordPress blog, feel free to leave a comment here or drop me a line via the Contact page. I’m almost always willing to help out to get something sorted out, and if you’re looking for some design consultation, I’m willing to help out in that field as well. :)

Also, if there is a topic that you’re wanting me to cover in a future how-to, again, just drop me a line via the contact page. :)

Comments (2)

« Previous entries