Tag Archives: Video

Website Layouts with CSS

CSS Website LayoutsIn this CSS Video Tutorial I’ll show you how to layout a whole web page using Cascading Style Sheets. I’ll create headers, content areas, footers and numerous sidebars. I’ll also show you how to make major changes to a website layout with a limited amount of coding.

If you’d prefer to read this information in an article see this CSS Layout and Positioning.

All of the code used can be found in the article above and also follows the video tutorial. If you have any questions or comments leave them below. You can use the code in any way that you wish.

Continue reading Website Layouts with CSS

Learn xHTML in 10 Minutes

Learn xHTML Video TutorialIn the last article I covered how to Learn HTML in 15 minutes. In this video I’ll teach you how to write xHTML 1.0 Strict code in 1o minutes!

It is actually pretty easy. You just have to:

  • Change your DOCTYPE
  • Change Some Meta Tags
  • Close all your tags properly
  • Surround inline tags with block tags
  • Eliminate the use of a few tags
  • Leave the styling to Cascading Style Sheets

Continue reading Learn xHTML in 10 Minutes

Learn HTML Video Tutorial

Learn HTMLI was dared to create an HTML video tutorial that covers the top 50 tags, in under 15 minutes. Well I did it!

I show how to use 50 different tags in HTML. I then give an example of each. You’ll either love it or hate it. I hope you love it of course.

If you would prefer to see this done more slowly check out Learn HTML. I go through everything much slower and provide examples as well.

I plan on covering JavaScript next and then moving back into the wonderful world of PHP and then everything WordPress Themes & Plugins.

The code used in the video follows the video. Leave questions or comments below.

Code From the Video

MAIL2.PHP

<! DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

<html>

<head>

<meta http-equiv=”Content-Type” content=”text/html;charset=ISO-8859-1″ />

<style type=”text/css”>

h1 {color:red}

</style>

<meta name=”description” content=”Welcome to Bob’s Hardware, We sell” />

<meta name=”keywords” content=”Flowers, Seeds, Rakes, Shovels, Hardware Store” />

<meta name=”author” content=”Bob Smith” />

<title>Welcome to Bob’s Hardware Store, we sell Flowers, Seeds, Rakes</title>

</head>

<body>

<h1>Text to Draw Attention to</h1>

<abbr title=”A much longer description”>Something Abbreviated</abbr>

<acronym title=”as soon as possible”>ASAP</acronym>

<b>I Want this to be Bold</b>

<big>This is going to be Big</big>

<blockquote>Indent me and show I’m important</blockquote>

<center>Center Me Please</center>

<em>I like Being Italicized</em>

<i>I like being Italicized too</i>

<p>This is a big paragraph. Really, it is!</p>

<q>You can quote me on that</q>

<s>I’ve been struck</s>

<small>I feel so small</small>

<strong>I’m the strongest</strong>

<sub>I’m Subscript</sub>

<sup>I’m Superscript</sup>

<img src=”http://www.newthinktank.com/wp-content/uploads/2010/03/marketing-examples45_sm_sm.jpg” alt=”Merrill Lynch Ad” height=”415″ width=”300″/>

<dl>

<dt>Bicycle</dt>

<dd>- Has two Wheels</dd>

<dt>Car</dt>

<dd>- Has Four Wheels</dd>

</dl>

<ol>

<li>Car</li>

<li>Truck</li>

<li>Bicycle</li>

</ol>

<ul>

<li>Car</li>

<li>Truck</li>

<li>Bicycle</li>

</ul>

<a href=”http://www.newthinktank.com” target=”_blank”>The New Think Tank Website</a>

<a href=”http://www.newthinktank.com#Great Stuff”>Some Great Stuff</a>

<a href=”mailto:derekbanas@example.com?Subject=Hello%20again”>Send Mail</a>

<table summary=”Here is my sample table and a description of what it’s about”>

<caption>

Here are some things I did

</caption>

<tr>

<th>Sat</th>

<th>Sun</th>

<th>Mon</th>

</tr>

<tr>

<td>Played Ball</td>

<td>Watched Football</td>

<td>Worked</td>

</tr>

</table>

<form action=”http://www.newthinktank.com/mail2.php” method=”post”>

<b>Send Message to this Email</b><br />
<input type=”text” name=”email” size=40><br />

<p><b>Subject</b><br />
<input type=”text” name=”subject” size=40></p><br />

<p><b>Text Area</b><br />
<textarea cols=40 rows=10 name=”message”>Default Text in Text Area Box</textarea></p><br />

