Generate kaleidoscopic images online for free! © NG

Kaleidoscopes offer new magical visuals right before your very eyes and here is a list of websites where you can create kaleidoscopic images for free right before your eyes! You can add these images in a blog, make calendars and greeting cards etc.

Get creative and have fun!

http://www.myoats.com/Go to the Create yours page and simply draw on the canvas and your kaleidoscope will begin to be created instantly. Fiddle with the tools right below the canvas to change the tool settings.

http://www.myoats.com/

Myoats – Create something.

Create kaleidoscopic images online
Sumopaint calls itself the web’s best image editor. Well, it’s pretty good and it is at least one of the best online image editors.

So, which icon will help you paint Kaleidoscopic images? It’s the flowery symbol on top (see the image on left)! Launch Sumopaint app and click the flowery icon. It’s called the Symmetry icon.

Now keep on drawing on the canvas with your mouse. And enjoy the magic that will unfold before your very eyes! Basically whatever you doodle will be multiplied instantly and create a kaleidoscopic image. You can even change the tool settings (try changing the number of symmetry points) from the tool bar on top and keep creating! When you are done, you can save the image in your computer.

And here is a creation by moi!

Kaleidoscope image created at Sumopaint

Kaleidoscope image created free online at Sumopaint

And as if that’s not enough! Sumopaint can turn a photo into a kaleidoscope image too!

Go to File and open a photo from your computer or paste an image url.
When the image loads, click Filters from the Menu Bar on top, and choose Distort and then Kaleidoscope.

I used a Flickr image to create the kaleidoscope image below.

Kaleidoscope image created from photo at Sumopaint

Kaleidoscope image created from photo at Sumopaint

http://krazydad.com/kaleido/ This is yet another marvelous tool. You have to load an online image and choose a basic shape to create a kaleidoscopic image. When you are satisfied, simply save the image on your computer by clicking the “jpeg” button on the bottom left.

I used a Flickr image to create a the kaleidoscopic image below at Krazydad:

Kaleidoscope image created online at krazydad

Free kaleidoscope image created online at krazydad

http://www.tuxpi.com/photo-effects/kaleidoscope Tuxpi lets you upload an image from your computer and create a kaleidoscopic image for free. Once the image is uploaded, you can change the tool setting from left. Once you are satisfied, download the image and upload it again online if you want to add it in your blog. I downloaded and later uploaded again a Flickr image to create my kaleidoscope image at Tuxpi:
Kaleidoscope image created free online at Tuxpi

http://www301.lunapic.com/editor/
First upload an image from you computer or paste an image url. When the image shows up in Lunapic, click effects from the tool bar (situated on top) and choose “Kaleidocope”. Once the processing is complete, you change the tool setting. I used a Flickr image to create a kaleidoscope image at Lunapic.

Kaleidoscope image created online at Lunapic

Pixlr
Go to pixlr editor and upload an image from your computer or paste an image url.

When the picture loads in Pixlr, click Filter from the menu bar on top and choose Kaleidoscope. You can adjust the tool settings once you click the Kaleidoscope tool.

I used a Flickr image to create the kaleidoscope image below:

Kaleidoscope image created from photo at Pixlr

Kaleidoscope image created from photo at Pixlr

Or you can create a new image and apply the kaleidsoscope effect.

The image I created below uses this technique.

Kaleidoscope image painted at Pixlr

Interesting links about Kaleidoscopes

Check out an awesome collection of Kaleidoscopic images at Google Image search.

zefrank.com :: kaleidoscope

Zefrank does not allow you to save images. It is a tool to see how a kaleidoscope image is created.

You might also like to visit the links I have seen at wikipedia’s Kaleidoscope page:


My favourite kaleidoscope image-making site

Sumopaint has won my heart. I really love the way the kaleidoscope images turn out there. I enjoy using the “Symmetry” tool to paint kaleidoscope images. I also love to convert photos into kaleidoscope images.
Long live Sumopaint!

