Posts tagged ‘google’

January 25, 2012, 3:26 pm

Google came out with an experimental specification for websites to provide “hints” on forms, to allow things like autocomplete to work better and be more standardized. Seems useful.

Here’s a quick plugin snippet you can use to make your comments form use this specification. Only Chrome 15 and up is using this at the moment, but in the long run I think most browsers will be implementing something similar to this, since filling out forms is just one of those endless pieces of drudgery that we could all stand to do away with.

Note that your theme will need to be using the comment_form() function call for this to work, otherwise you’ll just have to edit your comment form in the theme manually.

<?php
/*
Plugin Name: Add X-Autocomplete Fields to Comment Form
*/
add_filter('comment_form_default_fields','add_x_autocompletetype');
function add_x_autocompletetype($fields) {
	$fields['author'] = str_replace('<input', '<input x-autocompletetype="name-full"', $fields['author']);
	$fields['email'] = str_replace('<input', '<input x-autocompletetype="email"', $fields['email']);
	return $fields;
}

Simple little bit of code, really. Should work with any theme using the normal comment_form() function call.

Shortlink:
Tags: , , , , , ,
Category: Code, WordPress  |  2 Comments

June 1, 2011, 11:34 pm

While looking at my backlinks today, I noticed a site in French had linked to my post about making photo galleries. He mentioned that the Google Translate wasn’t great. I took a look, and while I don’t know how good the text translation was, I did notice that Google strangely tried to translate the code as well, thus screwing it all up.

A quick search revealed that all one had to do was to add the “notranslate” class to any wrapping object to prevent its contents from being translated.

Now, I use the Syntax Highligher Evolved plugin to display code on my site (although I use an older version because I like the look and functionality of it better than the latest version). So I edited the plugin and found where it inserts the PRE tag, and added the notranslate class to it. And voila, now my code doesn’t get translated anymore.

Just a helpful tip for anybody who posts code on their sites.

Shortlink:
Tags: , , , , ,
Category: Code, Other  |  9 Comments

June 1, 2011, 2:23 pm

Google rolled out their +1 button today. So I added it here. You’ll find it below all the posts. Try it out.

Here’s the simple-stupid plugin I wrote to do it. While you can just edit your theme, I like making these sort of things into plugins. That way, I can turn them off at will, and I know exactly where to go to change them without having to dive into my theme code. Also, if I change themes, the code still works on the new theme.

<?php 
/* 
Plugin Name: Otto's Google +1 Button
Description: Add a +1 button after the content.
Author: Otto
Version: 999
*/

add_filter('the_content', 'google_plusone');

function google_plusone($content) {
	$content = $content.'<div class="plusone"><g:plusone size="tall" href="'.get_permalink().'"></g:plusone></div>';
	return $content;
}

add_action ('wp_enqueue_scripts','google_plusone_script');

function google_plusone_script() {
	wp_enqueue_script('google-plusone', 'https://apis.google.com/js/plusone.js', array(), null);
}

I wrapped the button in a div so that I could style it. In my particular case, I’m floating it right and giving it a margin, same as the Twitter and Facebook plugins. One day, I’ll make all these little Google plugins more generic and configurable, and roll them into a Simple Google Connect plugin. 🙂

One thing I don’t like is that the +1 button only works for people who are logged into a GMail account. Sorry Google Apps users, you’re out of luck. Complain to Google until they fix it.

If you want to add more parameters to the plugin and reconfigure it, you can find out about the available parameters here: http://code.google.com/apis/+1button/#configuration

Shortlink:
Tags: , , ,
Category: Code, WordPress  |  44 Comments

November 18, 2010, 11:58 am

Saw a few tweets by @lastraw today, asking Matt and others if they could make the Add Audio function in the WordPress editor work.

Well, @lastraw, the audio function does actually work, it just doesn’t do what you expect it to do.