<p><b>Text Input</b><br />
<input type=”text” name=”textinput” /></p><br />

<p><b>Password Input</b><br />
<input type=”password” name=”password” /></p><br />

<p><b>Radio Input</b><br />
<input type=”radio” name=”radioinput” value=”Love Radio Buttons” />Love Radio Buttons
<input type=”radio” name=”radioinput” value=”Hate Radio Buttons” />Hate Radio Buttons</p><br />

<p><b>Checkbox Input</b><br />
<input type=”checkbox” name=”checkboxinput” value=”Love Checkboxs” />Love Checkboxs
<input type=”checkbox” name=”checkboxinput” value=”Hate Checkboxs” />Hate Checkboxs</p><br />

<p><b>Select Input</b><br />
<select name=”selectinput”>
<option value=”loveselect”>I love select buttons</option>
<option value=”hateselect”>I hate select buttons</option>
</select></p><br />

<p><b>Option Input</b><br />
<select name=”optioninput”>
<option value=”loveselect”>I love option buttons</option>
<option value=”hateselect”>I hate option buttons</option>
</select></p><br />

<p><input type=”submit” value=”Send”></p>

<input type=”hidden” name=”submitted” value=”TRUE” />

</form>

</body>

</html>

Web Design and Programming Pt 14 MySQL

Go Daddy Grid HostingIncrease Website SpeedA while back I did a series of tutorials on MySQL. However, because you guys requested a more example heavy MySQL tutorial I’m now going to provide that.

If you want to check out the previous tutorial I have it in both text and video format here:

I especially am happy with the articles!

In this video, I go over the basics of using MySQL. For example: Creating Tables, Data Types, Entering Information, Deleting Tables and Basic MySQL commands.

If you have any questions or comments leave them below.

Web Design and Programming Pt 13

Help Web Design and ProgrammingIn this PHP video tutorial I’ll show you how to work with exception handling.

When an error occurs in your code this code is referred to as an exception. Meaning the code runs fine Except if the user of the code does certain things. When these Exceptions occur an error is thrown and handled by code that lies somewhere else in your code.

I specifically cover the following topics in the video:

Continue reading Web Design and Programming Pt 13

Web Design and Programming Pt 12

Web Design and ProgrammingIn this PHP video tutorial I’ll cover how to manipulate files with PHP. Specifically I cover the following:

  • Read file into an array
  • Read file into a string
  • Grab text off of web pages
  • Strip HTML tags
  • Write to files

Here is a link to the first article and video for this series, if you haven’t seen it Web Design and Programming.

All of the code follows the video. Use it in anyway. Leave any questions or comments below.

Code from the Video

<html>
<head>
<title><?php echo “Object Oriented Programming”;?></title>
</head>

<body>

<?php

# Creates a file descriptor and assigns it to $file
# The second attribute opens the file for read only purposes
# You can access any file online with this same function
# r+ – Read and Write from beginning of file
# w – Write only to beginning of file
# w+ – Delete contents and read and write to file
# a – Write only to the end of the file
# a+ – Read and Write to the end of the file
$file = fopen(“customers.txt”, “r”);

# While the end of file hasn’t been met print lines to screen
while (!feof($file))
{
# fgets() returns all the characters up to a newline or EOF
# You can also specify the number of characters to return in the 2nd attribute
echo fgets($file). “<br />”;
}

echo “<br />”;

# You can also read a file into an array
$customers = file(“customers.txt”);
foreach ($customers as $customer)
{
list($name,$street,$city,$state) = explode(“,”, $customer);
$state = trim($state);
echo “Name: ” . “$name <br />”;
echo “Street: ” . “$street <br />”;
echo “City: ” . “$city <br />”;
echo “State: ” . “$state <br /><br />”;
}

# Close the file
fclose($file);

$file4 = fopen(“customers.txt”, “a”);

$newCustomer = “\nRick,219 Almond St,Pittsburgh,PA”;
fwrite($file4, $newCustomer);

fclose($file4);

# You can also read a file into a string
$customers = file_get_contents(“customers.txt”);
$customers = explode(“\n”,$customers);

foreach ($customers as $customer)
{
list($name,$street,$city,$state) = explode(“,”, $customer);
$state = trim($state);
echo “Name: ” . “$name <br />”;
echo “Street: ” . “$street <br />”;
echo “City: ” . “$city <br />”;
echo “State: ” . “$state <br /><br />”;
}

