How to add Sharethis in a wordpress.com blog (c) Netty Gritty

A Sharethis widget can be added in a wordpress.com side bar so that your visitors can choose a service they like to share your blog in a social bookmarking site they prefer. It also enables your reader to email someone your blog without leaving your blog.

What is Sharethis?

The Share This plugin for I created for WordPress has evolved into a widget and service offered by ShareThis. ShareThis is available as a WordPress plugin, and as a widget for all platforms (including plain HTML web sites).

Besides supporting other platforms, ShareThis now allows you to login and access your preferences across all ShareThis enabled web sites. Publishers can register at sharethis.com and receive stats and reporting on the sharing activity happening on your site.

Get ShareThis for WordPress or other platforms from sharethis.com

- from alexking

Although it is claimed that it works in all blogging platforms, none of the methods work in a wordpress.COM blog.

Good to know
The Sharethis method described here is the only interactive sharing method that I am aware of that can be put up in a wordpress.com side bar to encourage your readers to share your blog, and not a single blog post.

http://sharethis.com/ http://wordpress.com/

Click on the link below to see how it looks and behaves.

Click the big “share” link above and play with the widget.

If you like this widget and if you want to add Sharethis like this in your free wordpress.com blog, do let me know.

Why?
I have other tutorial posts in my priority list right now. However, if enough bloggers want a Sharethis widget in a wordpress.com blog, I will finish this Sharethis tutorial early.

Thanks!

How to add a Facebook Likebox in a wordpress.com blog – part 2 (c) Netty Gritty

Finally here is how you can have a Facebook Likebox right in your wordpress.com blog.


Note: This post assumes that you have already created a Facebook page.


Go to Facebook’s Social plug-ins page and create your Facebook Likebox.

http://developers.facebook.com/docs/reference/plugins/like-box

When you are satisfied with the way your Likebox looks, right-click somewhere inside the Facebook Likebox you see on the right and choose “open the frame in a new tab”.

Go to that new tab. You will see your Facebook Likebox there.
* To know what I am talking about, view My Facebook Likebox

Leave the tab that has your Facebook Likebox open.

Note: This solution does not show the Facebook Likebox by default. But if you click a text link, the Facebook Likebox it links to will open right in your blog!

This blog does not have a Facebook fan page, so I am using the Facebook Likebox of a different Facebook page to show how it looks.

Wanna learn how to create a Facebook Likebox like that in your free wordpress.com blog?
Then please read the following post:
How to embed iframe widgets in a wordpress.com blog


Search this site Find more posts on: , , , , ,


Related Links by Google

 

How to add both “Share on Facebook” and “Facebook like” buttons in a wordpress.com blog post

Facebook Like button in a wordpress.com blog post – get the code here

How to add a Facebook album in a wordpress.com blog

How to add the Facebook Like feature in a wordpress.com blog post in one click

How to add a “Share on Facebook” button in a wordpress.com blog in one click

How to use the Facebook Recommendations plugin in wordpress.com blog

How to add Facebook Likebox in a wordpress.com blog – part 1

How to add a Shelfari widget in a wordpress.com blog (c) Netty Gritty

If you are a Shelfari user and if you blog at wordpress.com, you are gonna love this post!

Note: Although search results for Shelfari in wordpress.com forums keep on telling us that adding a Shelfari widget in a wodpress.com blog is practically impossible because of code restrictions (unless you upload a lame screenshot), it is very possible to add an attractive and interactive Shelfari widget in a wordpress.com blog!

http://www.shelfari.com/ http://wordpress.com/

:!: This post assumes that you already know how to use Shelfari.

See some variations of my Shelfari widget below:

Widget style: Grid of books
Option: small

Widget style: Grid of books
Option: Large

Widget style: Vertical Layout
Option: Small

Widget style: Horizontal Layout
Option: Custom

Choosing the appropriate Shelfari widget type for wordpress.com

Of all the available options, choose Flash.

