The Infinite Loop – Beginner's SEO, Beginner C# & JQuery Tutorials Problem. Problem Solved. Loop. – The life of a programmer

29May/104

Paging in PHP – PHP Paging Tutorial

PHP Paging & Automatic Pagination Tutorial - Paging made easy

I have written a php paging tutorial before. Admittedly, it wasn't the greatest. I don't think I was as clear as I wanted to be. SO I'm trying again. :) At the end of this tutorial, there is a file named php-automatic-pagination.php.txt
Please download it! It will help you understand the following.

Here is what we will be making..nice, simple pagers! (Dont worry about the Image #x text, thats really not part of the tutorial)
PHP Automatic Pagination/Simple PHP Paging Tutorial

Paging in php and automatic pagination is something every coder has to deal with when coding in php. I mean, you COULD show all results on 1 page and skip the php paging, but paging is necessary to reduce bandwidth and organize content. Paging is very easy to do and I will walk you through it step by step.

PHP automatic paging comes with a few questions:
Paging 1 : Page Size - How many results would you like to display per page?
Paging 2 : How can we bring back proper results in mysql?
Paging 3 : How can we print a pager that will help show the next items.

Decide on your page size - 10, 15, 25, 50, 100. It really depends on what you would like to do. For this tutorial I will use 15.

//we want 15 results per page

$pgsize=15;

//if there is a p variable in the query string e.g: page.php?p=5 we will get this value, else we will use 1 (page 1)

$pg=(is_numeric($_GET["p"]) ? $_GET["p"] : 1);

//lets determine where we would like to get results from
//if $pg is 1, this calculation results in 0 (we want to start from the first record in the database)
//if $pg is 2, this calculation will result in 1*15..which means we will start at the 15th index of the database (row 16)

$start=($pg-1)*$pgsize;

//let us query the database for our results
//you will notice LIMIT and $start and $pgsize.
//On page 1, this query will be SELECT * FROM image_table LIMIT 0,15 - this means return 15 rows starting at row-index 0 (row 1)
//On page 2, this query will be SELECT * FROM image_table LIMIT 15, 15 - this means we will return 15 rows starting at row-index 15 (row 16)
//On page 3, this query will be SELECT * FROM image_table LIMIT 30,15 - this means we will return 15 rows starting at row-index 30 (row 31)
GET IT?!?!?!

$imgs=mysql_query("SELECT * FROM image_table LIMIT $start, $pgsize");

//we will also need the total number of records in our table
//notice there is no limit? we want to know how many records are in the entire table!
//we can use COUNT(*), COUNT(1), or COUNT(fieldname), they will all return the same result

$img_total=mysql_query("SELECT COUNT(1) FROM image_table");

//mysql_query returns a resource id, we can use this to get the row it has returned

$img_total=mysql_fetch_row($img_total);

//the count will be the first field in this row

$img_total=$img_total[0];

//lets determine how many pages we will need
//WRONG!, this will cut off results..why?
//say we have 31 images, and our page size is 15. 31/15= ~2.x...We need to round this result up!

$max_pages=$img_total / $pgsize;

//use this line instead

$max_pages=ceil($img_total/$pgsize);

Once we have all this information, we can use a handy little function I have written named printPager. This function will print out a neat little pager. It uses a helper function named add_querystring_var which was from Added Bytes here:
http://www.addedbytes.com/code/querystring-functions/

Copy/paste this function into your page or into one of your includes:
This will print out your awesome little pager! :)

PHP Automatic Pagination Function

function printPager($max_pages,$pg){
print '<div class="clear"></div>';
print '<ul class="pager">';
$i=1;
if($pg!=1){
$url=$_SERVER["SCRIPT_NAME"];
$url.=add_querystring_var("?".$_SERVER["QUERY_STRING"], "p", $pg-1);
print '<li class="prev"><a href="'.$url.'"><<</a></li>';
}

while($i<=$max_pages){
$url=$_SERVER["SCRIPT_NAME"];
$url.=add_querystring_var("?".$_SERVER["QUERY_STRING"], "p", $i);

if($pg==$i){
print '<li class="current">';
print '<span>'.$i.'</span>';
print "</li>";
}else{
print "<li>";
print '<a href="'.$url.'">'.$i.'</a>';
print "</li>";
}

$i++;
}

if($pg!=$max_pages){
$url=$_SERVER["SCRIPT_NAME"];
$url.=add_querystring_var("?".$_SERVER["QUERY_STRING"], "p", $pg+1);
print '<li class="next"><a href="'.$url.'">>></a>';
}
print '</ul>';
print '<div class="clear"></div>';
}

