How to Delete Blog on WordPress

My first post on WordPress. Ah, the irony. It was kind of difficult to find the “Delete Site” button when I tried to delete my blog. And the searches on Google returned tutorials that were outdated so I thought I’d just write down how. Here’s how:

1. Go to Dashboard>Tools>Delete Site

2. Confirm deletion

3. Verify deletion via email

Check your address bar and make sure it’s the blog name that you want to delete before you proceed into deletion. If you’re not, just go into dashboard first and change your blog name manually from your address bar.

Client Server Complication

Once upon a time, there was computer. Everyone of them was standalone with no connection with another. Then came the internet which was given out by ARPANET (Advanced Research Projects Agency Network) back in the 1960s.

And with internet, client server was made possible.

And with client server, came my problem.

This is my first every client server java coding:

   1: import javax.swing.*;

   2: import java.awt.*;

   3: import java.io.*;

   4: import javax.swing.border.*;

   5: import java.net.*;

   6: import java.awt.event.*;

   7:  

   8: class Server extends JFrame implements ActionListener

   9: {

  10:     private JTextArea jtaSend=new JTextArea();

  11:     private JTextArea jtaReceive=new JTextArea();

  12:     private JButton jbtSend=new JButton("Send");

  13:     

  14:     DataOutputStream output;

  15:     DataInputStream input;

  16:     

  17:     public Server()

  18:     {

  19:         jbtSend.addActionListener(this);

  20:     

  21:         try

  22:         {

  23:             ServerSocket server=new ServerSocket(8000);

  24:             Socket socket=server.accept();//wait connection from a client

  25:             System.out.println("connected to a client");

  26:         

  27:             output=new DataOutputStream(socket.getOutputStream());

  28:             input=new DataInputStream(socket.getInputStream());

  29:         

  30:             getContentPane().setLayout(new GridLayout(2,1));

  31:             JScrollPane scp=new JScrollPane(jtaSend);

  32:             scp.setBorder(new TitledBorder("Type your message here"));

  33:         

  34:             JPanel panel=new JPanel();

  35:             panel.setLayout(new BorderLayout());

  36:             panel.add(scp,BorderLayout.CENTER);

  37:             panel.add(jbtSend,BorderLayout.SOUTH);

  38:             getContentPane().add(panel);    

  39:         

  40:             getContentPane().add(new JScrollPane(jtaReceive));

  41:             setTitle("Server");

  42:             setSize(300,300);

  43:         

  44:             setLocation(20,30);

  45:             setVisible(true);

  46:         

  47:             while(true)

  48:             {

  49:                 jtaReceive.setText(input.readUTF());

  50:             }

  51:         }

  52:         catch(IOException ex)

  53:         {

  54:             ex.printStackTrace();

  55:         }

  56:     }

  57:  

  58:     public static void main(String[]args)

  59:     {

  60:         JFrame frame=new Server();

  61:     }

  62:  

  63:     public void actionPerformed(ActionEvent e)

  64:     {

  65:         try

  66:         {

  67:             output.writeUTF(jtaSend.getText());

  68:         }

  69:         catch(Exception ex)

  70:         {

  71:         }

  72:     }

  73: }

Cool huh? It’s supposed to take in messages from the user and send it to the other, kinda like MSN but too bad there’s no output, it compiled successfully but there’s no output. Solution? This thing cracks my head.

Fix for Sidebar Problem Night Sky 2.0 Blogger Template by Ray Creations

No doubt the Night Sky 2.0 Blogger template by Ray Creations is one of the best templates I’ve ever seen. There are other templates by Ray Creations which are as good too. You can check out more of its works here.

However, there is a bug in the template. I find the end of my right sidebar cuts off and goes to the far left side of the screen in posts page (not main page) whenever I add widgets on the sidebar to the extent that the sidebar’s height exceeds that of the post’s.

I figured this is because the sidebar-bottom is made to float:left; margin-left:20px. So, whenever there is no post on its left for the sidebar to “hold on to”, the sidebar will eventually floats itself to the most left that it can find with 20px margin from the left.

