I have often considered myself to be a perfectionist since I spend much of my time fixing unnoticeable imperfections. Until recently I was using the javascript function window.open for some of my pop up images and had to guess at what the height and width arguments should be so that no white would show in the pop-up window. This quickly became very aggravating as I was adjusting these values by a few pixels each time then checking to see how it looked in IE6 and FireFox. Then I started using the window.resize function which automatically resizes the window after it has loaded to what ever values you specify. Well I have given up on those methods and I will share with you how you can too.

I swiped a javascript file one day while surfing the web and I use this script to create neat pop-up windows for images.

Place the code below into the head section of your page.

<script type="text/javascript" src="mosthumb.js"></script>

Then, use the following code in the body section to contruct your thumbnail links.

<a href="javascript:thumbWindow('YourLargeImageHere',
'Pop-up Windows Title Goes Here',600,400,0,1);">
<img src="YourSmallImageHere" width="150"
height="100" alt="Picture Description" border="0" />
</a>

Click on the thumbnail below for an example of this script in action.

Please note, I have slightly modified the original javascript file but do not take any credit for the creation of this script. You can download the javascript file here.

Web templates, whether they are made in Dreamweaver or Expression, have always been a tremendous time saver when it comes to updating your website site wide. Until today, I always thought that the only drawback to using a template is it made it very difficult, if not impossible, to have dynamic menus. If you are wondering what I mean when I say dynamic menu let me explain. Simply put, dynamic menus are menus that highlight the link depending on which page your website visitor is on.

Well… today the light bulb came on and I want to share my solution with you.

I made a template in Dreamweaver then created four pages based on this template. The source code for the navigation menu in my template looks like this:

<div class="navigation">
<a href="../index.html" id="link1">Home</a>
<a href="../demographics.html" id="link2">Demographics</a>
<a href="../family-friendly.html" id="link3">Family Friendly</a>
<a href="../entertainment.html" id="link4">Entertainment</a>
</div>

Attached to my template is an external CSS file in which I have created these styles:

.navigation a {
	display:block;
	padding:10px;
	width:100px;
	background:#666666;
	text-decoration:none;
	color:#FFCC66;
}
.navigation a:hover {
	background:#999999;
	text-decoration:underline;
}

Now all the links will look the same in the navigation menu across the entire site but we are not finished yet. That id=”link#” is what is going to make this menu dynamic. All you have to do is place these style declarations in the appropriate pages. Dreamweaver automatically creates an editable region in the head section of the HTML document. This is where we will insert some CSS.

In the page index.html, this code is in the head section’s editable region:

#link1 { background:#111111; color:#99CC66; text-align:right; }

In the page demographics.html, this code is in the head section’s editable region:

#link2 { background:#111111; color:#CC6666; text-align:right; }

In the page family-friendly.html, this code is in the head section’s editable region:

#link3 { background:#111111; color:#9999FF; text-align:right; }

In the page entertainment.html, this code is in the head section’s editable region:

#link4 { background:#111111; color:#FF66FF; text-align:right; }

And that’s it. I’ve created a standard look for the menu links in an external CSS file. I have created a different look for each link which was then placed in the page associated with that link.

For an example, click here.

WordPress is very fascinating. I am new to blogging but have a moderate understanding of HTML & CSS. If you are interested in designing a WordPress theme that you can call your own, you first have to read the tutorial titled “Dissection of a WordPress theme.” In a matter of a couple hours I was able to follow this tutorial and after doing so I feel like I have a foundational understanding of the different parts that make up a theme.

The tutorial takes the default theme ‘Kubrick’ which is packaged with WordPress and dissects it piece by piece. It summarizes different parts in the code but does not bog down the reader with a large amount of overwhelming detail. There are four parts to the tutorial which are as follows:

1. Part one – Pulling it apart
2. Part two – Complete design, header, and footer
3. Part three – The sidebar
4. Part four – The content

Now I must put what I have learned to the test and attempt to create my own theme. Thank you John Godley for your excellent work!

I assumed turning on permalinks in WordPress would be as easy as selecting the radio button and clicking update. Little did I know I would be looking at 404 pages for 2 hours. After extensive research I came to the conclusion that there isn’t any known solution to this problem. I have read many posts that say different things. Having lost all hope of fixing this error I decided to close my browser window and start all over. I opened my browser again, went to www.joshstauffer.com, clicked on ‘About‘, and viola!… Permalinks now work! Why? I don’t know.

Solution: If you would like to use permalinks and you are using GoDaddy for hosting, all you must do is turn permalinks on and wait. I am not sure how long to wait but rest assured the permalinks will begin to work after a short period of time.