Embedding Shelfari’s Flash widget in a wordpress.com blog

After you have created your Shelfari widget, copy the Shelfari widget code they give you.

Paste the code where you want the Shelfari widget.

:!: The code you have pasted won’t work in wordpress.com blogs right away. You need to modify the code so that the Flash embed works for wordpress.com.

To learn how to modify your Shelfari’s Flash widget, please read this post:
How to have Flash embeds in a wordpress.com blog


Bonus tip:

Smaller Shelfari widgets look great in the side bar area and footer, while the larger ones are appropriate in posts and pages.


http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/2011/01/19/how-to-add-a-shelfari-widget-in-a-wordpress-com-blog/&title=How%20to%20add%20a%20Shelfari%20widget%20in%20a%20wordpress.com%20blog%20%28c%29%20Netty%20Gritty%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

Search this site Find more posts on: , , , ,

How to add Google Image search option in a wordpress.com blog (c) Netty Gritty

Some people like to search for things visually and here is how you can let your readers search for posts in your wordpress.com blog by using Google Image Search for your blog!

If you haven’t noticed already, I am already using Google Image Search for my blog.

:idea: Look for this part in my sidebar:


Google Image Search result for the blog Netty Gritty - http://shongjog.wordpress.com/Search this blog in Google Image Search

Search this blog visually


And this is what Google Image search shows up for my blog on the posting date:

This trick is as easy as abc and you can add it to your site in 1-2-3!

Okay, enough poetics, I’m getting to the how-to now….

How to add visual search in a wordpress.com blog

You need the following code to create a text link that that will go the Google Image Search page for your wordpress.com blog :

How to use the code to make Google Image Search work for your site

That code won’t work if you paste it directly in your blog. You have to modify it first.

Instructions for modifying the code:

Copy the code.

Go to the site txtformat and paste the code there.

Copy this phrase:
YOURBLOGURL

Paste it in the Replace field, but do NOT click the button.

Open the home page of your blog in a new browser window and copy the url of your blog from the address bar.

Now go back to txtformat and paste the url of your blog in the with field.

Click the REPLACE button.

Your code is now ready!

Copy the code and paste it anywhere you want this in your blog.


When Google Image Search may not work in your wordpress.com blog

Google Image Search may not have a lot of images to show from your blog if

- your blog is new and Google hasn’t indexed your blog yet.
If your blog is relatively new and you can’t find your blog in Google, read this post:
When and How Will Google Index My Website?

- if you are not using images in a way that helps Google index images in your blog.
If you do NOT find a satisfactory amount of images while using Google Image Search for your blog, read this post:
19 Ways to Get More Traffic to Your Site Using Google Images
:!: Not all tips are applicable to a wordpress.com blog. If you are unsure, don’t hesitate to ask me.

If you want just three tips for a starter, read this post:
Using Google Image Search to Drive Traffic to Your Site

This post is also helpful:
Feeling Sandboxed? How You Can Get 53% More Searches with One Tweak


Search this site Find more posts on: , , , ,


You might be interested in these posts also:

How to add a Google Custom Search engine to a wordpress.com blog

How to add site search tags in a wordpress.com blog using Google Custom Search :Netty Gritty

Why I prefer Google Custom Search to WordPress.com search to add site search tags (c) Netty Gritty

Berlin – Hamburger Hofbahn Art Gallery (via City Stroller)

I haven’t seen such a beautiful and magical photo in a long, long time….

Berlin - Hamburger Hofbahn Art Gallery Photo submitted by © Martin Field [click on photo to enlarge] Note by Martin Field Berlin Entrance to The Hamburger Hofbahn Art Gallery Winter in the early evening – The snow fell whilst we looked at the exhibits. When we came out it was a new & magical view. Links : Follow Martin on Twitter – martinfield1 Visit Martin's website – http://www.martin-field.comRead More

via City Stroller