Don’t forget to tell me which kaleidoscopic image-making site you like and why!


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


http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/2011/01/30/generate-kaleidoscopic-images-online-free-web-generator-tool/&title=Generate%20kaleidoscopic%20images%20online%20for%20free%21%20%A9%20Netty%20Gritty%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

How to embed Google Docs in a wordpress.com blog © N G

Google Docs can be embedded in a wordpress.com blog although the code needed to do so is iframe, a type of code that is not supported in wordpress.com.

https://www.google.com/accounts/ServiceLogin?service=writely&passive=1209600&continue=http://docs.google.com/&followup=http://docs.google.com/&ltmpl=homepage http://wp.com/

But Google Docs are useful additions in a blog. It makes embedding and sharing documents easy.

I have figured out a workaround that makes embedding Google Docs (and other iframe widgets) in a wordpress.com blog a possibility.

View an example below. Just click the link “inspiration” to see a Google Doc embed that opens right in a free wordpress.com blog! :D

Question
So, why is the Google Doc not visible immediately?

Answer
Well, we are not supposed to have iframe widgets in a free wordpress.com blog. Embedding Google Docs the way you see here is only a workaround and has this limitation.
*It is also currently the only way of embedding Google Docs (or other iframe widgets) in a free wordpress.com blog that offers full functionality.

If you like what you see, you can learn how to embed Google Docs in a free wordpress.com blog. To do that, you have to learn how to embed iframe widgets in a wordpress.com blog

How to embed iframe widgets in a wordpress.com blog © Netty Gritty

Some widgets are embeddable in a website/blog only via iframe code. Since iframe codes are restricted in wordpress.com, we will embed iframe codes of our iframe widgets not directly, but by using a different workaround.

HTML Tags

WordPress.com allows the following HTML code in your posts, pages, and widgets:

address, a, abbr, acronym, area, b, big, blockquote, br, caption, cite, class, code, col, del, dd, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, ins, kbd, li, map, ol, p, pre, q, s, span, strike, strong, sub, sup, table, tbody, td, tfoot, tr, tt, ul, var

Check out W3 Schools for more information about what each of these HTML codes are used for.

If you are familiar with HTML, you’ll notice that codes such as embed, frame, iframe, form, input, object, textarea and others are missing from the above list. Those codes are not allowed on WordPress.com for security reasons.

- from wordpress.com Support

Why Iframe widgets don’t work in wordpress.com
Iframe widgets are codes enclosed between iframe tags in your wordpress.com blog. As soon as you paste the iframe html tags and save the post, wordpress.com strips the iframe tags. And of course, the widget doesn’t show up as a result of broken code.

Question
Looks like iframe widget can’t be embedded in wordpress.com because iframe tags get stripped here. So is there a way to add the widget without using the iframe tags?

Answer
Iframes are special tags that enable embedding contents  as a frame (that has defined height and width) in your webpage.

So I have been researching for a free online Flash widget generator that can make iframe embeds possible in your blog.

Crazy idea!
And it worked!!!

I have figured out a way to embed the contents right in your blog using Flash. That means, you don’t even have to put iframe codes in your blog in the first place!

Question
But doesn’t Support docs say that iframes and Flash codes can’t be had?

Answer
Well, official information isn’t always trustworthy.  Although Flash codes don’t work in wordpress.com directly, it can be turned into gigya or vodpod shortcodes that DO work in a free wordpress.com blog!
See here:
How to have Flash embeds in a wordpress.com blog
*That post won’t really help you learn how to create a Flash code for your Tagul widget. I was able to figure out the code structure purely by chance. You see, the present code structure that Tagul demands is not intuitive for me. PreviouslyTagul used to give a code that was easily convertible to a gigya shortode. Now it has changed that. I have figured out the code structure from the tag clouds I have created at Tagul, before Tagul changed and that’s how I can still offer it to you!

Huh? What on Earth is Tagul?
Read on! I am getting there!!

