Reference Plugin for WordPress
Add references from posts, urls, and books into your post. Featured Google Books Search, Book Preview and Amazon Affiliate link.
Download Reference WordPress Plugin
thought snippets
a little bit of everything
How to be good at what you do
My though into chart.
Created with HTML and CSS.
Click to see chart in HTML
Metric time and Analog clock with CSS3&Javascript
Analog clock to display metric time* using CSS3 Transform and a little bit of Javascript.
(Support Chrome, Firefox, Safari)
Visual Sitemap with HTML+CSS3
For those who create and using website must be familiar with sitemap page. Usually sitemap gather all links in the site and display them structurally for ease of use. For me, sitemap is always the last to create because it’s a boring task and sometimes not even in user requirement. And when I actually get around to do it, I always use unordered list because it makes most sense but the result isn’t always pretty.
So here I am with free times in my hands, creating css3 based visual sitemap. I’m using css3 because to make tree structure in sitemap I have to use css3 pseudo-class selector. But again with new web technology, we have a problem with our beloved browser, ie, so I’ll use a little js hack for ie only. Here’s the result.
I try to use as few images as possible but one thing I hate most is javascript hack. But you don’t have to use the hack if you’re ok with slightly distort in ie. Now let’s look at the code.
Visible stat from Google Analytics
From my old blog Extract data from google analytic with PHP makes me wanna write another script to show number of pageviews on the web for all the world to see. It’s actually an old school “web counter” as we know it and since normally you can’t just extract pageviews data from google analytics to display on your website I have to make use of my old GAAPI class to extract data to create the counter, see example below.
GA Visible Stat
Extract data from google analytic with PHP
My PHP class to extract data from Google Analytics API to show on your own website.
Using:
- PHP
- cURL to connect to Google Analytics Data Extract API
- PHP DOMDocument to parse XML
- Google Graph API to show analytic data
Screenshot:
Google Analytic Data Export API with PHP
from table to div
An easy way to change your html layout from table to css/div for those who still using “old school html table layout”
First, let’s look at the table:
Table Layout
HTML code
| This is Header | |
| Main Menu-Menu1 | Content goes here!This is content! |
Looks simple and familiar enough, but is it the best? How about we change it into css/div layout.
ie6.png !
.png files format is essential in today’s website builder mainly because its give us a real transparency which is far better than .gif
Arise our problem. IE 6. Same old pal who loves to give us headache developing website but we can’t just forget it because number of ie6 users is still significant, at least for my sites.
The problem with ie6 this time is that it cannot display .png transparency properly. For those who don’t know about this problem please see example below.
Original PNG File
IE7
IE6 !!!
As we can see, ie6 image transparency is not really transplant.