Melopia Rss Feed

Web hosting with Lunarpages came with Fantastico, which includes the latest WordPress out of box. It went well until I tried to compose entries in Chinese today, which turned into question marks. Obviously an encoding glich was there to prevent WordPress from saving UTF-8 chars even if I had set WP’s encoding into UTF-8. After performing checks for a little bit, I found that the Latin encoding would persist even if you try to alter the default encoding of the datatables after installation. Therefore, I had to open PhpMyAdmin and correct the “COLLATE” of EACH FIELD manually back to “utf8-general-ci”. The ‘DB_COLLATE’ variable was set to the same value in wp-config.

The following SQL expressions will alter the DEFAULT COLLATE of all the tables in my database, but not the existing collate for each field.

ALTER TABLE `lg_comments2image` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_comments` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_links` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_options` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_postmeta` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_posts` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_silas_flickr_cache` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_terms` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_term_relationships` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_term_taxonomy` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_usermeta` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ; ALTER TABLE `wp_users` DEFAULT CHARACTER SET utf8 COLLATE utf8_general_ci ;

Done.

Technorati Tags: Add new tag, Chinese, Fantastico, Unicode, Web, WordPress

Don’t know why the automatic update of McAfee VirusScan can’t work in LAN, so I wrote this small hta to automatically unzip the virus definition pack and copy them to the VirusScan folder, then change the registry a bit to let VirusScan use the updated definition.

Anyway, it has not been carefully tested, so, think of it as an experiment. Note that during update, VirusScan will be stopped, and it’ll be started after updating.

How to use:

• Download the definition file avvdat-####.zip, where #### is replaced by a 4-digit number, indicating the version.
• Copy this file to the same folder that holds the update program.
• Run the exe, it will automatically compare the currently installed definition version and the new update pack. If it’s a newer pack, the program will let you install.

McAfee VirusScan AVVDat Manual Update Tool

Technorati Tags: Hta, Mcafee, Program, Virus

I know that this changing layout technique has been dealt for many times by others, and I’m not the last one to deal with it.

I tend to make things flexible, not just a web design, but also real-life stuffs (so don’t fix a time with me, lol). OK, to make a layout flexible, it means to make everything inside it as flexible as possible. I have to decide what parts of the site is extensible while what’s not. The header and content area should expand according to user’s screen width, and in this case, I’ll leave the sidebar to its fixed size.

The things follows are regular:

Design the layout in any graphic apps you like( I use Macromedia Fireworks)

Keep in mind that what parts I was going to make flexible, so that I don’t put complicated graphic or effect to the extensible areas.

Prepare graphics

Export from the graphic design program, and ajust them as needed.

Decide the markup

Some people may want to put this first

Write style sheet as if you’re making a flexible style

Make the whole layout flexible first, then it’ll be easier to fix it later if needed.

After the flexible layout is done, I need to wrap an extra div around the whole markup, so that the alternation of width will be a step away. The purpose of adding this layer is to make it the “canvas” of the page, to do so, just set its position to relative, so that absolute positioned elements won’t lose their way.

<div id=”main_wrap”>All other things, including some absolutely positioned stuffs…</div>

/*Layout: Spixizos*/ #main_wrap { width:820px; /*Used in fixed width*/ margin:0 auto 0 auto; /*Center the layout*/ position:relative; }

There, we got a flexible layout, but it’s now fixed, I’ll add a script to allow it to change width:

function fnToggleLayout(nLayout) { var oCnt = document.getElementById(“main_wrap”); //The div which act as the “canvas” if (!oCnt) return; var nCurrLayout = parseInt(getCookie(“layout”)); // What’s the current layout? if (nCurrLayout == nLayout) return; // If the layout is in use, simply do nothing. if (nLayout == -1) { // fluid layout: if (window.external) {//In IE, there’re some problem when switching between fluid and fix layout, so prompt the user to reload. if (confirm(“You need to reload this page to use the fluid layout.\n\nReload now?”)) location.reload(); newCookie(“layout” , nLayout); // Save Cookie; return; } //Else, change the layout to fluid right now: oCnt.style.margin = “0 10px 0 10px”; // The margin oCnt.style.width = “auto”; // The fluid width newCookie(“layout” , nLayout); // Save Cookie; } if (nLayout == 1) { // narrow layout: oCnt.style.margin = “0 auto 0 auto”; // Set left and right margin to auto oCnt.style.width = “820px”; // Fix the width newCookie(“layout” , nLayout); // Save Cookie; } if (nLayout == 2) { // bigger layout: oCnt.style.margin = “0 auto 0 auto”; // Set left and right margin to auto oCnt.style.width = “1000px”; //Fix the width newCookie(“layout” , nLayout); // Save Cookie; } } function fnLoadSavedLayout() { var nLayout = parseInt(getCookie(“layout”)); // Find previous saved layout setting if (isNaN(nLayout)) return; // If not found, do nothing var sHtm = “<style>”; // Prepare the style append to the document’s head sHtm += “#main_wrap{“; if (nLayout == -1) { // fluid layout: sHtm += “margin:0 10px 0 10px;”; sHtm += “width:auto;”; } if (nLayout == 1) { // narrow layout: sHtm += “margin:0 auto 0 auto;”; sHtm += “width:820px;”; } if (nLayout == 2) { // bigger layout: sHtm += “margin:0 auto 0 auto;”; sHtm += “width:1000px;”; } sHtm += “}</style>”; document.write(sHtm); // Directly write to the document flow. See explanations below } fnLoadSavedLayout(); // Begin load layout.

The first function fnToggleLayout(nLayout) is called on-demand by the user, when called, it changes the width directly by setting the style properties of the wrapper. The second function fnLoadSavedLayout() is automatically called when page loads. It writes html code to the document directly. You may ask why not re-use the first function in the window.onload handler. That’s because there’s a delay between the layout changing take place, and it’s annoying to see this effect every time you load a page.

There’re another two functions that I don’t list, the getCookie and newCookie, since they’re not the main points and could be found on the internet easily.

Some problems

However there’re some problems currently. As you may notice, I use the sIFR method to replace heading text. When switching from a wider layout to a narrower layout, the width of headding is not recaculated. But I think this could be easily fixed by re-calling the corresponding sIFR function.

Technorati Tags: css, javascript, layout, Scripting, Web, Web Design