Here is the original extract from the template:

 1: #sidebar-bottom {
 2:   width: 240px;
 3:   height:40px;
 4:   padding-right: 0px;
 5:   background: url(http://lh5.ggpht.com/_qYQcA5cg1OY/SsMdZU-8OAI/AAAAAAAAAG8/fRV84_un7sQ/rightsidePanelbottom.jpg) no-repeat right bottom;
 6:   float: left;
 7:   margin-left:20px;
 8:   overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */

.csharpcode, .csharpcode pre{font-size: small;color: black;font-family: consolas, “Courier New”, courier, monospace;background-color: #ffffff;/*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt {background-color: #f4f4f4;width: 100%;margin: 0em;}.csharpcode .lnum { color: #606060; }
To fix this:

  1. Go to Design >> Edit HTML.
  2. Remember to always backup your template first before you do any changes in your HTML.
  3. Search for “sidebar-bottom” using your browser’s search function and you should see codes resembling the above extract.
  4. Change line 6: float: left; to float: right;
  5. Change line 7: margin-left:20px; to margin-right:11px;
  6. It should look like this:
     1: #sidebar-bottom {
     2:   width: 240px;
     3:   height:40px;
     4:   padding-right: 0px;
     5:   background: url(http://lh5.ggpht.com/_qYQcA5cg1OY/SsMdZU-8OAI/AAAAAAAAAG8/fRV84_un7sQ/rightsidePanelbottom.jpg) no-repeat right bottom;
     6:   float: right;
     7:   margin-right:11px;
     8:   overflow: hidden;      /* fix for long non-text content breaking IE sidebar float */
  7. Click on Save Template and you’re done.

Note:I’m no HTML expert whatsoever. I did this fix by experimenting the template in Adobe Dreamweaver and by changing the codes one by one, retrying, re-fixing and refreshing the pages over and over again. It’s hard work. Try this fix at your own risk. I shall not be hold responsible for any damages caused in your blog for using this fix. Like what I said, I’m no HTML expert so there may be other solutions to this but this is the only one that I found that works. If you are going to post this somewhere please inform, credit me and post a direct link to this page.

How to Add Tweetmeme Retweet Button with Counter to Blogger

tweetmeme_source = 'waikitkit';tweetmeme_url = '';

Today I’m gonna teach you how to add a Tweetmeme retweet button with counter to blogger. There are actually other retweet counter services such as Backtype and Topsy but I prefer Tweetmeme cuz it’s the most popular around and I like its color and looks.

Here’s how:

  1. First thing’s first, before you make any customizations with your HTML, Save a Template of it first.
  2. Then, tick on the box to Expand Widget Templates.
  3. Replace [TwitterUserName] with your Twitter username and copy this code.
       1:  <!-- TWITTER RETWEET BUTTON START -->
       2:  <script type='text/javascript'>
       3:  tweetmeme_source = '[TwitterUserName]';
       4:  tweetmeme_url = '<data:post.url/>';
       5:  </script>
       6:  <script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/>
       7:  <!-- TWITTER RETWEET BUTTON END -->

    .csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, “Courier New”, courier, monospace; background-color: #ffffff; /*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }

  4. Search for this code:
       1:  <data:post.body/>

    .csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, “Courier New”, courier, monospace; background-color: #ffffff; /*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }

  5. Paste it before this if you want the button to be above your post and after it if you want it well, after it. Basically the code represents the body of the post.
And, you’re done!
Happy tweeting!

Fake Eggs Made by China

Got this in an e-mail my friend sent me. Thought it’s really interesting so decided to share this out so that you would benefit something from this.

Now, we know that China is really capable of copying anything. I should say mobile phone is among the most popular. We see China phones everywhere, mainly by the streets, selling them at few folds cheaper than the original models. And there’s also iPhone. Whoa, cool. but not enough. This even more shocking.

They make eggs. Yes, chicken eggs. But not like feed chickens, chickens lay eggs-kind-of-make. They manufacture eggs from various chemicals. They can even copy eggs? That’s really something. Read on. These are directly translated from Chinese. Rewrote them into understandable English to the extent of my understanding.

Continue reading

Picmarkr Adding Watermark to Your Photos Online

For those of you who’s not really into using Adobe Photoshop to add watermark to your photos or is just simply too lazy to use one, here’s one of the simplest way to do the job.

PicMarkr
PicMarkr lets you to add custom watermark (image or text) to your images online and free. It is useful when you need to protect your copyrights or if you want to add comments
to your photos

Just follow the 3 simple steps in the website.

Step 1: Upload your photos. You can choose whether to upload it from your local computer or grab from Flickr, Facebook or Picasa.
Step 2: Customize the watermark. You can choose from the different alignments, write the text to display and its presets.
Step 3: Well, you’re almost done. Just download the photos to your computer or upload them.

Pretty convenient, eh?

How to Add Digg Sharing Button with Counter to Blogger

Among some of the interesting things that I’ve found out upon blogging is the sharing widget. A sharing widget is a widget in the form of a button that can let you share a specific post in your blog at ease. It makes the sharing process easier by just clicking on the button. Today I’m gonna share with you on how to add a Digg share button with counter on your blogger.

Here’s how:

  1. First of all, as a rule of thumb, before you make any customizations with your HTML, Save a Template of it first.
  2. Then, tick on the box to Expand Widget Templates.
  3. Copy this code. and paste it in your HTML.
       1:  <!-- DIGG BUTTON START -->
       2:  <script type='text/javascript'>
       3:  digg_url = '<data:post.url/>';
       4:  </script>
       5:  <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
       6:  <!-- DIGG BUTTON END -->

    .csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, “Courier New”, courier, monospace; background-color: #ffffff; /*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }

  4. Search for this code:
       1:  <data:post.body/>

    .csharpcode, .csharpcode pre{ font-size: small; color: black; font-family: consolas, “Courier New”, courier, monospace; background-color: #ffffff; /*white-space: pre;*/}.csharpcode pre { margin: 0em; }.csharpcode .rem { color: #008000; }.csharpcode .kwrd { color: #0000ff; }.csharpcode .str { color: #006080; }.csharpcode .op { color: #0000c0; }.csharpcode .preproc { color: #cc6633; }.csharpcode .asp { background-color: #ffff00; }.csharpcode .html { color: #800000; }.csharpcode .attr { color: #ff0000; }.csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em;}.csharpcode .lnum { color: #606060; }

  5. Paste it before this if you want the button to be above your post and after it if you want it well, after it. Basically the code represents the body of the post.

    And, you’re done!
    Happy digg-ing!

How to Add Twitter Updates Widget to Your Website

This is actually a repost of what I have posted. For some reason, while using the blogger’s new editing style, my post’s body was gone, only the title was there. Well, anyway, I started to blog 2 years ago, 2 long years. Back then, I rarely posted. Started to blog again few days ago and I found this nice little twitter widget which will display your status updates on your website. It’s kind of neat.

Here’s how:

  1. Go here.
  1. Type in your username and click on Test settings if its the right one.
  2. Customize the looks and its settings in the tabs on your left.
  3. You can always test its settings after each customization to see how its like.
  4. Click on Finish & Grab Code once you’ve finished.
  5. Copy and paste the code to your website’s HTML.
  6. For blogspot, there is actually a button for you to click on which will automatically help you add the widget to your blog.
And you’re done!

Cheers.

Zoom Facebook Photos by Mouseover

Facebook. Almost every living creature on this planet has one. It has become so popular nowadays that it has started to become like an international identity card. I gotta say I love Facebook for the many applications and the user-friendly interface. However, viewing the images is horrendously troublesome and time-consuming. I don’t like the repeating process of having need to click in to people’s profile, then photos section, then album, then pictures, bla bla bla just to get its original photo. And those thumbnails on Facebook wall are so tiny that I had to squint. What I’m trying to say is, it’s bad. Why can’t it just pops up in its original form when I mouseover it? Now, THAT is convenience.
Luckily, I found this nifty little extension for Google Chrome or add-on for Firefox that does the work for me. It actually originated from Google Chrome but someone converted it to the Firefox platform.