Video Tutorials For WordPress Users

March 7th, 2008 Blog

Quick List:

Installation
» How To Install WordPress Blog From Cpanel
» Installing WordPress To Your Free Hosting Server Part 1/3
» Installing WordPress To Your Free Hosting Server Part 2/3
» Installing WordPress To Your Free Hosting Server Part 3/3
» Installing on a Local Server
» How To Edit the wp-config File For WordPress
» How to Upgrade WordPress

Posting
» How to Post to a WordPress Blog
» How to Make a New WordPress Post
» How to Insert an Image & Make It a Link
» Insert Text from Word or Other Doc
» How to Wrap Text Around an Image
» How to Make a New WordPress Page
» How to Edit a WordPress Page

Themes
» How to Activate a New WordPress Theme
» Install Theme In WordPress
» How To Tweak or Edit Your WordPress Theme
» How to Put Adsense on Your WordPress Blog
» How To Create A Custom WordPress Page Template
» Make a Static Page Your Home-Front Page
» Custom WordPress Homepage (Method1 Raw code)
» Custom WordPress Homepage (Method2 WP Admin Panel Homepage)
» Custom WordPress Homepage

Plugins
» Install Plugin in WordPress
» Install Plugin in WordPress
» WordPress Plugin Creation

Search Engine Optimization
» SEO Your WordPress Blog – Part I
» SEO Your WordPress Blog – Part II

Administration
» Recover WordPress Password When You Have Forgotten It

(more…)

Share This | Read on | 7 Comments


Firefox Addon: Show Missing Images

February 19th, 2008 Blog

By using the supercool userscript compiler, I compiled the Show Missing Images Greasemonkey Script to a standalone Firefox Addon. Now there’s no need to install the greasemonkey firefox addon. Here’s a little background on the need for this addon.

Help me if you have an account on Mozilla Add-ons: Currently this addon is in the sandbox, please give a short review for this addon so that it can make it to the public site. Thanks! Here’s the link to my Firefox extension.

Features

  • Display missing images regardless of ALT tags
  • Mouseover broken image to view the original image’s source url

Preview

Missing Images in Firefox with Show Missing Images Firefox Addon

Download

v0.3 for Firefox 3.5

Share This | Read on | 14 Comments


Greasemonkey Script: Show Missing Images

February 12th, 2008 Blog

Firefox handles missing images in different ways depending on the ALT attribute.

Case 1: Missing Image with No ALT attribute
- Display a broken image

Case 2: Missing Image with ALT=””
- No indication whatsoever, just a blank space

Case 3: Missing Image with ALT=”Something”
- Display only the text in ALT, no image placeholder to indicate presence of image

Picture: Missing Images in Firefox
Firefox Missing/Broken Images

I guess Firefox is conforming to the W3C standards of displaying the ALT text if the image is missing/broken or unavailable. However this can prove to be a hassle for web designers as they can’t easily tell whether there are any missing images on their webpage. Worse, they may not even be aware of any missing images. Until they view the webpage in IE (Microsoft deserve some love eh :) )

Picture: Missing Images in Internet Explorer
Missing Images in IE

So I came up with my first Greasemonkey script which does only one simple thing – display all missing images, just like in IE.

Features

  • Display missing images regardless of ALT tags
  • Mouseover broken image to view the original image’s source url

Installation

1) Install Greasemonkey Firefox Addon and restart Firefox (if not already installed)
2) Click on the “Download Now” link below
3) Click install

Preview

Picture: Missing Images in Firefox with Show Missing Images GM Script
Missing Images in Firefox with Show Missing Images GM Script

Download

Name: Show Missing Images GM Script
Type: .js File
Size: 1.7 kB
Downloads: 12,234
[Download Now]
Share This | Read on | 11 Comments


Theme Bugfix: Blogging Pro

February 5th, 2008 Blog

