Compdigitec Labs » (X)HTML

Creating jQuery UI Tabs

admin — Sun, 21 Aug 2011 12:23:50 +0000

jQuery UI Tabs are an easy way to make tabs in your web applications or web sites easily with less code. Consider the following tab structure:


	
		Tab 1
		Tab 2
		More Tabs
	
	Hello
	World
	from jQuery UI Tabs

To turn this into a fully featured functioning tab system, all one has to execute in the is this provided you have included jQuery and jQuery UI with any CSS in your (default CSS can be included like such: ):

jQuery(document).ready(function() {
	jQuery("#tabgroup").tabs();
});

This tab structure also degrades reasonably without JavaScript - one is able to view the contents of all of the tabs and the anchor links are usable - unlike some other tab techniques.

Fixing “Error: window.location.refresh is not a function”

admin — Fri, 23 Jul 2010 23:06:33 +0000

If when you try to refresh the page using Javascript back-end and instead of having the page refresh like you want it to refresh, instead it bounces back into your Javascript Console with a cryptic error that reads “Error: window.location.refresh is not a function“. This can be very puzzling, especially if you are not a regular JavaScript programmer, so one can look into the documentation:

object.reload( [bReloadSource])

Reloads the current page

There’s just one small problem - it’s actually object.reload, not object.refresh! Some poor quality websites (or popular websites which make mistakes) accidently specify location.refresh instead of location.reload. So instead of calling location.refresh(), one should call the following to refresh the page:

window.location.reload();

XHTML-compliant way to embed Macromedia Flash

admin — Fri, 30 Apr 2010 22:05:12 +0000

For many years, people have been using complicated, ugly ways to forcibly embed their Macromedia Flash content into their webpages. There have been several ways, usually using the non-standard element or other fancy IE-only hacks. But now, we have a safe, bug-free, validator-safe way to embed Flash that passes the HTML 5 and XHTML 1.0 standards.

Presenting…

Free and open source XML beautifers to format XML

admin — Sat, 26 Dec 2009 14:07:55 +0000

XML is a great format for storing data, but an improperly-formatted XML file (e.g. whole file on one line, unusual breaking, improper line wrap, etc) can be just as difficult to read as a binary blob. In order to make “blob” XML readable, here are some tools you can use to format XML so it’s readable.

A makeshift Python beautifier - A simple XML formattor written in Python, this formattor formats XML and actually works. Unfortunately, it formats value into
```
    value
```
Which can actually decrease readability, especially if you have lots of short elements.
HTML Tidy - Official HTML/XHTML formattor endorsed by the World Wide Web Consortorium. However the XML it formatted refused to contain indents, even after enabling all indenting and formatting options. It formatted xyz into
```
xyz
```
This is not much good since indents are generally required in human readable XML.
PHP XML beautifier - Small PHP based XML beautifier. The only one that actually worked properly and formatted readable XML. Formatted xyz into
```
    
        xyz
    
```
Which is the expected result. For more consistency, you might want to change (in BeautyXML.class.php)
```
var $how_to_ident = "    "; // you can user also \t or more/less spaces
```
to
```
var $how_to_ident = "\t"; // you can user also \t or more/less spaces
```
to use tabs instead of spaces to save file space.

If you found this article helpful or interesting, please help Compdigitec spread the word. Don’t forget to subscribe to Compdigitec Labs for more interesting articles!

Disable WordPress conversion of double-dashes in posts

admin — Sat, 25 Jul 2009 00:50:14 +0000

Update (2012-02-03): Updated for WordPress 3.3.1.

Update (2011-08-21): Updated for WordPress 3.2.1.

Update (2009-08-16): Updated for WordPress 2.8.3.

If you use WordPress (like this blog and many hundreds and thousands of blogs) for your blogging engine and you attempt to post code or programming related posts, you may find that WordPress will mess up your code. This was pointed out to us by a commenter on the aforementioned page. Out of the side, the guide at Tech-Recepies will not work as the mentioned line of code no longer exists in WordPress.

This guide has been tested with WordPress 2.7.1, WordPress 2.8.3 and WordPress 3.3.1.