How bloggers add iframe widgets  in a wordpress.com blog at present
Since there is no way to embed iframes in wordpress.com, bloggers either take a screenshot of the widget, paste the image and link the image to the required site. See a screenshot of a Facebook Likebox here:
How to add Facebook Likebox in a wordpress.com blog – part 1

Or they subscribe to the RSS feed of the site that offers the widget and display the RSS feed via an RSS widget.

For example, Google Calendar.

Problems with the present methods
While a screenshot is more presentable, it does not update automatically. So recent changes are not visible.
RSS feeds get and show updated content automatically, but they are not much to look at!

A better method
Turning iframe widgets into Flash widgets is better. It allows you to load the original iframe widget right in your own blog. That means it shows updated info automatically and it looks good.

Extracting the frame url from your iframe widget code

When you need to embed an iframe widget in a website, you just paste the iframe code.
But since wordpress.com doesn’t support this sort of code, you will have to extract the frame url that makes the iframe widget show up in your blog.

You can get the url of your frame in two ways.

Method #1
If you see your iframe widget anywhere (usually after creating the widget in a site), the iframe widget loads somewhere you can see so that you can change the looks if you want. Click somewhere in the iframe widget you see, right-click and choose Open frame in new tab. You will see that only the frame has loaded in that tab.

For example, if you create a Facebook Like Box, Facebook gives you an iframe code. And it shows you how the Likebox looks.
If you right-click inside the Likebox, you will see an option that says “Open frame in new tab”. If you open the frame in a new tab, that’s what you see. The frame in a new page.
:idea: See the frame of a Facebook Likebox here.
You can see the actual Like box and do your right-clicking experiments here:
How to add a Facebook Likebox in a wordpress.com blog – part 2

Method#2
Sometimes you can’t see the iframe widget as you build it. You have to extract and modify the frame url from looking inside the code.

:idea: See an example iframe code of this Google Book

You can see the Google Book embed in a free wordpress.com blog here:
How to embed Google Books in a wordpress.com blog

How to turn iframe codes into Flash codes

We will use Tagul to turn iframe codes into Flash codes.

Why Tagul?

Tagul is basically a tag cloud creation tool that can create beautiful tag clouds for your blog.
* You may want to check out the Tag Cloud I created with Tagul.

But, right now, we will use it as a different tool – an iframe to Flash converter.

Although Tagul is a tag cloud creation tool, it can be used to link to a web page and not just a tag page. If I choose to link to the url of a “frame” that I found in an iframe code, then Tagul will link to it, too. It will produce a “text link” within a box and when the text is clicked it is replaced by the frame in the confined box. Right in your free wordpress.com blog!

And that’s how anyone can have iframe widgets like Google Books, Google Calendar etc in a free wordpress.com blog. :D

Things to do

First of all, open a free accunt at Tagul. It’s a member-only service.

Create a new cloud.

You will see a “Tags source” interface like in the image below.

tagul cloud creation interface at Tagul
Click on the image to view larger version

How should you fill in the details?
As you see in the screenshot, you have the option to fill in some details in the left panel.

- Please leave the “url” link empty. We don’t need it to embed iframe widgets in wordpress.com via Tagul.
– Write the word you want your text box to say.
(My “Tag cloud” in the screenshot says “Calendar” because I used it to embed a Google Calendar!)

- Shorten the url of your frame using bit.ly or similar url shortening service. Then put the shortened url in the field that says “Tags’ links pattern”.
(I put the shortened url of the frame of my Google Calendar in the screenshot.)

Now choose the tab “Appearance”.
tagul cloud creation Appearance interface
Click on image to view larger version.

The “Appearance” tab helps you configure how your Tag Cloud will look.

“Customize cloud shape” is of no use here, since we have only one word in our “Tag Cloud” and you need many words to make that work. So choosing any shape will produce the same result.

You can choose “Tags Rotation Angles” arbitrarily.
(I prefer it as it is.)

Now expand the “Fonts” tab and choose a font.
tagul cloud creation Fonts interface
Click on image to view large version.