This theme is not designed by me but I am using it at phpBBcast.com. Came across some bugs and just like to share the fixes for them. These changes applies to a fresh Blogging Pro Theme [widgets ready]. If you have modified it or using the non-widgets version, the following code snippets may vary.

1) If you do a search and click on “Previous Entries” in the search results page, it brings you to the main blog’s page 2 (instead of the search results page 2).

File to be edited: header.php
Replace

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">

With

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="get">

2) Non-align search corner in Iternet Explorer
BloggingPro Search Corner

File to be edited: header.php
Replace

<div class="SearchCorner"></div>

With

<div class="SearchCorner">&nbsp;&nbsp;&nbsp;&nbsp;</div>

3) Top blue bar does not show up intermittently
BloggingPro Missing Header

File to be edited: style.css
Replace

#bgcontain { width: 100%; background: url(./images/bkg_bgcontain.png) repeat-x;}

With

#bgcontain { width: 100%; }

4) Footer with extra space and characters in Internet Explorer
BloggingPro Footer

File to be edited: footer.php
Replace

<?php do_action('wp_footer', ''); ?>

With

<ul><li></li></ul>
<?php do_action('wp_footer', ''); ?>
Share This | Read on | 9 Comments


Top 8 WordPress Theme Directories

January 7th, 2008 Blog

List is sorted by Google PageRank. Should be a useful reference for WordPress theme authors on where to share their masterpiece. And theme shoppers should go where theme authors go ;)

wpThemesFree
wpThemesFree (PR6)
Collection: 1870 themes
Submission: Fill in form (No registration required)
Approval: Manual review
Link Juice: DoFollow
Note: theme zip file hosted by wpThemesFree, author unable to update themselves

Free WordPress Themes
Free WordPress Themes (PR5)
Collection: 1182 themes
Submission: Register and fill in form
Approval: Auto approve
Link Juice: No juice, 302 redirects
Note: 1) theme zip file hosted by freewordpressthemes, author ABLE to update themselves, 2) No link juice but gallery is run by Splash Press Media, whose network includes Performancing, The Blog Herald and more.

Fresheezy
Fresheezy (PR5)
Collection: 241 themes
Submission: Fill in form (No registration required)
Approval: Manual review
Link Juice: DoFollow

wpSnap
wpSnap (PR5)
Collection: 148 themes
Submission: Register and write post in WordPress
Approval: Manual review
Link Juice:: Selective NoFollow

Weblog Tools Collection
Weblog Tools Collection (PR4)
Collection: Undeterminable
Submission: Register and post in forum
Approval: Manual review
Link Juice: DoFollow

Themes-WP
Themes-WP (PR4)
Collection: 796 themes
Submission: Register and fill in form
Approval: Manual review
Link Juice: DoFollow
Note: theme zip file hosted by Themes-WP, author unable to update themselves

Kate Theme Viewer
Kate’s Theme Viewer (PR4)
Collection: 617 themes
Submission: Register and fill in form
Approval: Manual review
Link Juice: DoFollow
Note:
theme zip file hosted by Kate, author unable to update themselves

Themespack
Themespack (PR4)
Collection: 129 themes
Submission: Register and write post in WordPress
Approval: Manual review
Link Juice: DoFollow

Share This | Read on | 7 Comments


WP Plugin Update: Genki Youtube Comments 1.1

December 7th, 2007 Blog

A new Youtube API was released into the wild on 28 August 2007. The old REST/XML-RPC API was supposed to continue to work for at least a year, till August 30th, 2008. So I thought I have plenty of time before I need to update the Genki Youtube Comments plugin.

Unfortunately a few weeks back, the comments feed in the old API was removed and broke my plugin. After some quick reading and patching, the plugin is playing nice again :)

No new features from the new API except now we can grab the last 25 comments (up from 10). Give v1.1 a download here

Share This | Read on | 2 Comments


How to Improve Search Function in WP [Using Google]

October 24th, 2007 Blog