function add_querystring_var($url, $key, $value) { $url = preg_replace('/(.*)(\?|&)' . $key . '=[^&]+?(&)(.*)/i', '$1$2$4', $url . '&'); $url = substr($url, 0, -1); if (strpos($url, '?') === false) { return ($url . '?' . $key . '=' . $value); } else { return ($url . '&' . $key . '=' . $value); } }

Print Pager is called like so:

PHP Pager Styles

We can style this pager using the following:
/*pagers*/

div.clear{clear:both;}
/spacing between numbers and sizes
ul.pager li {
float:left;
margin-right:5px;
font-size:8pt;
padding: 2px 5px 2px 5px;
}

//link color
ul.pager li a{
color:red;
}

//link hover style
ul.pager li a:hover{
text-decoration:underline;
color:red;
}

//current page styling
ul.pager li.current span{
color:red;
}

//previous and next stylings
ul.pager li.prev, ul.pager li.next{

}

Download this tutorials script! It will help you understand. Right click: php-automatic-pagination-tutorial.php and click Save as. Then get rid of the .txt extension and name it php if you would like to run it. You will need to setup a database table to use for the tutorial. It can have an id field and another field.

If you enjoyed this post please leave a comment! I like reading and responding to all my readers!
Thanks


Use HostGator 2010 Coupon Code: 994offhgpackage for $9.94 off your first month!
(First month will cost $0.01)

24May/100

HostGator Discount Code 2010 – Cheap Web Hosting

By far one of the best hosting companies I have had the experience of being a customer of is HostGator. Their prices are extremely affordable and their customer support is SUPERB. I have never had a web hosting company with the technical expertise and patience of the live support chat. They always answer questions and help configure servers. I have had live support chat agents sit there patiently and wait for me to re-test my site after their changes.

Our programming company uses HostGator to host all of our sites - they have shared web hosting, reseller accounts, and others.
They offer UNLIMITED disk space hosting (250,000 files maximum ...100,000 if you intend to use the auto-backup feature) and
UNLIMITED bandwidth and are just the best hosting company i have ever had the pleasure of working with.

Use one of these HostGator 2010 coupon codes to receive $9.94 off your first month!

HostGator Discount Coupons/Promo Codes:

HostGator 2010 coupon/promo code 1: 994offhgpackage
HostGator 2010 coupon/promo code 2: 2010hostgatorcoupon
HostGator 2010 coupon/promo code 3: hostgatorcoupon2010
With the "BABY" plan for 1 month this means you pay $0.01 for 1 month hosting!

22May/100

ING Direct Orange Key 2010

Using this ING Direct 2010 orange key: 17190811S1 you and I will receive a $25 each when you deposit a minimum of $100 to start your account!

Who doesn't like free money? :) Enjoy

21May/100

Hide Google Custom Search Engine (CSE) Textbox

There doesn't seem to be any articles on this, so I will try to save you time by letting you know. Using firebug, we can inspect the textbox element to see it is a form with the class .gsc-search-box.

To hide the search box simply add this to your css:

.gsc-search-box {
display:none;
}

24Apr/100

How To Remove Viruses and Spyware Manually

Remove Viruses and Spyware Manually

Viruses,spyware, malware - whatever you want to call it, these things wreak havoc on your computer. Browser hijacks, file deletion, disabling ctrl+alt+delete are just a few things that some of these baddies can do. However, there are some tools to help you remove viruses and spyware manually.

Preventing Viruses and Spyware

Prevention is the best medicine. I'm sure you've heard something like that before but its true. Knowing about how to prevent spyware goes a long way. There are many programs that offer virus+spyware/malware protection and they will monitor your computer for changes to  your registry and files. I recommend the following programs for spyware/malware protection and scans.