Basically, the WordPress uploader does provide a few different kinds of uploader buttons: image, video, audio, and media. All of these buttons behave in different ways. The Audio button in particular lets you upload an audio file, and then insert a link to that file in your post.

WordPress upload buttons in the post editor

However, the link it inserts is just a bare link. This is because WordPress doesn’t come with a flash audio player, and HTML 5 hasn’t gotten standard enough to allow sane use of the <audio> tags.

Still, plugins can modify things to make audio files embed. I just wrote a quick plugin to take those bare audio links and turn them into embedded audio players using Google’s flash audio player. This is the same player they use on Google Voice and in several other locations in the Google-o-sphere.

Example:

Example Audio File

How did I do that? Easy, I activated my plugin, then used the Add Audio button to just insert the plain link to my audio file (which I uploaded). Naturally, this audio player will only show up on your site. People reading through an RSS reader or some other method won’t see it, they’ll just see the plain audio link and can download the file.

Couple limitations on this: It only handles MP3 formats. You could conceivably use a player that could handle more formats, I only made this as an example. MP3 is the most common format in use anyway, and I didn’t want to go searching for a more complicated player to use. Also, I made it only handle links on lines by themselves. If you put an audio link inline into a paragraph or something, it won’t convert it.

Here’s the plugin code if you want to use it or modify it or whatever. It’s not the best code in the world, but then it only took 5 minutes to create, so what do you expect? 😉

<?php
/*
Plugin Name: Google MP3 Player
Plugin URI: http://ottodestruct.com/
Description: Turn MP3 links into an embedded audio player
Author: Otto
Version: 1.0
Author URI: http://ottodestruct.com
*/

add_filter ( 'the_content', 'googlemp3_embed' );
function googlemp3_embed($text) {
	// change links created by the add audio link system
	$text = preg_replace_callback ('#^(<p>)?<a.*href=[\'"](http://.*/.*\.mp3)[\'"].*>.*</a>(</p>|<br />)?#im', 'googlemp3_callback', $text);

	return $text;
}

function googlemp3_callback($match) {
	// edit width and height here
	$width = 400;
	$height = 27;
	return "{$match[1]}
<embed src='http://www.google.com/reader/ui/3523697345-audio-player.swf' flashvars='audioUrl={$match[2]}' width='{$width}' height='{$height}' pluginspage='http://www.macromedia.com/go/getflashplayer'></embed><br />
<a href='{$match[2]}'>Download MP3 file</a>
{$match[3]}";
}

This is mainly intended as a demo. There’s more full featured plugins for this sort of thing in the plugins directory. If you need to embed audio, using one of them might be a better way to go.

Shortlink:
Tags: , , , , ,
Category: Code, WordPress  |  20 Comments

August 26, 2010, 10:49 pm

Google Apps has always been a bit of a black sheep in the Google account system. If you had an email on a Google Apps system, then it was kinda like a Google account, except not really. Some of the features were the same, some were not. What made it more confusing is Google’s tendency to create a separate Google account using your email address, which meant data sharing across the two was broken and tricky to work with. So most users ended up maintaining two separate Google accounts, which annoyingly had the same email address/username (unless you added GMail to one, in order to get access to Buzz, which then made it forced to have a gmail account as the primary email).

But recently, Google has been making efforts to pull these systems together into a more unified whole. They started off with the multiple account sign in features, which works, but is pretty lame. Having to choose which account you’re on throws all the complication back on the user.

A better way is to simply make all Apps accounts into full-fledged Google accounts. They’ve taken this step and now (some) Google Apps administrators can choose to integrate their Apps account into the larger Google account-o-sphere. I did this the other day, and while it’s taken a bit of effort, I’m now starting to pull all my information over into this new, fully-capable, Google account.

So this post is just a few notes on the process of migrating from two accounts to one, as I do it. Note: This is disorganized and random. I’m just making notes here. Read them if you like.

– Have two browsers open when you’re migrating things. I’ve been using Chrome and Firefox. Sign each one into a different Google account here: https://www.google.com/accounts/ManageAccount