Continuing from my previous post on improving WP search function using plugins, I’m going to show you how to integrate Google Custom Seach Engine into your blog. Live demo here.

Advantages include:

  • Results are sorted by relevancy
  • All content in posts/pages (e.g comments) are searchable
  • Make some money by displaying relevant ads using AdSense :)

Hold your horses!

First we need to find out how well Google has indexed your blog. If your blog isn’t properly indexed, Google can’t return relevant results and that would defeat the whole purpose of outsourcing the search function. In that case, you are better off sticking to using search plugins.

Now go to google.com and type in the following and replace my blog url with your own blog.

site:ericulous.com

You will see the number of of pages indexed by Google and of course the search results. Does the number of pages tally with your blog? Are you liking the results returned? There’s no hard and fast rule here. Generally if you have a established blog, you need not worry much. Whereas fresh blogs might not be properly indexed (yet).

Google Custom Site Search

With that out of the way..

Step 1: Create a Custom Search Engine for your blog

A. Login to http://www.google.com/coop/cse/
B. Click on the “Create Custom Search Engine” (big blue button)
C. Fill in the form (sample as below)

CSE Sample Form

D. Click “Next” button and on next screen, click “Finish” button
E. Click on “Control Panel” and then on “Code”
F. Specify the url in your site for the search results to appear (http://ericulous.com/googlesearch for me)
G. For ads, I opted for “Top & Right” (remember to enter your adsense id in “Make Money” tab)

CSE Control Panel

H. Leave this window open as we’ll need to copy and paste the “Search box code” and “Search results code” later

Step 2: Modify theme files

I will be using the Default WordPress theme for illustration here. Adapt to your theme as and where needed ;)

A. Modify searchform.php
Replace following with the “Search box code” in Step 1H

<form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
<div><input type="text" value="<?php the_search_query(); ?>" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Search" />
</div>
</form>

B. Create a new page template
1. Duplicate a copy of page.php and rename it googlesearch.php
2. Open googlesearch.php and add the following code at the top
(before < ?php get_header() ?>)

<?php
/*
Template Name: GoogleSearch
*/
?>

3. Replace following code (for maximum width)

<div id="content" class="narrowcolumn">

with

<div id="content" class="widecolumn">

4. Delete the following code (to remove sidebar for maximum width)

<?php get_sidebar(); ?>

5. Delete the following code

<?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>

and in place, add both the Search box code and Search results code in Step 1H

Step 3: Create a new page in WordPress

A. Go to Admin Panel > Write > Write Page
B. Enter a page title
C. On the right menu, look for “Page Template” and select “GoogleSearch”
D. On the right menu, look for “Page Slug” and enter “googlesearch”

Now you have the King of Search at your bidding :)

Share This | Read on | 1 Comment


How to Improve Search Function in WP [Using Plugins]

October 16th, 2007 Blog

Current WordPress search limitations

  • Results sorted by date, not relevance. May not be an issue if your posts are time sensitive. But most likely you want your visitors to find the best matched post instead the newest matched post.
  • Only posts are searchable; pages, comments etc are not. May not be an issue if you only have a few pages with unimportant info (e.g contact). But if you rely heavily on pages for your content (e.g CMS), you are out of luck..

..but where limitations sets in, WordPress plugin authors always come to the rescue :)
I won’t be listing the tons of search plugins available. Just the one that I like, works well and a breeze to install.

Must Have Plugins

Search Unleashed
Function: Full text search in posts, pages, comments
Installation: Plug & Play with many options in admin panel
Demo: A search for “occurrences” returns result from comments.

Optional But Nice to Have Plugins

Nice Search
Function: Beautify your search url by redirecting ?s=query searches to /search/query
Installation: Plug & Play
Demo: Just do a search on author’s blog

Search Spelling Suggestion
Function: Displays a suggested spelling correction for a given term (like google)
Installation: Add only a line of code to your search template
Demo: Search for “computor” and the search page will display “Did you mean: computer”.