WordPress 3.3.1
Apply this diff to wp-includes/formatting.php like so:

patch formatting.php formatting.diff

Manual patching: replace lines 56 and 57 of “wp-includes/formatting.php” with these two lines:

		$static_characters = array_merge( array(/*'---', ' -- ', '--', ' - ', 'xn–',*/ '...', '``', '\'\'', ' (tm)'), $cockney );
		$static_replacements = array_merge( array(/*$em_dash, ' ' . $em_dash . ' ', $en_dash, ' ' . $en_dash . ' ', 'xn--',*/ '…', $opening_quote, $closing_quote, ' ™'), $cockneyreplace );

WordPress 3.2.1
You can apply this diff to wp-includes/formatting.php like so:

patch formatting.php formatting.diff

Or you can patch it manually with the following directions:

Download /wp-includes/formatting.php from your webserver (using something like FTP or SSH). Don’t navigate to the page and try to use “Save Page As”, it won’t work.
Open formatting.php with a text editor, preferably with the ability to navigate to specific lines (such as Geany, which also displays the line numbers beside each line).
Go to line 52/53 and find this:

$static_characters = array_merge(array('---', ' -- ', '--', ' - ', 'xn–', '...', '``', '\'\'', ' (tm)'), $cockney);
$static_replacements = array_merge(array('—', ' — ', '–', ' – ', 'xn--', '…', $opening_quote, $closing_quote, ' ™'), $cockneyreplace);

Replace it with this:

$static_characters = array_merge(array(/*'---', ' -- ', '--', ' - ', 'xn–',*/ '...', '``', '\'\'', ' (tm)'), $cockney);
$static_replacements = array_merge(array(/*'—', ' — ', '–', ' – ', 'xn--',*/ '…', $opening_quote, $closing_quote, ' ™'), $cockneyreplace);

Save and re-upload to web server.

Instructions (2.x)

Download /wp-includes/formatting.php from your webserver (using something like FTP or SSH). Don’t navigate to the page and try to use “Save Page As”, it won’t work.
Open formatting.php with a text editor, preferably with the ability to navigate to specific lines (such as Geany, which also displays the line numbers beside each line).
(2.7.1 only)
Navigate/browse to line 47/48 and find the following code:
$static_characters = array_merge(array(‘---’, ‘ -- ’, ‘--’, ‘xn–’,‘…’, ‘“’, ‘\’s’, ‘\’\”, ‘ (tm)’), $cockney);
$static_replacements = array_merge(array(‘—’, ‘ — ’, ‘–’, ‘xn--’,‘…’, ‘“’, ‘’s’, ‘”’, ‘ ™’), $cockneyreplace);
(2.8.3 only)
Browse to line 55/56 and find the following code:
$static_characters = array_merge(array('---', ' -- ', '--', ' - ', 'xn–', '...', '``', '\'s', '\'\'', ' (tm)'), $cockney); $static_replacements = array_merge(array('—', ' — ', '–', ' – ', 'xn--', '…', $opening_quote, '’s', $closing_quote, ' ™'), $cockneyreplace);
(end version specific instructions)
Once you have found the aforementioned lines of code, comment out the first four items in each array. In short, replace the above two lines with:
(2.7.1 only)
$static_characters = array_merge(array(/*’---’, ’ -- ’, ’--’, ’xn–’,*/‘…’, ‘“’, ‘\’s’, ‘\’\”, ‘ (tm)’), $cockney);
$static_replacements = array_merge(array(/*’—’, ’ — ’, ’–’, ’xn--’,*/‘…’, ‘“’, ‘’s’, ‘”’, ‘ ™’), $cockneyreplace);
（2.8.3 only）
$static_characters = array_merge(array(/*'---', ' -- ', '--', ' - ', 'xn–',*/ '...', '``', '\'s', '\'\'', ' (tm)'), $cockney); $static_replacements = array_merge(array(/*'—', ' — ', '–', ' – ', 'xn--',*/ '…', $opening_quote, '’s', $closing_quote, ' ™'), $cockneyreplace);
(end version specific instructions)
Save the file and re-upload to take effect.

Using (X)HTML entities in plain XML files

admin — Tue, 14 Jul 2009 21:15:30 +0000

