Dropbox: the ideal web image management tool

Dropbox logoIf you’re a web designer or a blogger you probably have a lot of hassles with uploading, locating and managing your online images. Worry no more.

Dropbox to the rescue

Dropbox and Evernote have changed my digital life. If you use more than one computer, if you need to access files from any web-connected computer in the known universe, or if you just need no-brainer burglar-proof, tsunami-and-fire-proof file backup they’re invaluable and they’re free for commendable amounts of data. If you don’t have it just click on the Dropbox logo above and you’ll get 2.5GB of free storage (you get an extra 500MB from my referral). I’ve written more about Dropbox here.

Your Dropbox contains a Public folder. All you need do is save images destined for your website into that folder or a subfolder within it. When you wish to insert the image into your website here’s what to do (it’s far easier to do than to explain): Continue reading “Dropbox: the ideal web image management tool”

CSS callouts for your blog

This is a level 2 callout heading

In case you were wondering, this block of text is a callout based on a class in a cascading style sheet.

  • This is an unordered (ul) callout list formatted by the CSS style sheet:
  • To use a numbered list instead, use ol in place of ul list tags.

The callout on the right is produced by the CSS shown below. The textbook definition of a callout is a quotation from the text body displayed in an extracted box, but I’m defying semantics and using it to highlight information peripheral to the main post.

If you’d like to use callouts in your blog (or any web page for that matter) here’s what you need to do.

Track down the location of the style.css or custom.css file in your WordPress theme. Edit the CSS script to change the fonts, colours, text sizes, padding and so on to whatever your heart desires.

The CSS script uses the “width” property to allow the callout to expand and contract proportionally with flexible width themes. It will occupy 33% of the width of the post or page regardless of the size of the browser window. Of course you can change that to 50% or whatever suits your requirement. Mistywindow’s modified Thesis theme has a flexible design with maximum and minimum limits, so if you change the size of your browser window you’ll see how the callout responds.

For the life of me I can’t remember why I found it necessary to put the transparent background tag in the list CSS. Probably an inheritance problem. I’ll have to experiment.

🙂

Place the callout text between tags like these:

heading here if you wish

Some text here.

Put the following CSS script, edited to suit your impeccable taste,  into your custom.css file: Continue reading “CSS callouts for your blog”

WordPress line breaks still broken

WordPress has an infuriating habit of removing line breaks from your HTML script.
It doesn’t matter whether you use <br /> or &nbsp: they get the chop. You can work around it by inserting this code into your editor while in HTML mode:

whatever text scratches your itch

I expected this to be fixed in WordPress 3 but they blew it. They’re forgiven. WordPress 3 is otherwise fantastic.

For a lot more about line breaks and padding go to this excellent WordPress Tips page.

🙂

If typing all that stuff is a trial, get yourself a text expander. My choices:

  • Free Autohotkey for Windows – reviewed here on Just Wondering.
  • Free Autokey for Linux.
  • Reasonably priced TextExpander for Mac.

Add Google Adsense to your WordPress blog

With luck it'll pay for your hosting costs. If you don't have an Adsense account you'll need to set one up here. Go to your Google account page, select an ad configuration and copy the code Google creates for the ad display you want. You need 120 or 160 pixels wide if you put it in the sidebar. The one here @ my wits' end is 160 px wide.

  1. Go to Admin » Appearance » Widgets.
  2. Drag a Text widget into the position on your Primary Widget Area that suits you.
  3. Paste the code into the Text box.
  4. Wrap <center> </center> tags around the Google code as shown below to centre the ad in your sidebar. Otherwise it lines up on the left and will probably look off-balance.
  5. Click Save.
<center>


http://pagead2.googlesyndication.com/pagead/show_ads.js
</center>

It may take a few minutes, or even hours, for Google's spiders to cotton onto your pages. So don't assume that a blank box is a sign that you've blown it. 🙂

Upgrade WordPress painlessly

The quick and dirty painless WordPress upgrade

But first a bonus:

WordPress says “howdy folks“

Aaaarghh…. I hate that.

For those who, like me, are not PHP wizards, aren’t related to John Wayne and don’t live just south of the Mason-Dixon line.

When logging in to a WordPress site’s admin area, the greeting at the top of the header is:

“Howdy <username>”

As any English speaker outside the US will be aware that is more American than Mom and apple pie.

To change it to something like hello, take me to your leader, gidday, bon jour, konban wa, or kia ora – anything but “howdy y’all” is easy.

  1. Open the file “wp-admin/admin-header.php”
  2. On about line 46 you will see:
    <?php printf(__(’Howdy, <strong>%s</strong>.’), $user_identity) ?>
  3. Just change “Howdy” to whatever you like.

That was painless right? Trouble is, when you update WordPress to a new version, which seems to happen every few weeks thanks to the tireless volunteers who power the world’s blogs, you’ll more than likely have to repeat the change. You have to live with that, but to make your life really easy in lieu here’s a monumental time saver:

WordPress Automatic Upgrade

Get it right here.
I installed the WordPress Automatic Upgrade and put it to work. As my Tech Hideaway friend Martha from Texas who put me onto it said, “Does it rock!”

Does it what!

Thanks Martha and howdy. :o)

This gem disables your plug-ins, backs up your database installs the upgrade and re-enables everything. 2 minutes to upgrade. Being paranoid, I backup my blog first anyway.

Here’s what it does in more detail straight from the horse’s mouth:

  1. Backs up the files and makes available a link to download it.
  2. Backs up the database and makes available a link to download it.
  3. Downloads the latest files from http://wordpress.org/latest.zip and unzips it.
  4. Puts the site in maintenance mode.
  5. De-activates all active plugins and remembers it.
  6. Upgrades WordPress files.
  7. Gives you a link that will open in a new window to upgrade installation.
  8. Re-activates the plugins.

In case you missed it – get it here.

:o)