Search Meter
Function: Keeps track of what your visitors are searching for.
Installation: Plug & Play
Demo: Admin Panel Screenshot

Some notes

With the above plugins, there remain one limitation: sort by relevance. The only plugin that address this issue is “WordPress Advanced Search”. Unfortunately it is not compatible with WP 2.3 right now. Installation is slightly more complicated but still manageable. And I suspect it may not work well with the above “optional but nice to have” plugins.

[Up Next]: How to address all the issues by outsourcing your search to Google

Share This | Read on | 1 Comment


How to Hide Sub-Categories in the Sidebar

October 9th, 2007 Blog

Hiding Sub-Categories in WordPress

Prior to WordPress 2.1, the wp_list_cats() function has a “children” parameter to hide your subcategories. For whatever reason, wp_list_cats() was deprecated, and the “children” parameter was dropped from the new wp_list_categories() function in WP2.1 and onwards.

So how to hide the unsightly subcategories from showing up in your sidebar? You can install and use the new function in the unfold_list_categories plugin by Braydon Fuller.

Or hide it with a quick and dirty trick using CSS. Simply open your style.css file and add the following code. And poof it’s gone :)

.children { display:none; }
Share This | Read on | 5 Comments


Migrating Your WordPress 2.2 themes to WordPress 2.3

October 4th, 2007 Blog

A list of changes in the default kubrick theme between WP 2.2 and 2.3.

index.php
the_tags() *new

single.php
the_tags() *new
trackback_url() *2.2
trackback_url(true) *2.3

search.php
the_tags() *new

archive.php
is_tag() *new
single_tag_title() *new
the_tags() new

comments.php
the_permalink() *2.2
urlencode(get_permalink() *2.3

attachment.php
trackback_url() *2.2
trackback_url(true) *2.3

Share This | Read on | 1 Comment


Fabulous Site to Download Free Fonts

July 28th, 2007 Blog

This is a paid review but hold your skepticism for a moment and see why I’m adding this site to my designer toolkit ;)

On the web, we are usually limited to using verdana, times new roman, arial etc for our content to ensure consistency across different platforms/browsers. That can make your blog appear dull. Using fancy fonts for your headers or logo can easily spice things up.

So where to get them? Urban Fonts offers over 8000 fonts for both Mac and Windows platform. But what differentiate them from others? Well, it can be a real hassle to try out new fonts but they simplify matters with clever use of ajax components (having a clean web 2.0 design is plus too)

Current Scenario

1. download font
2. install to windows font folder
3. startup Photoshop
4. preview the fonts with your sample text
5. don’t like what you see? repeat step 1
6. remove unwanted fonts (prevent system performance hit)

With Urban Fonts

1. preview font with loads of options (see image below)
2. don’t like what you see? repeat step 1
3. install to windows font folder
4. launch Photoshop and start designing :)

 
Free Fonts

The most powerful feature has got to be the preview font tool (in step 1). You can enter your own text, change text and background color, upper or lower case. All in real time thanks to ajax magic. If you don’t feel like installing the font, you can simply save the generated image (in png format) and work on it. A real time saver.

So go grab some free fonts and jazz up your blog.

Share This | Read on | No Comments


A Webserver on My Thumbdrive

June 25th, 2007 Blog

USB Thumbdrive
Running WOS (Webserver On Stick) Portable on my thumbdrive is so cool!! Why didn’t I discover it earlier?! It would have saved me lots of headache synchronizing my files between office and home. Sometimes I forget to copy some files from office and can’t get anything done at home. Now I can store all my applications and run them any and everywhere. No more excuses reasons for missing the deadline. Wait boss.. what if I forget my thumbdrive :)