Why I prefer Google Custom Search to WordPress.com search to add site search tags (c) Netty Gritty

Adding site search tags using wordpress.com search is not new, Lorelle did it for a long time in her blog. Now, why would you prefer Google Custom Search and not wordpress.com default search?

The answer
Wordpress.com search result pages are not always up to the mark.

Explanation
Isn’t it only natural that if I search for something, the search result page will reveal multiple links so that I can choose if there is anything worthy of my attention?

I chose a site search tag link from Lorelle’s blog:
links – http://lorelle.wordpress.com/index.php?s=links

It goes to this url:

http://lorelle.wordpress.com/index.php?s=links

And it reveals multiple links from Lorelle’s site. That’s pretty impressive! That means, the visitor has a lot to choose from.

So I followed Lorelle’s footsteps and searched my site for links.

I only have to change the blogname in order to make the search specific for my blog.

Lorelle’s url:

http://lorelle.wordpress.com/index.php?s=links

My url after changing the blog name:

http://shongjog.wordpress.com/index.php?s=links

When I paste the above url in the address bar, it brings me to a search result page that shows links for links from my blog.

But the sight of this page makes me so sad!The search result page shows full posts, and not excerpts, as in Lorelle’s search page! That is so user-unfriendly!

Compare the search result pages side-by-side

The reason behind the anomaly
Now, why did that happen? It happens because of the difference in themes. Some wordpress.com themes show full posts in search result pages (as in inove, the theme of my blog), while other search pages reveal excerpts.

Themes that show excerpts naturally has room for more links to be shown in the front page, but themes that show full posts in search results and so multiple links are visible only if:

- the posts are really really short or
– post truncation is applied (using the more tag) after a first intro in every post or
– pagination is applied in all posts after a short intro.

Why Google custom search engine is better that wordpress.com search
Google Custom Search allows me to present to my viewers multiple links at one glance. No matter which theme you use, it will always pull a list of links.

So if I use Google Custom Search for my blog to search for links, the search result page produces links to a list of posts, that are easy to browse.

See the search page for Links in Google Custom Search Engine for my blog.


Search this site Find more posts on: , , , ,

How to add site search tags in a wordpress.com blog using Google Custom Search :Netty Gritty

I have created a bookmarklet that lets me paste keywords that link to results from my blog generated by Google Custom Search for my blog.

Note:
I have mucked with Rakesh’s Technorati tagging bookmarklet to create my Google Custom Search bookmarklet.

The basic code of the bookmarklet is this:

Important
Don’t just download the code and begin to use it right away (even if you know how this thing works).

You must change the code so that it can help you create keywords for your blog that shows results yielded by the Google Custom Search engine for your blog.

Instructions for modifying the Google Custom Search bookmarklet code for your wordpress.com blog

1. Download the file.

2. Copy the phrase below:
GCS_URL

3. Open the file in your text editor (as in Windows Notepad).
If you don’t have a text editor, download a free text editor.

4. Click Edit in your text editor and then click Replace.

Paste the copied phrase in the Find field.

5. Open the link to your Google Custom Search Engine.
Copy the url of the Google Custom Search Engine for your blog from the address bar.
If you do not have created one already, learn how to create a Google Custom Search Engine for your free wordpress.com blog here:
How to add a Google Custom Search engine to a wordpress.com blog

6. Go back to your Text editor.
Paste the url in the Replace field.

7. Save the file.
I gave mine the name site-search-tags.txt

You can give it any valid name you want to help you recognise the file.

8. Open the file in your Firefox browser.
The bookmarklet code will appear.

Now you need to store the bookmarklet code in your browser in order to use it conveniently. You can learn how to add the bookmarklet here
Please read only section 123 to learn how to do this.

You can learn how to use the bookmarklet in section 127

So how do the site search tags created by Google Custom Search for my blog look?

The contents between the line are generated with the help of the bookmarklet.


Search this site Find more posts on: , , , ,


Why have I begun to use site search tags?