$file2 = fopen(“http://www.wikileaks.ch/static/html/faq.html”, “rt”);

while (!feof($file2))
{
$faqs .= fgetss($file2, 1024);
}
fclose($file2);

$file3 = fopen(“justthefaqs.txt”, “wt”);
fwrite($file3, $faqs);

fclose($file3);

?>

</body>
</html>

Illustrator CS5 Tutorial Pt 4

Illustrator CS5 Review TutorialI while back I created my second most popular tutorial of all time on Illustrator CS5s new features. It’s available here by the way Illustrator CS5 Tutorial.

I received a request from Vera to demonstrate how to recreate her wedding invitations. So in the video below I show you how to use the pen tool, how to figure out what font is used in a graphic and a bunch of other things.

The website I use to analyze fonts is called What the Font. The two sites I use most to get free fonts include 1001 Fonts and Da Font.

I also show you how to turn a blurry Jpeg into an EPS file and review everything not covered in the other tutorials in this Illustrator CS5 tutorial.

Leave any questions or comments below.

Web Design and Programming Pt 10 OOP & PHP

Object Oriented ProgrammingIn this PHP video tutorial I cover Object Oriented Programming with PHP. I specifically go over the following topics:

  • Encapsulation
  • Classes
  • Objects
  • Public
  • Private
  • Constructors
  • Destructors
  • __set
  • __get
  • And more….

All of the code from the tutorial is available after the video. Use it in anyway that you like. I’ll continue covering OOP with PHP in the next video tutorial in this series.

If you have any questions leave them below.

All the Code from the Video

<html>
<head>
<title><?php echo “Object Oriented Programming”;?></title>
</head>

<body>

<?php
# Encapsulation lets you hide the code behind an interface so you can protect the code
# and so your user need not understand the code to use it

# A class is a blueprint you use to create objects

# Objects contain the data (attributes) and actions (methods) needed to perform its tasks

# Inheritance is done when you create a new class from another, thus borrowing the data
# and methods that can be found there.

# Polymorphism allows a class to perform differently based on how it is being used.
# Polymorphism can be used to a certain extent with PHP in that you can use common
# method and attribute names for similar classes

# Any use of this is a reference to a specific object and that objects attributes and methods

class Animal
{
public $name; # Public variables can be accessed directly by anyone
private $age; # Private variables are only accessed by class methods, but not subclasses
protected $money; # Protected is like private except can be accessed by inherited classes
const POUNDID = 12345; # A constants value can never change
# A static attributes value is shared by all objects of the class
# You refer to static attribute like this self::$numOfAnimals, not with $this
private static $numOfAnimals = 0;

public function __construct($age)
{
echo “__construct was called”. “<br />”;
$this->setAge($age);
}

public function __destruct()
{
echo “__destruct was called”. “<br />”;
}

# __set can be used to perform error checking before assigning values to private attribs
function __set($attribName, $attribValue)
{
echo “__set was called for “. $attribName. “<br />”;
$this->$attribName = $attribValue;
}

# __get can be used to perform error checking before returning values from private attribs
function __get($attribName)
{
echo “__get was called for “. $attribName. “<br />”;
return $this->$attribName;
}

public function getAge()
{
return $this->age;
}

public function setAge($sentAge)
{
$this->age = $sentAge;
}
}

$dog = new Animal(8); # Create an object dog of class Animal
$dog->name = “Grover”; # Assign a value to the public attribute name
$dogName = $dog->name; # Retreive value from public attribute name

$dog->setAge(8); # Call the setAge() method for the dog object

$dog->age = 9; # Try to set a private attribute that makes a call to __set
echo $dog->age. “<br />”; # Try to get a private attribute that makes a call to __get

echo “The dogs name is ” . $dogName . “<br />”;
echo “The dogs age is ” . $dog->getAge() . “<br />”;
echo “The pounds ID number is “. $dog::POUNDID. “<br />”;

?>

</body>
</html>

Web Design and Programming Pt 9 PHP Strings

StringsHere I show you how to use many string manipulation methods in PHP. Also, I finish showing you how to use regular expressions.

You should watch the previous 2 PHP Regular Expressions video tutorials before you continue on to this one. They are avaialable here PHP Regular Expressions & PHP Regular Expressions Pt 2

I specifically cover the following PHP Methods in this tutorial:

Web Design and Programming Pt 6

iPhone DevelopmentIn this part of the Web Design and Programming tutorial, I will show you how to do anything with PHP functions. Specifically I will cover:

  • How to Create Functions
  • How to work with Function Attributes (Variables)
  • How to Pass Multiple Attributes to and from Functions
  • What Does Scope Mean (Local vs. Global)
  • What is Recursion

Continue reading Web Design and Programming Pt 6

Web Design and Programming Pt 5 PHP Arrays

Go Daddy Grid HostingIncrease Website SpeedIn part 5 of my Web Design and Programming tutorial I will cover the following topics:

  • How to turn a string into an array
  • How to turn an array into a string
  • How to sort an array
  • How to pull data from a file and store it in an array

And, I’ll also go over a bunch of other functions specific to arrays. If you missed part 1 of this tutorial it is available here Web Design and Programming.

All of the code in this tutorial will follow the video. Use it in any way that you would like.

If you have any questions or comments leave them below and I’ll answer them.

Code from the Video

<html>
<head>
<title><?php echo “Arrays”;?></title>
</head>

<body>

<?php
# An array is just a big box containing many similar boxes
# This information is similar to each other
# All the the information or values have a coresponding key or label associated with it
# An array can contain any combination of numbers, strings or other arrays

# Create basic array with key value pairs
/* $myInfo = array(“Name” => “Derek”, “Street” => “123 Main St”, “City” => “Pittsburgh”);

# Get the value by calling for the key associated with it
echo “My name is “, $myInfo[“Name”], “<br /><br />”;
$moreInfo = array(“State” => “PA”, “Age” => 35);

# Merge 2 arrays into one
$myInfo = array_merge($myInfo, $moreInfo);

# Iterate through the array with the foreach looping device
foreach( $myInfo as $key => $value)
{
echo $key, ” “, $value, “<br />”;
}
echo “<br /><br />”;

# Search for a key in an array
if(array_key_exists(“Name”, $myInfo)) echo “The name stored is “, $myInfo[“Name”];
echo “<br /><br />”;

# Search for a value in an array
$citySearch = array_search(“Pittsburgh”, $myInfo);
echo “The key for the city is “, $citySearch;
echo “<br /><br />”;
print_r (array_keys($myInfo)); # Short cut to provide the arrays keys
echo “<br /><br />”;
print_r (array_values($myInfo)); # Short cut to provide the arrays keys & values
echo “<br /><br />”;

# Create a Multidimensional Array
$customer1 = array(“Name” => “Derek”, “Street” => “123 Main St”, “City” => “Pittsburgh”);
$customer2 = array(“Name” => “Sally”, “Street” => “213 Grant St”, “City” => “Pittsburgh”);

$customers = array($customer1,$customer2);
print_r(array_values($customers));
echo “<br /><br />”;

foreach( $customers as $key)
{
foreach( $key as $key2 => $value)
{
echo $key2, ” “, $value, “<br />”;
}
} */

$countryStr = “Cuba,Spain,India,France,Italy”;
$randCountry = explode(“,”, $countryStr);
echo $randCountry[0], ” “, $randCountry[1], “<br /><br />”;

$countryStr2 = implode(“,”, $randCountry);

echo $countryStr2, “<br /><br />”;

if(in_array(“India”, $randCountry)) echo “India is in the list”;
echo “<br /><br />”;

print_r(array_reverse($randCountry,true));
echo “<br /><br />”;

sort($randCountry, SORT_STRING);
print_r($randCountry);
echo “<br /><br />”;

$countArray = range(0,50);
foreach($countArray as $printNum)
{
echo $printNum, “, “;
}
echo “<br /><br />”;

echo count($countArray);
echo “<br /><br />”;

$customers = file(“customers.txt”);
foreach($customers as $customer)
{
list($name,$street,$city,$state) = explode(“,”,$customer);
$state = trim($state);

echo “$name $street $city $state”;
echo “<br /><br />”;
}
?>

</body>
</html>

Web Design and Programming Pt 3 Looping

Objective C LoopingIn this web design and programming video tutorial I’ll show you how to use looping statements with PHP. If you missed the first part of this tutorial it is here Web Design and Programming.

I specifically will cover the following topics:

  • Using the $_REQUEST array to pass form data
  • The While Loop
  • The Do While Loop
  • The For Loop
  • How Break and Continue work

Continue reading Web Design and Programming Pt 3 Looping

Web Design and Programming Pt 2 PHP & HTML

Help Web Design and ProgrammingHere I continue covering Web Design and Programming using all of the most used languages being HTML, CSS, JavaScript, PHP, MySQL, etc. If you missed my first video, you should watch that first Web Design and Programming part 1.

In this specific tutorial I’ll cover the following:

  • How to access html form data with PHP
  • How to use if conditional statements in PHP
  • How to use the Switch statement in PHP
  • And more…

Continue reading Web Design and Programming Pt 2 PHP & HTML

Web Design And Programming Pt 1 PHP

Web Design and ProgrammingI have received tons of requests for tutorials. So, I’ve decided to create a massive tutorial that answers them all. In this tutorial I’ll focus on Web Design and Programming using all of the tools required. You should check out my Learn HTML Tutorial if you haven’t ahead of time.

I’ll continue this tutorial, with your input, until you can do pretty much anything in Web Design and Programming. Leave questions and comments below, because you are going to totally control everything I cover here.

I’ll start off with the basics of PHP and move on from there with tons of examples. Of course, all of the code used will follow the video.

All the Code from the Video

<html>
<head>
<title><?php echo “Website Title”;?></title>
</head>
<body>
<?php

// You can use short tags but it is not recommended doesn’t work in 6
# You can also comment code like this
/* Here is a
multiline comment
*/
echo “<p>Random Text</p>”;
print(“<p>You can print with braces</p>”);
print “<p>or without
them!</p>”;

$randVar = “Cats”;
echo “<p>”, $randVar, ” are funny</p>”;

printf(“<p>My name is %s I’m %d years old and
pi is equal to %.2f</p>”, ‘Derek’, 35, 3.14);

// Variables must start with a $ then letter or _ and then numbers
// Variables are case sensitive & don’t require definition before use

$boolEx1 = false; // 0 or false equals false
$boolEx2 = 1; // true equals any number but 0

$intEx1 = -234; // Max size normally 2^31 or 2^63

$floatEx1 = 3534.14;

echo “<p>Cost: $”,number_format($floatEx1,2), “</p>”;

// Arithmetic Operators: + – * / % ++ —

$firstName = “Doctor”;
$lastName = “Who”;

$wholeName = $firstName . ‘ ‘ . $lastName;
printf(“<p>His name is %s</p>”,$wholeName);

define(‘ACONSTANTVAR’, 2345);

echo “A constant is equal to ” . ACONSTANTVAR . “<br />”;

echo “How do quotes differ $wholeName<br />”;
echo ‘How do quotes differ $wholeName<br />’;

/* Escaped Characters in double quotes \” \’ \\ \n \r \t \$ */

$float2Int = (int) $floatEx1;
echo $float2Int, “<br />”;

/*
(array)
(bool)
(int64)
(object)
(float)
(double)
(string)
*/

$strNum = “28”;
echo $strNum * $floatEx1, “<br />”;

echo gettype($strNum), “<br />”;
echo is_string($strNum), “<br />”;

/* is_array() is_bool() is_float() is_integer() is_null() is_object()

?>
</body>
</html>

Python 2.7 Tutorial Pt 16

Python 2.7 TutorialHere I continue to teach you how to use the Tkinter GUI module built into Python. I build an application that allows you to input files, edit them and then save them. I specifically show you how to make the following GUI widgets with Tkinter:

  • Menu Bars
  • Multi-Line Editable Text Boxes
  • Drop Down Menus

If you haven’t seen the previous Tkinter tutorial you should definitely check it out below first. Otherwise this won’t make any sense.

Continue reading Python 2.7 Tutorial Pt 16

Python 2.7 Tutorial Pt 12

Python 2.7 TutorialIn this Python Video Tutorial, I will show you how to create databases using the Python SQLite module. SQLite is great because it:

  • Provides most of the basic database structure you want
  • Doesn’t require you to have an actual database server running
  • Provides SQL querying capabilities
  • Is included with Python by default

You enter and retrieve information from an SQLite database just like you do with any other database, by using SQL. Here is a tutorial on how to program with SQL if you don’t know how SQL Statements Video Tutorial. In that tutorial I focus on MySQL, but everything a say about SQL is nearly identical.

Continue reading Python 2.7 Tutorial Pt 12

Python 2.7 Tutorial Pt 11

PythonIn this video tutorial on how to use Python, I will focus on how to use an interesting Python Module called Shelve. Shelve allows you to store data in files similar to how a database works. It is very easy to use and provides a convenient way to take advantage of the power of Python dictionaries while providing you with the ability to change the data.

I’ll continue in the next tutorial to cover another interesting Python Module called SQLite. It is a Module that can be used as if it was a database meaning:

  • You can run SQL queries on it
  • Information is stored logically

Continue reading Python 2.7 Tutorial Pt 11