Geekdom

Do more – Write less

Posted in Geekdom, Web Development on November 21st, 2011 by Jarred – Comments Off on Do more – Write less

Something occurred to me today that is likely quite obvious to seasoned professionals but I really never gave it much thought. Over the past few years I have started numerous website projects. They usually are a significant undertaking and require lots of time to complete(seems like I rarely finish them). The thing I realized is that on each one I always start from scratch. When I have an idea to make a website I will create a brand new text document and start from building from there. I never save a template or code snippets to reuse. I have to reinvent the wheel every time and it is taking me a lot of time.

My Idea is that I need to start reusing some of my code and writing/developing it in such a way that my work can be useful for other projects. I think it may take a bit more effort initially to do this, however in the long run it could save me countless hours. I am positive that as soon as my current project is completed (hopefully I will finish it someday)I will just come up with yet another one to start. If I already have some of the building blocks ready to go this greatly increase the odds of me finishing and decrease the amount of time it will take. In the end I hope this will enhance my ability to monetize my various online efforts. I think the best place to archive some of these snippets is right here on my blog. I am almost positive that closely follows this blog yet, but if there is or when you do come (hopefully) you can expect to see some of my templates and code snippets coming. Best of all is I intend to release them all free to use for any reason.

Remove Extra Line after Smiley Faces in WordPress

Posted in Geekdom, Web Development on September 24th, 2011 by Jarred – Comments Off on Remove Extra Line after Smiley Faces in WordPress

So I noticed in one of the wordpress blogs I am working on that while the emoticon (smiley faces) I was using were properly being converted into images, they all had an extra line spacing after all of them. Needless to say this was quite annoying and screwed up the paragraphs in my posts. Getting rid of the extra spacing around the smiles was quite easy once I knew the correct search terms (display emoticon inline). After a bit of digging and fooling around with the styles in chromes Developer Tools I figured out my smiles were inheriting the “display: block” from another class. To solve the problem I included the following line into the style sheets and all the extra spacing was removed.

img.wp-smiley {display: inline;}

Source: http://lorelle.wordpress.com/2007/09/30/the-art-of-smilies-in-wordpress-blogs/

PR from 2 to 0 (box grayed out)

Posted in Geekdom, Web Development on September 20th, 2011 by Jarred – Comments Off on PR from 2 to 0 (box grayed out)

So, I used my old domain names (Infobrink.com) for this blog in hopes that the then existing PR (2) and back-links would help jump-start my blog and put me on the fast track for monetization.  However I am beginning to wonder it that was the best move as google has taken away my PR.  Looks like I should have just used a new domain name.  Seems like google is able to detect when a new site is put up over an old one and voids out all the current rankings (which is quite understandable).

The google toolbar (Which used to say 2) now only shows a 0 Page Rank (grayed out “current page is not ranked by google”). Bummer!!! I am not quite sure what this means, or when it started.  I did switch the preferred domain to the non www version in the google webmaster tools which may have something to do with it…

Guess I will just wait and see what happens during the next PR update.

How to share a internet connection for 3G and 4G with a single wireless USB broadband modem

Posted in Geekdom on September 19th, 2011 by Jarred – Comments Off on How to share a internet connection for 3G and 4G with a single wireless USB broadband modem

I am out on a road trip right now and occasionally use a USB mobile broadband modem to connect to the internet (CLEAR 4G+ Mobile USB Series S). Thing is, my wife is traveling with me and wants internet on her laptop as well. I was too cheap to buy one of the mobile hot spot devices and I also wanted flexibility to use 3G internet when 4G was not available (which is most of the time out on the road).

Turns out windows makes it is incredibly easy to share a single connection from a USB mobile internet devices (no router required). The following instructions are for windows Vista, I assume this will be similar in other versions of windows as well. First you need to do is set up a “ad hoc” network. You can do this by clicking on the start button > “connect to” then select “Set up a wireless ad hoc (computer-to-computer) network and follow the wizard.

When I was trying to share the connection while using 4G at the end of the wizard there was an option to enable “Internet Connection Sharing” after selecting this we were able to connect to with the other laptop to the newly created wireless network and surf the web… no problems.

However, when trying to connect with the 3G there was no option to enable internet connection sharing at the end of the wizard (like there was for the 4G) and it was a bit more involed to get the connection sharing to work. (Looks like this may be due to the fact that the 3G is considered a dial up connection??). This is how I did it. First create the ad hoc network as described above using the wizard, then after the network is created go to Start > Connect To > Open Network sharing center > Manage network Connections. From here you have to do two things.

Enable sharing for the connection you would like to share (for me it shows up as 3G under Dial-up). To do this right click > properties > Sharing Tab > Allow others network users to connect through this computer’s internet connection. (Also, you may have to select the individual services you would like to share – I selected them all)