Well, adding site search tags in a wordpress.com blog is nothing new. Lorelle used it for a long time in her blog. You can read about it here:

Link Referrals – Linking to Site Search Tags

Lorelle’s site search tags fetch a list of articles from Lorelle’s blog and the search is powered by wordpress.com’s search engine.

However, I prefer Google Custom Search Engine to wordpress.com search engine. I will explain the reason in the next post.


Type a keyword and search

Create polaroid photos online (c) N G

As a photographer, I wish I could do polaroid photography. But since I don’t have a polaroid camera, I will use one of the online tools listed below to achieve a polaroid effect. All of these sites allow you to create polaroid images online instantly without having to sign up for an account!

Create polaroid photo effect at Rollip

Rollip

http://www.rollip.com/

I nearly had a heart attack when I first visited Rollip. This site has an astounding collection of really wonderful image effects. Once you choose an effect and upload an image, they polarize the image! Once you are done, download it and upload it again to your blog/site!

High-resolution image processing is also available once the image is polarized.

Sharing options:
They also allow you to share the image on Facebook then and there.
Syed Abu Zakir Emon in a street performance

Create polaroid photo effect at Polaroin

Polaroin

http://www.polaroin.com/

We’re finished with upgrades and from now on, you can create high resolution polaroid-like pictures from your photos. Final picture will be 2088×2531. Have fun, people!

-from the site

Just upload an image from your computer or insert an image url, crop image, put some text (e.g location, date), choose a frame or vignette option if you want and polarize the image!

Syed Abu Zakir Emon

Create polaroid photo effect at Piknik

Piknik

First upload an image and crop it to make square. You can do it by choosing the “crop” option. Then choose “Create”, choose “Frames” and choose the polaroid option.

Once the image is ready they let you rotate the image, change image dimensions and background colour.

After the image is totally ready they let you save it in your computer, from where you can upload the image anywhere you need to!

Sharing options: Share the image instantly in Google Buzz.
Syed Abu Zakir Emon in the performance "Circus"

Create polaroid images online at Genki

Genki

http://www.genki.co.nz/genki/polaroid/

Upload image smaller than 1MBkb as bigger images won’t be accepted.
Once you upload the image, they let you scroll the image up and down to choose which portion you want to keep. When the image is ready, just download the image on your computer!

The high-resolution version is not available for free.

Create polaroid images at Drpic

Drpic

http://www.drpic.com/

Uplaod an image from your pc. Crop the image to make it square. Choose “Modify picture” and then choose the style “Polaroid”.

You can tilt the image left or right or choose the style “stack”.

Once the image is ready save the image on your pc or in web (when you save the image in web, they take your email address and post you the secret image link, so that you can delete the image whenever you want to )
Emon

Create polaroid images online at Photonotes

Photonotes

http://www.photo-notes.net/Default.aspx

Upoald an image from your computer or open an image from the web.

Once the image is uploaded, you can crop, rotate and resize the image.
You can also add text. Simply choose a text style, choose the colour of the writing, rotate and position the writing.

Wait while they “render your digital nostalgia”.

They allow you to email the polaroid once you are done.

Create polaroid images online at Instantizer

Instantizer

http://www.instantizer.com/

Upload an image, add a description and they will give you a polaroid instantly! You can even change the angle of the photo. When you are satisfied with the result, just save the image in your computer.
Polaroid image created online at Instantizer

Create polaroid images online at BlinkYou

BlinkYou

http://server.blinkyou.com/polaroid/

Upload an image from your computer. Add some text. Blinkyou will create the polaroid image for you and host the image for you! What I don’t like much is that they put their site name within the picture.
myspace graphics

Create Your Own Polaroid

Create polaroid images at Tuxpi

http://www.tuxpi.com/

Upload an image add text. You can choose text colour, font and font size. You can rotate the image also.
When the polaroid is ready download it to your computer.
Sharing options: You can send the image to imageshack for free web hosting.

