Published
on
July 31, 2009
| 2,431 views
| 1 follower
members are following updates on this item.
The IGLOO content editor uses a feature called HTML Tidy to clean up the code of your submitted page content. This feature helps users with limited to no HTML experience by working behind the scenes to reduce any potential problems with the final rendering of the newly crafted web page.
As with most scripts that aid users in their daily tasks they have their ups an downs.
One item that gives many users a headache is when they past in a block of code from a third party service like Twitter.
Like many services, Twitter does a nice job of doing all the work for you by generating a small block of code that can easily be copied into any webpage, but sometimes different systems don't play well together.
Below is a copy of the code that can be found on the Twitter Site.
<div id="twitter_div">
<h2 class="sidebar-title">Twitter Updates</h2>
<ul id="twitter_update_list"></ul>
<a href="http://twitter.com/IGLOOSoftware" id="twitter-link" style="display:block;text-align:right;">follow me on Twitter</a>
</div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/IGLOOSoftware.json?callback=twitterCallback2&count=5"></script>
It looks simple enough, however for the untrained eye, this little piece of html causes a small problem when added to the IGLOO content editor.
This is sometimes referred to as an empty tag.
<ul id="twitter_update_list"></ul>
Notice there is nothing in between the UL tags. HTML tidy will try to correct this for you in a number of different ways. Perhaps depending on its mood, Tidy will reformat the code, remove the code or even a combination of both.
To complicate things further, various web browsers clean the code in different ways. So pasting into the editor while using Firefox can have a different effect than if you pasted from Internet Explorer
To get around this little annoyance you have to do a minor adjustment. Changing the code to the following will correct the problem:
<ul id="twitter_update_list"><li> </li></ul>
There you have it a quick little fix.
Twitter is the example used here but this would apply to any external code you paste into the editor.
Page Options
2 Comments
I am trying to use the official Twitter Widget and Igloo seems to clean the code no matter what I do.
Any ideas or plans for a native widget?
Please disregard the previous comment. In the preview, the window just shows <script> <script>, but once you publish, the widget actually works!