Flash, Charts & Maps

[background bokeh=”yes” particles=”yes” overlay=”no”]
[background_image]{THEME_ROOT}/images/stars3.jpg[/background_image]
[/background]

[spacer_20][spacer_20]

[h3]Embed Flash[/h3]

A lot of people knock on flash for not being accessible. But did you know it’s actually not true? Flash, just like javascript, can be progressively enhanced so that search engines, non-flash devices, etcetera have no problem with it. The only issue is that not everyone knows how to do it properly. We give you easy shortcodes that make flash easily degrade to text or images for non-flash devices, and even have alt content for SEO just like images!

[box]
[flash height=”200″ backup=”http://klixtheme.com/demo/all/wp-content/themes/klix/images/preview/rocket600x200.gif” alt=”SEO Text” bgcolor=”#000000″]{THEME_ROOT}/images/preview/rocket600x200.swf[/flash]
[/box]

[toggle_box title=”Shortcodes:”]
[code_table]
[code_line][box][/code_line]
[code_line][flash height=”200″ backup=”backup-img.jpg” alt=”SEO Text”]flash-url.swf[/flash][/code_line]
[code_line][/box][/code_line]
[/code_table]
[/toggle_box]

If you don’t include a “backup” attribute image then the alt text will be the actual backup HTML that non-flash users will see. Otherwise they see the image specified and it has that alt text. You can also include other attributes:

[bullet_list]
[item]minflash (a minimum flash version, and lower versions will degrade to the backup content)[/item]
[item]bgcolor (to set the background color of the embedded swf)[/item]
[item]flashvars (for advanced users to set flashvars to send to the flash)[/item]
[item]params (for advanced users to set parameters such as allowing full screen and window modes)[/item]
[/bullet_list]

[spacer_20][spacer_20]

[h3]Google Maps[/h3]

Google maps lets you insert an actually google map right on your page. Setting it up can take some work though! Google requires you to manually give lattitude/longitude coordinates for things. But don’t fear! The documentation explains easy tricks for finding all this stuff! Again, we put it inside a box shortcode because it just looks nice, but you can use it anywhere!
[box][google_map zoom=”10″ center=”42.7381872828527, -84.59335327148438″ marker=”42.7381872828527, -84.59335327148438″][/box]
[toggle_box title=”Shortcodes:”]
[code_table]
[code_line][box][/code_line]
[code_line][google_map zoom=”10″ center=”42.73, -84.59″ marker=”42.73, -84.59″][/code_line]
[code_line][/box][/code_line]
[/code_table]
[/toggle_box]

[spacer_20][spacer_20]

[h3]Google Charts[/h3]

Google charts lets you insert charts generated by google. You will need to read about google’s chart capabilities and how to set things up. So this is a shortcode few will use. But for those that understand google charts, it’s here for you!
[box][google_chart data=”41.52,37.79,20.67,0.03″ bg=”ffffff” labels=”Example+One|Second+Example|Another+One|Other” colors=”058DC7,50B432,ED561B,EDEF00″ size=”600×200″ title=”Example Chart” type=”pie”][/box]
[toggle_box title=”Shortcodes:”]
[code_table]
[code_line][box][/code_line]
[code_line][google_chart data=”41.52,37.79,20.67,0.03″ bg=”ffffff” labels=”Example+One|Second+Example|Another+One|Other” colors=”058DC7,50B432,ED561B,EDEF00″ size=”600×200″ title=”Example Chart” type=”pie”][/code_line]
[code_line][/box][/code_line]
[/code_table]
[/toggle_box]

Leave a Reply

Your email address will not be published. Required fields are marked *