Apache/MYSQL/PHP are nicely configured and integrated. No more editing configuration files to make them work together. There’s also PHPMyAdmin, ImageMagick, Drupal, Joomla and of course WordPress (v2.1.2 though). Even permalink works. Gotta love it!!

The only downside is my home PC is still on dinosaur USB1.1 standard. While it’s not exactly crawling, there’s still a noticeable lag. I need a new PC!!

[Found via T2]

Share This | Read on | 2 Comments


Free Evil-Book on Making Money by John Chow

May 29th, 2007 Blog

John Chow is giving away his freshly baked e-book. Aptly named “Make Money Online With John Chow dot Com” with an equally attractive byline “How I Went From Zero To $10,000+ a Month By Blogging and How You Can Too”. Confirm make money else money back guaranteed.. with a catch.. oops.. you knew it can’t possibly be that good.

Guaranteed – You will make money using the information contained in this E book or i will give you 1000 times your money back. Oh wait, you paid zero for it. Make that 1 million times your money back.

Why is he giving it away free? Because TRAFFIC = $$$. This freebie will generate tons of traffic and backlinks to his blog and he will reap the rewards later. Evil as he always is :twisted:

I’m pretty sure the E in the E-Book stands for Evil. But while he always say he’s evil, the truth is he always keep his readers in mind to help them make money online. If you review his blog, he will even link to you.

Go grab the free evil-book now ;)

Share This | Read on | 21 Comments


YouTube Comments Plugin on The WordPress Podcast

May 28th, 2007 Blog

Pleasantly surprised to find Genki YouTube Comments among the 3 plugins to be featured on the latest podcast Episode 24: WordPress 2.2 and the Search for New Co-hosts.

Text transcript with Charles Stricklin [host] and Aaron Brazell [guest host].

Aaron: The third plugin we have today, Genki YouTube Comments and I insisted on taking this plugin because Charles cannot pronounce genki [1] (Charles chuckles in background). This is a plugin that, Genki YouTube Comments is particularly for those people who produce a lot of videos for YouTube and they sort of have their own following on YouTube and post their video on their blog but because everybody is over at YouTube end up getting all the comments on the video over at YouTube. That’s just a pain. You want to produce the stuff so you could actually have the comments and the activity on your blog, not on YouTube. Lord knows that they got enough traffic already they don’t need anymore.. hehe.. This doesn’t actually take the traffic from YouTube, but what it does is it will inject, so to speak, the comments from YouTube into your blog for that video. This is obviously gonna work primarily only actually for.. if it’s your video, because if you using the YouTube API, it’s gonna use your username and password. It’s gonna check if it’s your video [2]. If it is, it grab those comments and insert them as comments on your blog as well. And it does this on a schedule. So you can set it up for hourly, daily or weekly if you are using WP 2.1 or 2.2. So that definitely looks like something for anybody out there who does any amount of work on YouTube. This looks like something that could really benefit you.

Charles: But this is all dynamic, it only shows whatever were the last 10 comment from the moment that you are viewing your blog.

Aaron: That’s why it runs on a schedule right? [3] That’s what I believe. I’ve not run this so I dun know. Of course I don’t do a whole lot of work on YouTube either. Next time I post a video on YouTube, I’m gonna check this out. Of course if listeners out there have used it, we love to hear what you think about this plugin and tells us if it works the way it’s supposed to, what kind of experience you had.

My feedback on some points:
[1] Yes, Aaron got the pronunciation right ;)
[2] Actually you need not to be the owner. Works for all YouTube videos.
[3] Yes, that’s right. Options include hourly, daily, weekly or manually.

Share This | Read on | No Comments


Testing of Plugins and Themes on WP 2.2

May 17th, 2007 Blog

With the release of WordPress 2.2, it’s time to do a round of check with my plugins and themes. Always have mixed feelings when a new version of WordPress is released. Happy to see new features incorporated while dread to see my plugins/themes breaks. Luckily I was spared the headache this round :)