Spyware Search & Destroy (Spybot S&D)

Ad-aware SE (Free for personal use)

Malware Bytes

Steps To Remove Viruses and Spyware Manually

  1. Download and Update 1 of the above software (or all 3! [recommended])
  2. Perform scans - Use the above programs to perform viruses, spyware, and adware scans. This is usually the initial step in removal as it will remove most of the spyware/adware/malware on your computer.  I recommend using safe mode to do these scans. In safe mode, your computer does not load extra applications and drivers, only the bare minimum need to run  your operating system, so these programs will have an easier time removing/deleting files from these viruses. There are different ways to get into Windows Safe Mode. On my computer, I turn off the power and turn the computer on. I keep hitting the F5 key until i get a prompt asking how I want to boot. I select safe mode and let it load. On your computer it may be a different F  key...like F7.
  3. Check your startup using  msconfig - Now that we have run scans and have done an initial clean on our computer. We can check our startup. Hit Start, then Run and type msconfig. Hit OK. Click the Startup tab, and look through the list. For the most part, anything here can really be unchecked. Try to look at the file path and the name of the checked items, this will usually give you a hint of what is what. Example: Logitech Quickcam Driver -> This is probably your camera driver, dont disable it. Once you go through the list and uncheck unwated items, click apply. Restart when you are prompted to. After restarting, click Do Not Show This Message Again and click OK.
  4. HijackThis! - Download Hijack This Hijack This is a program that will scan your computer and show information about changes that have been made to it. Download and install hijack this and run a scan and produce a log. You can copy and paste your log into this site: http://hjt.networktechs.com/ and it will guide you onto what to remove (To remove items, place checks next to them and click Fix Selected Issues) .  Also, there are many forums which will let you paste a HJT log and other kind users will help you analyze it. Alternatively, you can post your HJT log in the comments below and I will try to assist you with it.
  5. CC Cleaner  - Download CC Cleaner CC Cleaner will help remove temporary browser files, cookies, recycle bin, some program cache info. It is a good idea to run this program every once in a while just to help free up some space and keep your programs running in top shape.
  6. Reformat (Last Resort/First Resort) - A lot of viruses and spyware can be removed with the above steps, however, sometimes you get very pesky viruses and programs.  If you think the malware/adware/virus will be extremely difficult to remove, or if it is extremely malicious (i.e rootkit viruses that attach to windows files) sometimes the BEST option is to reformat and reinstall windows. This is the ONLY way to ensure your computer is COMPLETELY free of spyware. The programs listed above often do the trick. Sometimes you will do Steps 1-5 and then decide to reformat anyways because they couldn't completely remove the infection. Sometimes when I get extremely pesky infections, I reformat as my first resort. A backup, reformat and reinstall of all my programs takes me less than 4hours. Sometimes, virus removal and infection cleaning takes more than this.



Hope this guide helps you remove viruses and spyware infections. I often get paid to clean and remove spyware, adware, and viruses, however, I don't mind sharing how I do it. Most people just cant be bothered with it, but, if you can take the time to do the steps above, you will have a cleaner, faster, better, smoother running computer.
Comment if this helped you!
Paste your HJT logs if you need assistance.

9Mar/100

Google SEO Flash & Flash Tips/Techniques

Google SEO Flash

Google currently DOES index flash, however, I believe it is extremely unreliable. Clients have asked me to do some SEO work on their sites, little did I know, these sites were flash!

Most crawlers seem to have a hard time crawling flash and the #1 tip I can give for Flash SEO is: don't show search engine crawlers flash, show them alternate content!

The reasoning behind this technique:
1) Underlying HTML Content
2) Use javascript to load Flash
3) GoogleBot = No Javascript = Doesn't see flash, sees alternate content