Update (2009-07-28): Here is a place that you can find accents for English characters.

If you try to use non-ASCII characters (e.g. accents) in directly in a Windows-1252 (ISO-8859-1) encoded web page directly without converting/transforming them into an entity, the web browser may get confused when the header of the web page is sent wrong or is misunderstood, resulting in garbled accents and even possibly mojibake.

The correct way to embed those into a web page are to use the corresponding (X)HTML entities such as ê for the ê accent. But if you try to load a string from a XML file into a web page (as many PHP scripts do nowadays), you will encounter a nasty error informing you that the entity was not defined (e.g. parser error : Entity ‘eacute’ not defined). To remedy this, in the XML file instead of the direct entity replace the ampersand (&) in the entity with its entity version. This may sound confusing at first but after a while it starts to make sense.

XML file display = ê

HTML source display = ê

Browser display = ê

If you found this article helpful or useful, please help Compdigitec spread the word. Don’t forget to subscribe to Compdigitec Labs for more useful or interesting articles!

Removing WordPress post revisions feature

admin — Sat, 14 Mar 2009 03:03:14 +0000

WordPress 2.6 and above’s new feature of post revisions only slows WordPress down and makes it less usable. So here is how to disable post revisions:

Open wp-config.php in your wordpress installation directory with a text editor.
Add the line “define('WP_POST_REVISIONS', false);" anywhere in the file in a new line after the header.

Save it and upload it to your webserver, overwriting the previous file.

Simple Template Engine - your lightweight templating engine in PHP

admin — Tue, 03 Feb 2009 01:30:26 +0000

The Simple Template Engine is a very lightweight template engine to use in PHP if your webhost does not allow you to run something like Smarty. It is simple, lightweight and fast.

To parse a file:

assign(Array('content'=>"Hello World from Simple Template Engine!")); // If you want to display it directly $tpl->display('example.tpl'); // If you want to send it to another function/class for more processing some_function($tpl->parse('example.tpl')); ?>

example.tpl is:

{content}
{content}

If you found this article useful or helpful, please help Compdigitec spread the word. Don’t forget to subscribe to Compdigitec Labs for more useful and interesting articles!

Enabling and in MediaWiki

admin — Sun, 14 Sep 2008 14:06:36 +0000

If you have a MediaWiki installation and decide to make it Wikipedia-like, you will find that the tags and the tags don’t work like they do in Wikipedia. Below is a screenshot of the citation tags not working:

To fix this problem, you need to install the Cite extenstion for MediaWiki. Below is a step-by-step guide to installing the Cite extension:

Download the Cite extension - ZIP format, RAR format or 7zip format.

Extract it to a temporary location.

Upload the “Cite” folder to your extensions folder.

Edit LocalSettings.php and add:
require_once( $IP.'/extensions/Cite/Cite.php' );

after the line

require_once( "$IP/includes/DefaultSettings.php" );

Now refresh the page and try again!

If you found this article helpful, please help Compdigitec spread the word. Don’t forget to subscribe to Compdigitec Labs for more interesting articles!

SimpleXML - solution for XML manipulation in PHP

admin — Sun, 07 Sep 2008 20:33:53 +0000

If you ever do get the need to manipulate (read/write) XML, you could try using the PHP DOM API, but it’s very difficult to use the DOM. An good extension-less way to access and manipulate XML instead is SimpleXML. It’s very easy to use compared to DOM and features a easy way to access attributes and tags in any XML document.

XML file (sample.xml)

This is example number 1This is a tag.

Reading a XML file$a = new SimpleXMLElement(file_get_contents(“sample.xml”));
echo $a->example[0];
?>

The example above will read the sample XML file above and will output the contents of the first element.

Writing a XML file

$a = new SimpleXMLElement(‘’);
for($i = 1; $i <= 9; $i++) {
$a->addChild(“element$i”,”Hello”);
}
echo $a->asXML();
?>

The above example will create the following XML file:

HelloHelloHelloHelloHelloHelloHelloHelloHello

So as you can see, you can very easily manipulate XML with SimpleXML. Don’t forget to subscribe to Compdigitec Labs for more interesting articles!