Themes
With the tags feature delayed till next version, there’s only minor changes to the themes functions. Hence most of my themes should work in WP2.2

Summary of changes in the WordPress Default Theme

  • multiple files
    Function blogininfo(‘home’) is now replaced by bloginfo(url’).
    But both function still works.
  • header.php
    New function blogininfo(‘text_direction’) (for arabic language support?)
  • comments.php
    minor changes here and there to the .alt comment class for xhtml/css validation

Plugins
All plugins tested ok. Only a minor bug in Genki Announcement where the link to widgets is unavailable since Widgets is now integrated with WP2.2. However, it should not affect any functionality.

Share This | Read on | 5 Comments


Check Your Akismet Spam Often

April 30th, 2007 Blog

I rarely check my Akismet spam folder, just like I don’t check my Gmail spam folder. I only venture into the spammy zone when feeling bored. Probably placed too much trust in those filters.

Over the week, I have recovered about 5-6 legit comments, out of 200+ spams. So do check often as you do not want your commentors feeling puzzled and discouraged. I just hope not too many genuine comments were deleted in the past as Akismet clears the list automatically after 15 days. This shall be a daily routine for me.. that is until I slack again :)

Some spam management tools to make your life easier:
1) WordPress Plugin – SpamViewer
2) Greasemonkey Script – Akismet Auntie Spam

Share This | Read on | 2 Comments


Add a Technorati Rank Widget for Blogspot

April 29th, 2007 Blog

After posting a mini tutorial on adding a Technorati Rank widget for WordPress, Shawn commented on whether such a widget is possible for Blogspot. Yup, it can be done but slightly more complicated. And it won’t work on Blogger Classic templates as it requires the use of page elements available only in New Blogger. Classic Bloggers may want to try PurpleMoggy’s technorati rank widget

So here’s a look at the final product:
Technorati Rank Widget

Step 1:
1a. Enter your blogspot url at Tecnorati Rank RSS Feed (Yahoo Pipe created by engtech). Leave the “display before” and “display after” field empty. Click “Run Pipe”.

Technorati Blogspot Figure 1

1b. Right click on “Get as RSS” and copy the url e.g http://pipes.yahoo.com/…?textinput7=http%3A%2F%2Fericulous.com…&_render=rss

Technorati Blogspot Figure 2

Step 2:
Login to your Blogspot and go to Template > Page Elements. Click “Add a Page Element” and add a “Feed” element. Paste the url from Step 1b and click “Continue”.

Technorati Blogspot Figure 3

Technorati Blogspot Figure 4

Step 3:
Go to “Edit HTML” tab. Do a backup first by clicking “Download Full Template”. Look for the </head> tag and insert the following BEFORE </head>.

<style type='text/css'>
#Feed1 {
width: 88px;
height: 26px;
background: url(http://i16.tinypic.com/4gpcya1.gif) no-repeat;
}
#Feed1 h2 {
display:none;
}
#Feed1 ul {
margin: 0;
padding: 1px 3px 0 0;
}
#Feed1 ul li {
font-size: 11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
list-style-type: none;
text-align: right;
text-decoration: none;
}
#Feed1 a:link, #Feed1 a:visited {
color: #4096EE;
text-decoration: none;
}
#Feed1 a:hover {
color: #3F4C6B;
text-decoration: none;
}

note: if you have more than 1 Feed page element, it may have a different ID other than Feed1. See what other Feed ID you have by doing a search for "id='Feed" and note them down e.g Feed2, Feed3. Replace all instances of Feed1 in the above code with Feed2 or Feed3 etc..

Further Customization (Optional)
* Change the way you link to Technorati
Use the different flavours of Technorati Yahoo Pipes created by engtech.wordpress.com

Share This | Read on | 9 Comments


Ditch FeedBuner Site Stats for a Speed Boost!

April 27th, 2007 Blog

Notice the speed boost? In the past, when you first load this blog, you probably see the posts unfold, as if in slow motion, one by one. It’s like