For two of the sites I have worked on, I have used JQuery, JQuery SWFObject Plugin, and a base HTML site to get these sites indexed. Search engine crawlers do not have javascript,  so we will use it to load our flash. If our client has flash and javascript, our client will see Flash. If they dont (Googlebot doesn't have Javascript) they will see our underlying HTML content. Let's take a look at this code:

<div id="flash"></div>
<div id="altContent">
<h1>Google SEO Flash Tips and Techniques</h1>
<h2>How To SEO Flash for Google</h2>
</div>
On your main page, write <div id="flash"></div>, then wrap your Search Engine Optimized code in <div id="altContent"></div>.

As you can see, the content in the "altContent" div, is pure html which we can apply the following Basic SEO Techniques to. We have an empty div above with the id "flash". We will use JQuery & the SWFObject to load our flash file into our "flash" div. Since the flash loading is done using javascript, Search Engine Crawlers will not see the flash, but will see our optimized HTML content.

Download a copy of JQuery here: http://docs.jquery.com/Downloading_jQuery
and SWFObject plugin here:  http://jquery.thewikies.com/swfobject/downloads
We will put all our files in the same directory for simplicity, you can put them in a seperate 'scripts' directory if you want to keep organized.

On our main page, we will add the script references (order is important! first load jquery, then the swfobject plugin):<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.swfobject.js"></script>

Now, underneath this, we will add the function to load our flash file:

  1. <script>
  2. $("document").ready(function(){
  3. if($.flash.available){
  4. $("#flash").flash({
  5. swf: 'main_flash8.swf',
  6. width:766,
  7. height:750
  8. });
  9. $("#altContent").css("display", "none");
  10. }
  11. });
  12. </script>

This code should be pretty self explanatory, but, let me explain:
Line 2: We are setting up a function to run when our document has been loaded.
Line 3:Check that the user has the flash plugin and it is enabled
Line 4: We are using the .flash() method of SWFObject to load content into the #flash div. (# stands for id  . stands for class)
Line 5: We set the swf: parameter to our swf file
Line 6/7: We set the width/height
Line 9: Now that our flash has loaded, we set the display of the altContent div to none, which will hide it.

Since GoogleBot does not have javascript, the code to load the flash and hide the altContent will never run.
If a user has flash, the flash site will load. If not, they will see the html content.

Searching for my clients business name, they could not be found anywhere. Once I applied the technique above, they were #1 within a week (Search engines do take some time :) )

This technique is widely accepted. For some more reading, check out: Google Does Index Flash

Hope this article helps.
Comment if it did!

6Mar/100

How to Setup a SEO friendly 301 Redirect

301 redirects are used to tell the browser that the page they are requesting has been moved permanently to another location. However, this is often used in SEO as well to give a domain ALL the credit from incoming links.

Search engines see your domain as 2 domains.

http://www.mydomain.com

and

http://mydomain.com

If 50 sites link to www. and 50 link to mydomain.com, you are losing half the 'votes' for your website (a link to your site is essentially a vote that your website has good content). The best way to get FULL credit for your links is to setup a 301 redirect.

Log into your hosts control panel and look for a Redirects option.
Type of Redirect: 301 (Moved Permanently)
Select the domain from the dropdown list.
WWW Redirection: Look for an option that says Only redirect with www.
Redirect to: Type http://mydomain.com

Click add.
If you visit http://www.mydomain.com, you should now be redirected to http://mydomain.com. Alternatively you can set this up so that any request to http://mydomain.com redirect to http://www.mydomain.com, this is up to you.

One last thing use this: SEO Friendly Redirect Checker to make sure your redirect is setup properly! For Example, i can check this site for a redirect by typing http://www.theinfiniteblog.com, it will tell you there is a search engine friendly redirect setup! :)

If you do not have a host or they do not support configuring redirects, you may have a little more trouble setting up the redirect, BUT, there is a great resource for setting up 301 redirects with: IIS, HTAccess, PHP, ASP, etc etc.
How to Redirect a Web Page

Happy Redirecting!
Comment if this helped! :)

6Mar/100

How to Easily Migrate WordPress to a New Server

Oddly enough, I was having trouble with this because of the way Wordpress handles URLs. At first I tried, http://www.mydigitallife.info/2007/10/01/how-to-move-wordpress-blog-to-new-domain-or-location/ which got me on the right track. However, I could not fully use this solution. Since my wordpress needed an upgrade anyways to 2.9.2, I figured I would reinstall.

I did a fresh install of wordpress on my new server, and then found this amazing little feature that wordpress has integrated.