Change the IP address for the ad hoc connection you just created. To do this right click the ad hoc connection in “Manage network Connections” and select properties. Next select the “Internet Protocol Version 4 (TCP/IPv4)” and click the properties button. Select the “use the following IP address” and set the IP address and Subnet mast to the following and hit ok(After changing this you may need to restart the 3G connection).

IP address: 192.168.0.1

Subnet mask: 255.255.255.0

Now just connect to the ad hoc network from your other laptop and and voila… you have shared your 3G connection and should be able to browse the web (albeit very slowly).

When you want to re-connect to a normal WiFi connection you may have to go back to manage network connections right click > properties on the network you are trying to connect to and change the “Internet Protocol Version 4 (TCP/IPv4)” connection property back to ‘Obtain IP address automatically’

Hope this helps

Sources: http://unlockforus.blogspot.com/2008/10/vistaxp-how-to-share-internet.html

NextGen Gallery & NextGen GalleryView Plugin Problems

Posted in Geekdom, Web Development on September 1st, 2011 by Jarred – 2 Comments

I have been working on another blog that I intend to include a lot of pictures in. The default wordpress gallery was not meeting my needs so I decided to try some free gallery plugins to see if I could get any of those to work for me. The NextGen Gallery plug-in seemed to fit the bill, and then after a bit more digging I found a plug-in extension called the NextGen GalleryView (yeah I know names are very similar) which did exactly what I wanted.

 After installing and uploading a gallery and adding “[galleryview id=1]” it to one of my posts, the filmstrip / carousel at the bottom of the gallery (the single feature that I was most interested in) was not working properly. The thumbnail images showed up on two different lines which messed up the whole filmstrip. Also, there was a strange black box in between each one of the thumbnails.

 In the dashboard under the NextGen GalleryView options when I would view the example / preview it appeared the whole thing was working just fine. However when I paste in the short code and try to view the blog post itself the filmstrip would be all messed up. I am not a word press expert, but I am assuming that if the gallery preview is working in the dashboard but not your posts, then it is likely a theme conflict you are dealing with.

 To me it seemed like the spacing between each image was off and a HTML bullet was being added into the list between each picture. I troubleshooted (is that a word?) the problem in the Chrome developer tools by disabling the different styles one by one to help me narrow down what was causing the problem. I tried to disable anything that had to do with spacing, margins, padding etc until the filmstrip looked like it should. I eventually found that my chosen theme (Adventure Journal Theme) was adding a margin-left to everything as well as adding a stylized bullet to all the list items on the page.

To solve the spacing problem and get all the thumbnail images on to the same line I set margin to 0px in the “frame” class which is found at about line 63 in wordpress-nextgen-galleryview/GalleryView/css/galleryview.css file

/* FILMSTRIP FRAMES (contains both images and captions) */

.frame {}

to

/* FILMSTRIP FRAMES (contains both images and captions) */

.frame {margin:0px}

To get rid of the square bullet that was being inserted between each thumbnails I had to edit the style sheet for the theme. For my theme it was located at wp-content/themes/adventure-journal/style.css. I changed

ul li{

list-style:square;

}

to

ul li{

list-style:none;

}

And viola…I now have a working image gallery with an awesome filmstrip at the bottom.  I imagine using this plugin with other themes you might have similar problems which can be solved in similar ways.

Free Animated explosion on transparent background

Posted in Geekdom, Programing on July 5th, 2011 by Jarred – 1 Comment

While creating my first game I came across the need for some sprite sized explosion animations. I tried multiple times to draw them myself, however I just couldn’t get them to look right. So I turned to the web to see if I could find some royalty free explosion animations that I could use in my game. After a little searching I found several suitable sprite sheets like the one below on http://www.positech.co.uk/content/explosion/explosiongenerator.html (The website also features a free explosion generator program to make more).

The animation however was on a sprite sheet that had a solid background and I needed a transparent background. So, I took the time to cut them out using an alpha layer and then saved them to individual files. I have upload the cutout files as I figure it is likely others might find them useful. The below file includes a photoshop file with all the different frames of the explosion on different layers as well as all of the frames of the explosion separated into individual .png files with transparent backgrounds. These images are royalty free so please feel free to use them any way you like.

Download animation with transparent background

UPDATE: Couple more free animated explosions can be found here

explosion_animation_sheet

Strange Indexing by Google

Posted in All, Geekdom on June 5th, 2011 by Jarred – Comments Off on Strange Indexing by Google