– Don’t use the multi-sign-in thing. It makes things really confusing.

– Change your passwords on one of the accounts. I noticed that when I had the same password on both of them, sometimes I’d log into a Google property and it would log me in using the wrong account. With different passwords, that stopped happening and I started getting in on the correct account, based on the email I gave, every time. Basically, it appears that the migration process changes your old GMail-account which was tied to your old non-gmail based address to use an account on gtempaccount.com. Using this, it can still recognize your old email address as being on that account, if the password fits. By having different passwords, it can’t do that and thus you get the correct account for the email you’re signing in as.

– YouTube accounts can be delinked from one Google account and relinked to the other Google account. Check the account settings page on YouTube. Yes, I know they say YouTube won’t work on the Apps accounts. It does. I did it.

– Google Voice accounts *CAN* be transferred to non-gmail based Google accounts. This link works: http://spreadsheets.google.com/viewform?formkey=cjlWRDFTWERkZEIxUzVjSmNsN0ExU1E6MA . Even though it says there that it will not work with a Google Apps account, it *will* work if you’ve migrated your Apps accounts into the general system. I did it, and if you do it, make a note saying that the account migration had been done. They transferred it over just fine. Took about an hour for me. Probably will take longer for them to get to you.

– Chrome Sync works on the new accounts, just go into Chrome, disconnect the sync, then reconnect it to the new account.

– If you use Reader, you can export your subscriptions from one as an OPML file, then reimport them to the new Reader account. Although your followers *seem* to transfer, there may be an issue there as I always get errors when commenting on shared posts.

– Google Talk works fine, but you need to sign it out then back in to the new account.

– AdSense can’t migrate. You’ll have to close your old AdSense account and create a new one on the new account.

– Strangely enough, somehow in this process, Wave got added to my Google Apps account. Which is weird, as I thought they killed that. Not that it matters or anything, just thought it was unusual.

– One HUGE benefit: The new Google Chat. A few days ago, they rolled out “call by phone” to Google Chat. You can call anywhere in North America for free through Google Chat on your GMail. While they didn’t roll this out to normal Google Apps accounts (yet), they did roll it out to migrated Google Apps accounts. I got it in my GMail today and used it to talk to my mom. She said the voice quality was fine. Afterwards, I signed into Google Voice and lo and behold, my GChat was available as a Google Voice forwarding account! So now if I’m on GMail (which I always am) and you call my Google Voice number, I can answer through the computer. How awesome is that?

This is not final. I will be updating this post as needed. I’m just posting it now so that people can benefit from it now.

Shortlink:
Tags: , , , , , , , ,
Category: Other  |  7 Comments

April 20, 2010, 11:41 am

What with Android making more headway in the world, I’ve been seeing more and more QR codes lately. If you don’t know what a QR code is, then here is an example:

QR code

Scan this to buy Otto a beer. Seriously.

Android phones have this sort of thing built in, as it’s used for their version of the “app store”. iPhones can download apps to read them and act on them (NeoReader is a free and easy one to use).

Basically, QR Codes are like visual links. You take a picture of them using the application in question, and it either gives you some text or sends you to a website.

Anyway, while reading Google Reader today, I saw somebody mentioning “Portapayments”. A quick search and test showed me how it worked, but I don’t really care for their implementation. I prefer to roll my own, sort of thing. So here’s how you do it.

Make the Donation Link

Let’s assume you’re using PayPal. It’s quite possible to do this with any payment service that can provide you with a payment link, but PayPal is relatively easy.

First, log into Paypal, and go to their “Merchant Center”. There, you’ll click on “Website Payments Standard”. Finally, you’ll make a “Donate button”.

Fill in the bits, and you can ignore most of them. In this case, we’re making a link, not a button, so we don’t care how it really looks. Put in the fixed amount you want the link to be for, then make the button.