In the WordPress admin panel, there is a Tools menu. Click Tools, then Export and Wordpress will export all your posts, comments, and attachments to an XML file! THANK YOU WORDPRESS.

I logged into my new installation of WordPress and clicked Tools and then Import.

All my posts, comments, attachments were migrated!
After this, it was just a matter of logging into MySQL and copying over the users :)

Awesome Night.
We are now theinfiniteloopblog.com :) Enjoy!

19Sep/091

Professional Table Styling using CSS

On this blog, I have a post about using jquery to apply alternating table row coloring. Someone commented that they couldnt quite get it working and needed an example. So, while making the example for him, I figure it would be a good post to show how to style a table professionally with CSS.

So, were going to start with this markup:
Note: You only need to load jquery and jquery.scripts if you want to do the last part of this example
.

<html>
<head>
<title>Table Row Coloring Example</title>
<script type="text/javascript" src="jquery.js"></script> <!--load jquery-->
<script type="text/javascript" src="jquery.scripts.js"></script> <!--load our custom jquery file-->
<link rel="stylesheet" type="text/css" href="style.css"/><!--load our css styles-->
</head>
<body>
<table>
<th>id</th>
<th>First name</th>
<th>Last name</th>
<tr><td>1</td><td>Scott</td><td>Moniz</td></tr>
<tr class="row2"><td>2</td><td>Bob</td><td>Barker</td></tr>
</table>
</body>
</html>

Alright, now that we have that done. We area going to create style.css and add a few rules.

Here is the table selector:
table{

border: 1px solid #ccc;
}

well....that doesnt look very good..YET.
Lets add a rule to the header. We'll add a background color.

table th{
background-color: #ccc;
}

Lets add a rule to the table data tags.
table tr{
border: 1px solid #ccc;
}

Now, lets see what we got so far.
tabletut1Not too bad. You'll notice the headers are a little to close, and the borders dont look too great. Don't worry well fix that. Lets add another couple rules to table th and td.
table th{
border: 1px solid #000;
padding: 5px;
}
table td{
padding: 2px;
}

Alright..lookin good so far. Here's what you should have:
tabletut2Lets take care of these ugly borders.

On our table selector we will add this rule:

table{
border-collapse: collapse;
}

If you look at the table, you'll notice that on the 2nd row there is a class="row2". We will now style that class.
table tr.row2{background-color: #EBEBEB;}

DONE. The final result looks like this.

tabletut3

You can always modify the styles as you wish.

Tip: Every 2nd row, add the class="row2" to the row to get the alternating row colors. Optionally, add text-align: center; to the table selector.
tabletut4Here's the full CSS:
table{border: 1px solid #ccc;border-collapse:collapse; text-align: center;}
table th{background-color: #ccc; padding: 5px; border: 1px solid #000;}
table td{border: 1px solid #ccc; padding: 2px;}
table tr.row2{background-color: #EBEBEB;}

Keep reading for an easy way to alternate row colors when you have a lot of rows.

Alright, now, if your table has 20 rows, maybe even 50, or 100, adding row2 manually is really a pain...and I personally wouldn't do that. We will use jquery to color the alternate rows.

Find the <tr class="row2"> and change it to <tr>. If you load the table you'll notice the alternate rows aren't colored anymore. We will now add a class to the table. So <table> should look like this <table class="altcolor">.

Now that our table is setup, we will use a jquery selector to color rows in any table that has the class altcolor.
You should have jquery.js and you should create a file named jquery.scripts.js.
Open jquery.scripts.js and add the following:

$("document").ready(function(){
$("table.altcolor tr:even").addClass("row2");
});

This loads when the webpage is ready
//Notice the selector ?
table.altcolor tr:even means any even row, in a table, that has the class "altcolor"
Now we just call addClass, which will add the class row2.
now, the class row2 is added to every even row in a table with the class altcolor.

Done. :)
If you don't get the same result, you might want to download the example source and check it out.

Download Table Styling Example

Tip: When using jquery to style alternate rows, check your table with javascript disabled.
For example, if you style your tables to have white text, and your row2 is supposed to apply a dark background to make the white text show up, if they have javascript disabled, they won't see the white text. Be careful and make sure your table looks good with and without javascript.