Lately, the biggest company that suffer the most from IE 6 security breach is Google. Not only because of the recent attack in China, but also because the latest development of browsing technologies require all browsers to keep up with the standard. Obviously, IE 6 won’t make it anymore, however their predecessors can (IE 7+). That’s why they have decided to discard IE6 support to their apps beginning from Google Docs and Google Sites.

This is a big news to web designers around the world, because the biggest company in the internet history will definitely make a massive influence to all people in the world. Even though IE7 still has CSS bugs here and there, it doesn’t matter as much as IE 6. I hope that this sound reaches internet users in my country, since more than 50% of it still using IE6. The percentage is declining, but I hope this news accelerate it a little .

Here is the snapshot of the new NetSains.com:

I’m using my own Theme Framework for this new design. It consists of theme options, sidebars, integrated custom google search, and many more. It’s light, stable, and I can add my own plugin. After this theme, I am planning to upgrade my previously shared “Kayu dan Daun Template”. I hope more and more WordPress user will use this template in this year.

And finally, I’m ready to roll this year with some resolutions: Learn more, earn more, and have fun more than last year!

PS: I am also available for freelance work and now resuming my progress with my current clients.

Here is the picture of the beach in my hometown.

Senggigi Beach, Lombok Island

Best regards to everyone and have a nice Christmas, Gregorian Calendar’s New Year, and Islamic New Year!

“Asyik” is Indonesian terms for “fun”. My hope is that by learning CSS from this website people can learn with joy and fun with Indonesian language. And from this point forward, I hope that Indonesian website developers and designers can develop a website which is regarded as high quality and professional.

This website is enhanced with Forums, Custom Pages, Posts Meta Data, and Multi-threaded Comments. My favorite addition to this website is AJAX enhancements to call certain records from WordPress database. This method is implemented in its Author page, some Categories, and Periodic Table page as I mentioned before. This project takes me to the whole new level of jQuery implementation with AJAX. Finished since August 2008.

Netsains in 2010

This website implements various template tags and custom codes from WordPress in order to fulfill its purposes. User can register to the site or connect their Facebook profile via the web. Multi-threaded comment system has also being implemented after the huge WP 2.7 upgrades.

• Theme Options
• Twitter script
• Facebook Profile link
• Feedburner’s subscribe by Email
• Page Navigation
• Threaded Comments (WP 2.7++, you need to enable it first in your WP Options)
• PSD Files for Logo
• Nice and clean widgets (But it’s recommended that you keep my customized Widget )
• Hierarchical Page Navigation
• IE6 bulletproof without CSS3 stuff — you still on this browser? Upgrade!

About the Theme:
“Kayu dan Daun” means Wood and Leaf in Indonesian. It is used to redesign and promote one of my green-environmentalists sites. I used Sandbox theme as my framework because it has comprehensive css classes. When a theme is properly classified, it is more like a heaven to all designers

Screenshot

The first thing to learn is to create Custom Google Search account of your own. Maki from Doshdosh.com already created the tutorial on embedding Custom Google Search in his website. However, I have my own tricks on my sleeves to this. Let’s start with requirements.

To create Custom Google Search in Wordpress, you need:

1. A self hosted Wordpress blog (you can’t modify things in shared hosting wordpress.com blog)
2. A Google account (you can setup an account here)
3. Any HTML editor (wordpad or notepad is fine)

First step is to create Custom Google Search:

1. Login to Custom Google Search with your Google account from this link
2. 
   Choose “Create a Custom Search Engine”
3. 
   Fill in your search engine basic information
4. 
   Type your blog domain
5. 
   Test your search engine. If the results aren’t satisfying, you can always revert back to the fist step
6. 
   Choose as mentioned above. We need different page to host our results, that’s why we choose iframe.
7. 
   The first code is your SEARCH FORM code. The second code is your SEARCH RESULTS code. Now your custom search engine is ready

The second step is to install your code in Wordpress SEARCH FORM and SEARCH RESULTS:

1. Your Wordpress SEARCH FORM and SEARCH RESULTS can be found in your current template. This steps only occurs in your current template. If you want to edit the other template, please do repeat the steps
2. Your Wordpress SEARCH FORM is: yourblog/wp-content/themes/yourtemplate/searchform.php
   Your Wordpress SEARCH RESULTS is: yourblog/wp-content/themes/yourtemplate/search.php
3. Please do backup those two files before altering. In case that you want to revert back to the old search
4. Go to your SEARCH FORM, paste the code for Custom SEARCH FORM (First code), the result will be like this:
   

   Edited, thanks to Rio
   
<form action="http://yourblog.com/index.php?" id="cse-search-box">
<div>
<input type="hidden" name="cx" value="007584696391574650722:l_61re9sdqy" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="31" />
<input type="submit" name="sa" value="Search" />
<input type="hidden" name="s" value="Search" />
<input type="hidden" name="submit" value="" />
</div>
</form>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en"></script>


   The two bold lines of code are the compulsory codes to trigger Search Results in wordpress. The first line will define the keyword variable ($s) and the second line is the submission button ($submit). Those two lines won’t affect your custom search engine, however, you can’t erase it because Wordpress will not open the Search Result page without those two variables.

   This is the example URL that will trigger Wordpress Search Result: http://yourblog.com/index.php?s=keyword&submit=
   
   That’s why I can add any Google Custom Search variables as long as those two are unharmed

   If you are having trouble with the form layout, please do consult w3schools.com to learn about HTML and CSS