Syed Abu Zakir Emon performing in "Circus"

Create polaroid tile images online at pixisnap

Pixisnap

http://www.pixisnap.com/

Select the size of your polaroid. Upload an image from your computer or from an image url.
* RECOMMENDED MINIMUM SIZE: 320 x 240px- Maximum of 3 MB per image.

Confirm your primary photo and customize your polaroid tile photo. Choose a background (plain, design or animated). Choose where you want your polaroid.

Syed Abu Zakir Emon



Downloadable softwares that create polaroid images

http://www.poladroid.net/
Download polaroid image maker



A secret!
I’d love to tell you who the person in the polaroid images is. He is Emon, my significant other. :D


Search this site Find more posts on: , , , ,

Free online HTML wysiwyg editors < Free web resources << Netty Gritty

If you need to format your text online or edit the HTML of web content, you can try one of these online sites for free. Also, none of the site below require you to become a member in order to use their wonderful service.

Online-HTML-Editor

Opens up a new floating window when source page has to be viewed.
Tip: Click html the button to write the html code.

Features

  • Has GUI icons that you can use to help you format the text, images and links.
http://www.online-html-editor.org/
  • You can click the “Fullscreen” button and view the editor fullscreen.
  • Allows you to save file.
  • You can upload an HTML file from your computer to edit it online here.


Real-time HTML Editor

It’s a simple split browswer editor. The HTML code you put in the box in the upper frame turns up the way you can view it in the bottom frame.

Features

  • Nothing.

This stern system can be helpful if you are testing your HTML skill.

Online HTML Editor

Here you can write and see HTML in action. Just write the HTML in the upper box and you can see the result instantly in the lower box.

Features

  • Has GUI icons that you can use to help you format the text, images and links.
http://www.onlinehtmleditor.net/
  • It has two very useful functions – the Footnote and the via button.

Free Online HTML Editor

Write and format text.
Click the source button to copy the HTML.

Features:

  • Has GUI icons that you can use to help you format the text, images and links.
http://www.free-online-html-editor.com/
  • When the source button is clicked, the previous wysiwyg window is replaced by the HTML editor.
  • The GUI icons get deactivated when the source button is clicked.
  • You can click the “Maximize” button to maximize the editor size.

CKEditor

Write and format text.
Click the source button to view and copy code.

Features

  • A very exhaustive set of GUI icons to help you format your content.
http://ckeditor.com/demo
  • The GUI icons are deactivated when the HTML editor is active.
  • You can click the “Maximize” button to view fullscreen.

Real Graphics

Write and format text in the wysiwyg editor. Then click the button to view and copy HTML code.
Or format code in the HTML editor and see how it looks in the wysiwyg editor.

Features

  • A handsome set of GUI icons to help you format your content.
http://www.reallgraphics.com/Editor/index.asp
  • The GUI icons do NOT get deactivated when the HTML editor is active!
  • The HTML editor replaces the wysiwyg editor when the button is clicked and vice versa.

http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/2011/01/03/free-online-html-wysiwyg-editors/&title=Free%20online%20HTML%20wysiwyg%20editors%20%3C%20Free%20web%20resources%20%3C%3C%20Netty%20Gritty%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

Code to make image transparent < wordpress tips << Netty Gritty


There is an image above the line, but you do not see it. The way I have coded the HTML hides the image.

The code for the invisible image is this:

<img style=”background-color:transparent!important;border:0 solid transparent!important;display:none!important;” src=”http://i.creativecommons.org/l/by-nc/3.0/88×31.png”&gt;

And the image it hides is this one:

How I figured it out
Believe it or not, I figured out the code to make images invisible by fluke!
My blog editor went crazy one day. It hid an image and I checked the HTML code of the post if I did anything wrong inadvertently. And I saw this strange tags in the image code. I don’t know how it happened!

Anyway, Panos discussed this technique in his anti-reblogging post long ago.