I know that it usually takes weeks/months to build traffic to a site but I put the blog on a old domain that still had a pagerank of 2. I am hoping by doing this it might help my rankings faster. The blog has been up for a little over a week now I figured that it is possible it might have seen some visits. Checking this was a simple matter as I had installed Google analytics the day I put up the blog to help track traffic (which I highly recommend to anyone). To my disappointment it doesn’t look like any real traffic besides me has been visiting the site (There were a handful of direct referrals from sites who linked to my old site, but I don’t consider these significant as the visitors were probably looking for something else).

 

So, if I have not yet received any traffic the site has probably not been re-indexed. To check this I did a quick search for “infobrink” on Google and I noticed something very strange. The first search engine result was the old version of my homepage (which was expected if the site had not yet been re-indexed), but right below it was one of my newer blog sub-pages that I had recently created. To me this seems awfully strange cause the only way Google could know about that sub page would be via crawling my homepage (I am fairly confident nobody has linked to my new subpages yet). If google was crawling my homepage and updated the index with my subpages why not update the index with the new homepage also? Hum..very strange…

WordPress Page IDs

Posted in All, Geekdom on May 30th, 2011 by Jarred – Comments Off on WordPress Page IDs

Using the wordpress “page” widget for the side bar works wonderfully for displaying a list of static pages on your blog.  However by default it displays all of your pages and you may not want this. Luckily the widget comes with the ability to excluded pages.  Less lucky is that in order to exclude the pages you need to know the “page ID”.  As far as I can tell the “page ID” is not displayed anywhere and requires a bit of digging to find.   After logging into the admin dashboard area select the “pages” link.  From there you will be given a list of all the current pages you have created.  An easy way to find the “page ID” is to mouse over (hover not click) the page in question.  If you look at your browser status bar you will notice a link in which you will see “post=” some number.  This post number is the page ID.

For example – If your status bar displayed this:

http://yourpage.com/wp-admin/post.php?post=57&action=edit

 

Your page ID would be 57

 

Source: http://www.techtrot.com/wordpress-page-id/

WordPress captcha problems

Posted in All, Geekdom on May 27th, 2011 by Jarred – 1 Comment

On the web one of the most useful tools to combat spam and reduce abuse is a captcha. For this blog I felt that a captcha system was a “must have” as I intend on letting users input comments. I found a free wordpress captcha plug-in made by bestwebsoft (http://wordpress.org/extend/plugins/captcha/)that looked very promising. However to my dismay after installing and activating the captcha plugin, the system did not work. I tried installing other captcha plugins, but they all required API keys and this was unacceptable to me. So I decided to try and get the bestwebsoft plugin to work.

I could tell that the captcha system was activated because it would give me an error if I tried to submit a comment, however the catcha form itself was not showing up in the comments section. To trouble shoot I reactivated the default theme that came with wordpress and the captcha form worked perfectly, so I knew it was a theme issue. It appears that whoever designed the theme I am using didn’t use the default wordpress “comments form” and was manually creating the form from scratch. In order to get the form to show up all I needed to do was include the following line of code in themes comments.php file where I wanted the form to show up.

<?php echo cptch_comment_form();?>

The next problem was that a mysterious “1” was being generated after the captcha form. To solve this problem I had to edit the function “cptch_comment_form()” in the captcha.php plugin file to not return anything. (i.e. from “return true;” to just “return;”). To be truthful I am not entirely certain what all the implications of doing this will be, but the captcha system appears to be working fine.

I imagine other wordpress themes will also be designed this way and will require a similar work-around to get the captcha plugin working.

 

****UPDATE
It appears this problem has been fixed in the most recent version, so if you are still having this issue try updating the plugin

Customizing WordPress Headers

Posted in All, Geekdom on May 27th, 2011 by Jarred – Comments Off on Customizing WordPress Headers

Word press is simply amazing…I’m constantly amazed by the quality of open source software, but that is another topic for another day

As I was setting up my installation for this blog I wanted to customize the header image and style.  I turns out this tasked proved to be a bit more tricky than I had first imagined.  I spent more time then I care to admit trying to edit the header div and image using the appearance editor tool in the admin area.  What took me so long to figure out was that there are multiple css files and the properties I was trying to change were in a different css file altogether.  Even more tricky was that this file was not available in the appearance editor tool.  I found it  in the  “wp-content/themes/” folder.

Now I know that this may be a no-brainer for some, but for me it was a bit tricky because it was not what I was expecting. Here is a trick I learned that might make this easier in the future to help identify the location of the correct css file. In many modern web-browsers you can right click and choose to inspect the element.  This will give you a run down of all the css properties that are currently being applied to that element along with the name/location of the css file (In Chrome you have to mouse over the file name to get the location).

So, if you want the customize the header for your word-press blog just right click on the header somewhere and select “inspect element”.  From here it is simple to figure out the location of the files with the properties you want changed.  After that use your favorite FTP program to download the file and make the desired changes.