5. Now go to your Wordpress SEARCH RESULTS and replace the code into the following pattern:
   

   
<?php get_header(); ?>

   ---put your google search results here---

   <?php get_footer(); ?>


   The result will be like this:

   
<?php get_header(); ?>
<script type="text/javascript">
var googleSearchIframeName = "cse-search-results";
var googleSearchFormName = "cse-search-box";
var googleSearchFrameWidth = 600;
var googleSearchDomain = "www.google.com";
var googleSearchPath = "/cse";
</script>
<script type="text/javascript" src="http://www.google.com/afsonline/show_afs_search.js"></script>
<?php get_footer(); ?>


6. Your custom search engine is ready to go!

Custom Google Search Engine is very useful to your website. There are two reasons why you should use it:

• Comprehensive Google Search, you know how powerful Google search is, imagine it putted in your website. You might also want to install Google Sitemap generator plugins to widen your search results from Google
• Add money on it, yes, Google Search can be integrated with your Adsense channel. Check Doshdosh.com to learn how

Updated

Credit: Thanks to Rio for pointing out this issue

How to make your Google Search Terms appear in the page’s title

This issue is already explained clearly in Thu Tu’s Blog. The search terms will appear in your search page’s title in any theme you used. In order to make one of your theme to show the search terms, you can follow these steps:

• Open your chosen theme’s header.php file.
• Modify your theme’s title inside the <title> tag like this:
  

  <title>

<?php

  $cse_query = strip_tags(stripslashes($_GET['q']));
  if (is_home()) {
  echo bloginfo('name'); echo ": "; echo bloginfo('description');
  } elseif (is_404()) {
  echo 'Page Not Found (Error 404)';
  echo ' - ';
  echo bloginfo();
  } elseif (is_category()) {
  echo 'Category : '; wp_title('');
  echo ' - ';
  echo bloginfo();
  } elseif (is_search()) {
  echo 'Search for: "';
  echo $cse_query;
  echo '" - ';
  echo bloginfo();
  } elseif (is_day() || is_month() || is_year() ) {
  echo 'Archive :'; wp_title('');
  echo ' - ';
  echo bloginfo();
  } else {
  echo wp_title('');
  $subtitle = get_post_meta($post->ID, 'subtitle', $single = true);
  if($subtitle !== '') { echo ': ' . $subtitle; }
  }

  ?>

  </title>

• The first bold line will call your Google Search Terms (defined by variable $q), while the second bold line will call the variable and show it only in a search page (defined by is_search() wordpress function)
• Remember that any of your installed Wordpress plugin that can alter the Page Title (e.g. All in One SEO Pack) will make this method useless

The implementation of this method can be found in my latest site development: NetSains.com

Please have your comment and suggestion!

As I mentioned before, you can choose to take a picture from visible area or the whole website. From there, you can either Upload, Save, Email, Send to Clipboard (same as print screen), or Open in External Editor (MS Paint or Photoshop). And the most useful part is this: Edit.

FireShot also have their own Editing Windows. Saving a lot of times cropping, resizing, drawing or highlighting your snapshots without opening other image external editors. This is a good example for bloggers who wants to create tutorials from website snapshots. The result in Editing Windows can either saved in your computer or directly uploaded in FireShot’s image hosting.

The latest FireShot improvement is the ability to render FLASH animation (as you can see from my example above, the flash section in my website is captured perfectly). Before, it was only plain flash background without the captured animation.

From here you can download examples of website screen shots that I have found from my previous post.

• Download Screenshot – 1
• Download Screenshot – 2

You can find FireShot for FireFox in the FireFox addons page or click here.
Another additional information: This Plugin only applicable to Firefox in Windows…

From just one site I got this much of CSS Showcases:

• CSS Vault
• 
• CSS Beauty
• Screenfluent
• iSquare
• CSS Clip
• Web Galerie
• CSS Fill
• CSS Heaven
• CSS Thesis
• Piepmatzel
• Showcase GR
• Style Church
• Screenalicious
• CSS Elite
• Zen Garden
• Stylegala
• CSS Remix
• CSS Reboot
• CSS Tux
• CSS Mania
• CSS Import
• CSS Drive
• Unmatched Style
• CSS Bloom
• CSS Galleries
• Style The Web
• The Daily Slurp
• CSS Gallery.ro
• W3C Sites
• Standards Reboot
• Liquid Designs
• CSS Smooth Operator
• CSS Princess
• CSS Hazard
• CSS Galaxy
• CeeSes
• CSS Collection
• CSS Green
• CSS Container
• WebDigity
• Creative Pakistan
• CSS Design Yorkshire

I have subscribed each of the site’s RSS in my Firefox’s NewsFox plugins. As a result, everyday there are at least 15 new and well-designed websites to be snapped and stored as future references and inspirations. Now I must spent all the weekend to read, organize, as well as to store all those snapshots and articles.

Undergoing MyBlogLog Verification