Now expand the “Colors and Animations” tab and fiddle with the settngs. You can click “Visualize” to see what happens with each setting.
tagul cloud creation colors and animation interface
Click on image to view large version.

When you like the look of your Tag Cloud, don’t forget to click “Save Changes” on the right!

Now expand the tab “Grab and Share!”
tagul cloud creation grab and share interface

Now choose the tab “Send link to a friend” and copy the link by clicking the button “Copy to clipboard”.
tagul cloud creation send link to a friend interface

Your job at Tagul is practically over!

Adding the “Tag Cloud” in your wordpress.com blog
Choose where you want your “Tag Cloud” to appear and paste the link there.
(The Tag Cloud will appear anywhere that gigya shortcodes are allowed, that is, in a post/page/side bar/footer/header-widget.)

My link is this one:

http://tagul.com/preview?id=19054@12

It goes to my Google Calendar when clicked.

Now observe the link you got carefully.
Delete everything from the beginning of the link upto the = sign. That will leave you with a number@number combination.
After I deleted the unnecessary portion, my number@number is this:
19054@12

Here is the basic code structure that you need to use:

[gigya src=”http://cdn.tagul.com/cloud.swf” type=”application/x-shockwave-flash” allowscriptaccess=”always” width=”number” height=”number” flashvars=”id=number@number”]

Caution
Please don’t copy the code from above. Copy the code from here
Paste this code where you want your “Tag Cloud” to appear.

:!: Remember to delete the part number@number in the code and paste your own number@number in its place. Also, don’t forget to delete the word numbet both in width=”number” height=”number” in the code and put the actual numbers. The numbers will determine the size of your iframe widget.

Bonus tip
If you want the link to open in a new window to allow full-screen viewing, this is the code you will need:

[gigya src=”http://cdn.tagul.com/cloud.swf” type=”application/x-shockwave-flash” allowscriptaccess=”always” width=”number” height=”number” flashvars=”id=number@number&openLinksInNewWindow=true”]

Copy the code not from above, but from here
Change the parts in the code in the same way you would the first code.


Why not to copy codes directly from this blog post
Sorry friends. It is not a copyright issue, if that’s you have been guessing! Thing is, if you copy the codes from this blog post, all the plain quotes will be automatically transformed into curly quotes when you paste the code in your blog and then the code won’t work! It’s a wordpress.com issue and I haven’t been able to figure out how to get rid of it.
If you have any solution, please help me!


Important Notice
This tutorial is not the same as it appeared on the publication date. I had to rewrite the tutorial in some parts (date: 31, March, 2011) since Tagul changed its interface.
If you want, you can still read the previous version.


Search this site Find more posts on: , , ,


http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/2011/01/25/how-to-embed-iframe-widgets-in-a-wordpress-com-blog-%25c2%25a9-netty-gritty/&title=How%20to%20embed%20iframe%20widgets%20in%20a%20wordpress.com%20blog%20%A9%20Netty%20Gritty%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

How to embed documents in a wordpress.com blog using Calameo © Netty Gritty

Calameo is yet another superb way to embed documents in a wordpress.com blog.

Calameo document embeds are rich in features. Click around in the Calameo embed below and see for yourself!

How to create a Calameo embed code that is compatible in wordpress.com blogs

It’s really easy to embed a Calameo document in your free wordpress.com blog.

Choose a document from their collection or upload your own document.
I chose to embed the publication Pitagoras.

Get the embed code
I clicked the link “Share” to get the embed code.

Copy the appropriate code
I copied the standalone url.

Copy the standalone url of your chosen Calameo document.
Paste the code where you need to have your Calameo embed.

The standalone url of the Pitagoras embed is this:

http://v.calameo.com/2.1/cviewer.swf?bkcode=0002685127af1680568e4&langid=en

Create a Calameo code that will work in wordpress.com
You need the url at this point.
Create your code in the following method:

gigya src=”STANDALONE-URL” width=”nnn” height=”nnn”

*Change the parameters in the above code as needed and paste it within third brackets:
[]
* Learn more about the gigya method.

This is how my embed code for PITAGORAS looks:
gigya src=”http://v.calameo.com/2.1/cviewer.swf?bkcode=0002685127af1680568e4&langid=en” width=”600″ height=”500″

All I had to do is paste the code between third brackets [] and I got the Calameo document embed up and running in my free wordpress.com blog. :D


Search this site Find more posts on: , , ,


http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/&title=Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

How to add a Powerpoint presentation from Authorstream in a wordpress.com blog © Netty Gritty

Authorstram is a great way to embed Powerpoint slideshows with style right in your wordpress.com blog.

Embed your PowerPoint presentations on your blog or website with any programming! Simply upload your PowerPoint presentation on authorSTREAM, get the embed code and plug it in your blog or website. The presentations remain the way you created them, with animation, slide timings and even audio narration.
[…]

Other things you can do on authorSTREAM

- from the site

View an Authorstream presentation below:

Adding Authorstream in wordpress.com blogs

Authorstream offers Flash codes that you have to paste in a blog in order to have an Authorstream slideshow in a blog.

http://www.authorstream.com/ http://wordpress.com/

The Flash code won’t work in wordpress.com if you paste it directly. But once you modify the code you can have your Authorstream in your free wordpress.com blog.

This post will help you achieve that:
How to have Flash embeds in a wordpress.com blog
* Please choose the gigya method, it works like a charm!


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


http://relatedlinks.googlelabs.com/config/demo?url=https%3A//shongjog.wordpress.com/2011/01/22/how-to-add-a-powerpoint-presentation-from-authorstream-in-a-wordpress-com-blog/&title=How%20to%20add%20a%20Powerpoint%20presentation%20from%20Authorstream%20in%20a%20wordpress.com%20blog%20%A9%20Netty%20Gritty%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

How to embed a Google Calendar in a wordpress.com blog © Netty Gritty

https://www.google.com/accounts/ServiceLogin?service=cl&passive=1209600&continue=http://www.google.com/calendar/render&followup=http://www.google.com/calendar/render

Google calendars can be embedded in a wordpress.com blog.

The problem is, Google Calendar offers iframe codes that you have to put in a blog to embed the Google Calendar. Since iframe is restricted in wordpress.com blogs, embedding a Google Calendar in a wordpress.com blog is not a possibility. Bloggers have been adding the RSS feed of Google Calendars in a wordpress.com blog as an alternative.
But it lacks full functionality and totally misses the rich interactivity of Google Calendars.
Not good. Not pretty.

I have figured out how to embed a Google Calendar in a wordpress.com blog with full functionality.

See an example below. Just click the link below to enjoy the magic of Google Calendar right in a free wordpress.com blog!

Good to know
The Google Calendar you see above is possible via a workaround that makes iframe widgets work in wordpress.com.

Read How to embed iframe widgets in a wordpress.com blog

How to embed Google Books in a wordpress.com blog © Netty Gritty

Google books cannot be embedded in a wordpress.com blog since it offers iframe codes and iframe codes are off-limits for bloggers at wordpress.com.

Breaking news

Now you can embed Google Books in a wordpress.com blog.

Click the link below to view an example of a Google Book embed in a free wordpress.com blog.

Do you want to learn how to embed Google Books in your free wordpress.com blog? The Google Book you see above is embedded via a workaround that makes iframe widgets work in wordpress.com.

Learn how to do that here:
Read How to embed iframe widgets in a wordpress.com blog


http://relatedlinks.googlelabs.com/config/demo?url=http%3A//shongjog.wordpress.com/2011/01/21/how-to-embed-google-books-in-a-wordpress-com-blog/&title=How%20to%20embed%20Google%20Books%20in%20a%20wordpress.com%20blog%20%AB%20Netty%20Gritty&domain=http://shongjog.wordpress.com/&language=en

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: , , , ,