On the final screen, there’s a tab that says “Email”. The purpose of this is to give you a link you can email to other people. When clicked, it goes to PayPal with the info already filled in. All the user has to do is confirm the donation. That’s the link we need. Copy it somewhere for now. You can test it out too, if you like, to make sure it works.

Shortlink it

Now we’ll need to turn that into a shortlink. Why? Well, QR codes work better with shorter links. As the amount of information the code holds gets longer, it gets more pixels in it, and thus it gets harder for the readers to read. Thus we want to keep the amount of data in it as short as possible.

You can use any shortlink service you like for this purpose. bit.ly is the most common. I have my domain on Google Apps and I used their shortlink system to allow me to keep it under my own domain’s control that way. So my shortlink ended up being http://sl.ottodestruct.com/beer . 🙂

Note: There is an advantage to using a shortlink system you control entirely here. If you want to change the payment link, then you can do it without changing the shortlink. This is useful because changing the shortlink after you generate the QR code may not be an option. What if you make t-shirts with the QR code on it? That link that you put into the code needs to be pretty darned permanent and not subject to change. If you control where the link goes, then you can change the content at that link easily anytime.

Whatever you prefer, just make that shortlink.

Make the QR Code

Finally, the easy part. Take your final shortlink and put it at the end of this URL:

http://chart.apis.google.com/chart?cht=qr&chs=192×192&choe=UTF-8&chl=

That’s using the Google Chart API to generate the QR code for you. The result is an image. You can put it on your pages however you like.

Example of my final image link:

http://chart.apis.google.com/chart?cht=qr&chs=192×192&choe=UTF-8&chl=http://sl.ottodestruct.com/beer

So it’s pretty straightforward, really. When somebody scans that with any code reading app, then it’ll send them to Paypal to complete the donation for the amount you set in the first place.

Neat.

Shortlink:
Tags: , , , , , , ,
Category: Other  |  12 Comments

April 13, 2010, 1:18 pm


I’m working on a Simple Google Connect for the future. But for now, here’s a simple Buzz Button using the functionality they announced today.

sgc-buzz.php

<?php
/*
Plugin Name: SGC - Buzz Button  
Plugin URI: http://ottopress.com/wordpress-plugins/simple-google-connect
Description: Adds a Google Buzz button to your content.
Author: Otto
Version: 0.1
Author URI: http://ottodestruct.com
License: GPL2

    Copyright 2010  Samuel Wood  (email : otto@ottodestruct.com)

    This program is free software; you can redistribute it and/or modify
    it under the terms of the GNU General Public License version 2, 
    as published by the Free Software Foundation. 
    
    You may NOT assume that you can use any other version of the GPL.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.
    
    The license for this software can likely be found here: 
    http://www.gnu.org/licenses/gpl-2.0.html
    
*/

wp_enqueue_script( 'google-buzz-button', 'http://www.google.com/buzz/api/button.js', array(), '1', true );

/**
 * Simple GB button
 *
 * @param int $post_id An optional post ID.
 */
function get_buzz_button($id = 0) {
	$url = get_permalink($id);
	$out = '<a title="Post on Google Buzz" class="google-buzz-button" href="http://www.google.com/buzz/post" data-button-style="normal-count" data-url="';
	$out .= $url;
	$out .= '"></a>';
	return $out;
}

function buzz_button($source = '', $id = 0) {
	echo get_buzz_button($id);
}

/**
 * Simple buzz button as a shortcode
 *
 * Example use: buzz id="123"
 */
function buzz_button_shortcode($atts) {
	extract(shortcode_atts(array(
		'id' => 0,
	), $atts));
	return get_buzz_button($id);
}

add_shortcode('buzz', 'buzz_button_shortcode');

function buzz_button_automatic($content) {
	$button = get_buzz_button();
	$content = $content . $button;
	return $content;
}
add_filter('the_content', 'buzz_button_automatic', 30);
Shortlink:
Tags: , , , , ,
Category: Code, WordPress  |  3 Comments