1st post loading..
tapping finger..
2nd post loading..
tapping foot..
3rd post loading……

While browsing through the Main Index Template, I realised I have installed the FeedBurner Site Stats (not to be confused with Feeds Stats) code and totally forgotten about it.

<script src="http://feeds.feedburner.com/~s/ericulous?i=<?php the_permalink() ?>" type="text/javascript" charset="utf-8"></script>

This code snippet is inserted within The Loop. Meaning a javascript to an external site (FeedBurner) is called for every single post. No wonder so WOLS!

1st post loading..
inform feedbuner
2nd post loading..
inform feedbuner
3rd post loading….

After removing the code.. bam.. the blog content loaded swiftly. Sweet :)

*update: built a Feedburner SiteStats wordpress plugin to counter this issue

Share This | Read on | 6 Comments


Add a Alexa Rank Widget in 3 Simple Steps

April 26th, 2007 Blog

Seeing that JPF has a Alexa Rank WordPress Plugin, let’s make another button similiar to the Technorati Rank Widget in previous post. The ones provided by Alexa are BIG, at least compared to the 80×15 badges. So here’s how to create one in 3 simple steps (deja vu!).

This will be our final product:
Alexa Rank Widget

Step 1: install JPF Alexa Rank WordPress Plugin

Step 2: download alexa.gif (right click, save as) and upload into your theme’s images folder e.g /wp-content/mytheme/images/

Step 3: insert the following code to your sidebar.php

<style type="text/css">
.alexarank {
width: 88px;
height: 26px; 
background: url(<?php bloginfo('template_url'); ?>/images/alexa.gif) no-repeat;
}
.alexarank a {
color: #4096EE;
float: right;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 1px 5px 0 0;
}
.alexarank a:hover {
color: #3F4C6B;
}
</style>
<?php jpf_alexa_rank('<div class="alexarank">','','</div>'); ?>

Further Customization (optional)

* A different background image
Download and edit the Photoshop PSD file

* Link to Alexa Traffic Details instead of Alexa Overview
This requires hacking the jpf_alexa_rank.php plugin file.
Replace $rankurl = “http://www.alexa.com/data/details/main?q=&url=”.$blog;
with $rankurl = “http://www.alexa.com/data/details/traffic_details?q=&url=”.$blog;

Share This | Read on | 25 Comments


Add a Technorati Rank Widget in 3 Simple Steps

April 25th, 2007 Blog

Considering the “importance” of Technorati ranking in online money making, it is rather odd that Technorati doesn’t provide a ranking widget. Doug Karr created a Technorati Rank WordPress Plugin but I just need a simple looking button like those little 80×15 badge. So here’s how to create one in 3 simple steps.

This will be our final product:
Technorati Rank Widget

Step 1: install JPF Technorati Rank WordPress Plugin

Step 2: download technorati.gif (right click, save as) and upload into your theme’s images folder e.g /wp-content/mytheme/images/

Step 3: insert the following code to your sidebar.php

<style type="text/css">
.technoratirank {
width: 88px;
height: 26px; 
background: url(<?php bloginfo('template_url'); ?>/images/technorati.gif) no-repeat;
}
.technoratirank a {
color: #4096EE;
float: right;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 1px 5px 0 0;
}
.technoratirank a:hover {
color: #3F4C6B;
}
</style>
<?php jpf_technorati_rank('<div class="technoratirank">','','</div>'); ?>

End of project. Feeling a bit adventurous?

Further Customization (optional)

* A different background image
Download and edit the Photoshop PSD file

* Link to Technorati Search instead of Technorati Blog Info
This requires hacking the jpf_technorati_rank.php plugin file.
Replace $rankurl = “http://technorati.com/blogs/”.$blog;
with $rankurl = “http://technorati.com/search/”.$blog;

Share This | Read on | 8 Comments


Scroll
to Top