For those new to Piwigo, Piwigo is an open-source web photo gallery system.  It was originally called the ‘PHP web gallery’ (pwg) since it is based on the php scripting language.  Here are some links:  piwigo.org,  Wikipedia

My goal in posting a demonstration of this theme was to allow users to see it live and give users a chance to provide feedback.  A few features of this theme are in beta.  Here is a list of some of the features incorporated into this theme:

1. Fluid layout – content will expand to fill available browser. Nothing major here, but an important part of this theme.  for Melissa.
2. Search, feeds and login in fixed position element ‘pinned’ to top of browser.
3. Customizable header – Logo, gallery title / description and a custom block are available for customization.  Custom block presently has Google Adsense in it.  If you adjust this, just be aware and check layout  at browser min width condition to ensure content doesn’t overflow or break-flow.
4. Menu layout  has vertical tabs with fly-out menus on mouse hover – Goal here was to achieve a cleaner look by using  tabs and flyout.  One challenge is how to make multi-lingual as tabs are images.  Maybe someone has some suggestions?  I guess theme could substitute language specific images based on language setting?
5. When in single picture  view and using thumbnail previews, the thumb previews (on narrower browser window) will partially hide behind the main picture.  A simple mouse  hover of  the thumb will bring it to the foreground.  Depending on main picture size and thumbnail size, a small adjustment in min-width for fluid layout might be needed to ensure thumbs don’t completely hide behind image.  try  it, kinda nice!
6. Theme has it’s own plugin (installed separately) which provided a few enhancements:
   - provides ‘spinning’ timer during piwigo HTML slideshow
   - formats the photo number  with “of” not “/“  ie:  3  of 41  versus 3 / 41
   - changes ‘Home’ breadcrumb to ‘Gallery Home’, but can be set any string.
7. Image watermark on single picture (including HTML slideshow) view.  Defaults to small piwigo watermark distributed with theme as example.  Create your own .png file and you can display your watermark.
8. Improved single picture navigation, consolidated into navbar below image.  need to finish help button yet.
9. Improved metadata and comments layout.  I tested expanding/collapsing these blocks by clicking header and what default behavior should be (open or closed?).  You can click header to expand collapse, but default is expanded for both metadata and comments.
10. This theme also demonstrates a few plug-ins I recently created for piwigo.  The plugins add functionality, but are not tied to the theme and can be  used in other themes.
11. pwgSlideShow plugin:
    This plugin delivers a full-screen flash slideshow.  Click on the Flash ‘f’ icon in the toolbar displayed on the thumbnails or the single picture view in piwigo.  This plugin is in beta and am working to refine it a bit more.  Here  are some of the features of pwgSlideShow:
    1. Fit all or Fill all for image display.  Fit all will not clip, fill all may clip but maximizes screen fill (note: images are never upscaled).
    2. thumbnails displayed in ‘pages’ on foot of screen (quantity displayed is dependent  on screen width).  If you hover of  thumb, you get a larger preview and can jump to that image with a click.
    3. navigation bar hiding: the navigation bar will hide itself when you ‘rollOut’ of the navigation bar with your  mouse (so, move your mouse over the navigation bar and the move above it and it will fade in a few seconds).  Just move your mouse to the bottom of  your screen to un-hide the navigation bar.  If you want the navigation bar to remain visible, just keep you mouse in that area.
    4. View tracking is maintained when viewing images with this method.  View tracking can be disabled if you wish.  Views are only counted once even if you view an image multiple times in the full screen slideshow (until the web page is refreshed).
    5. Images are preload one-ahead at a time, so not to consume excess bandwith preloading everything in playlist (like some other players do!).  Preload indicated is red / green dot in upper right corner (flashing red means next image is loading, solid green means next image ready).
    6. Slideshow ‘spinning’ timer to indicate time ticks for slideshow period.  Slideshow refresh time (or period) utilizes piwigo $conf value for timer value.
    7. Context menu with link to piwigo.org
    8. Keyboard navigation (try it! an awesome way to view images).
       - left & right arrow keys for previous / next image
       - up & down arrow keys for previous / next thumbs page
       - spacebar to toggle play/pause mode; escape return to web page
    9. When returning to single picture view, refresh to image exited upon if  different than entry.  This  behavior has a parameter is you want to disable.
    10. Can also be configured for autostart upon fullscreen entry.
    11. Shows alternate content if flash not available
12. pAnchor plugin:
    this plugin adds an HTML page anchor to picture and slideshow pages and navigation urls to improve web browsing.  You can see the anchor #  added to the urls in your address bar.  It has an experimental feature that eases your browser to that anchor to scroll nice down to the image.
13. pGravatar plugin:
    this plugin adds a Gravatar image for comment author or  displays a default  image if user e-mail not registered with gravatar.com

I hope you like the new theme  named ‘pBrain’.  This theme does  require a few ‘hacks’ to utilize some of the features.  This is due to how I used the menu system and  as mentioned before, See the README for the theme and plugins. Hopefully, piwigo developers can implement a couple minor things to improve extensibility of piwigo.

Well, beat it up and let me know what you think.  I am continuing to refine and button things up, like some error trapping, help screen, etc.

As of 11/29/2010, this theme is NOT at the piwigo repository as I am just wrapping up some items. I will edit this post when it is available at piwigo.org. 

But browse the theme demo here and let me know your thoughts

Both the Static Publishing and the Dynamic Publishing method have been updated, so you can choose which best fits your needs. The Static Publishing method uses the industry best practice of nested-object tags with conditional expressions. The Dynamic Publishing method uses swfObject2.2 to insert the flash movie dynamically using javascript. Google has some great information on swfObject and various methods of implementation.

Functionality has also been added to the  %flash[....] parameters specified in the Atahualpa Theme Options in the WordPress Dashboard. You can now supply three (3) additional (and also optional) parameters, flashvars, param values,attribute values.

• Flashvars allow you to pass information to your flash movie.
• Param values allow you to specify specific Flash parameters to the browser to change how the Flash object behaves (ie: menu=false, wmode=transparent, allowScriptAccess=always are examples of parameters).
• Attributes allow you to specify additional HTML attributes for the < object > tag, such as id=ata_flash_header.

The syntax for the %flash[......] header item in Atahualpa Theme Header Options is:

%flash[ swf filename, width, height, flashvars, param, attributes]

swf filename: is required and is the movie filename (.swf). This can be a full URL, but if just filename, file is expected to be in theme’s /images/header folder.
width: is required and is the width (in pixels) of the movie. You can optionally append ‘px’, as in 1220px.
height: is required and is the height (in pixels) of the movie. You can optionally append ‘px’, as in 200px.
flashvars: are optional and is simply a series of assignment statements separated by semi-colon (;). As in site=production;x=5. You header would use variables site & x in it’s actionscript and these variables will be initialized with values stated when the flash movie begins.
param: are optional parameters for Flash Plug-in that control specific Flash behavior such as menu and wmode (window-mode). For example, menu=false;wmode=transparent for param would allow the flash movie to be transparent and show reduced context (right-click) menu.
attributes: are optional attributes that are added to the HTML object tag. Typically this is the ID of the element, as in id=ata_flash_header.

Here is a real example:

%flash[header.swf, 1220px, 200px, site=production, menu=false;wmode=transparent, id=ata_flash_header]

Note: the use of comma (,) to separate the major items and semi-colon (;) separate multiple values within an item. always double-check your syntax, I usually start with the required parameters and then get page rendering correctly and then add items to fine tune behavior.

You can supply ‘null’ in lieu of a optional parameter. For example if you had no flashvars, but needed to specify param & attributes. Do this %flash[header.swf, 1220px, 200px, null, menu=false, id=ata_flash_header].

Make sure you specify your Header image height in the WordPress Dashboard Atahualpa Theme Options and supply a default image to be used as alternate content if Flash is not available in the users browser. Alternate content (the header image) will be displayed as a fall-back. You should test this option by disabling your flash plug-in in your browser.  For some more information, see previous mydeviceIP.com posts that discuss these principles in detail.

Here is Zip file for STATIC Publishing method. Replace the bfa_header_config.php in your Theme’s functions folder. (good idea to rename original or keep back-up). I usually rename the original file to bfa_header_config-ORIG.php.

Here is Zip file for DYNAMIC Publishing method. This method requires swfObject.js in your root WordPress folder. You can get swfObject.js at google code.

If you experience any problems with this latest version of the ‘Add Flash Header to WordPress Atahualpa Theme’, please leave a comment and we will try to investigate it.

PLEASE read the post (for  the 3.5.3 version) as new syntax and features  are explained.  Those features include ability to specify flashvars, parameters and attributes in the %flash[....]  shortcode used in the Ata Theme  Dashboard Options for setting up your header.  The added parameters are optional, so the old syntax should work but won’t specify any additional information in the  HTML DOM and  flash object.

DOWNLOAD:  Static Publish method (.zip)

DOWNLOAD:  Dynamic Publish method (.zip)

This won’t be a long post, but I wanted to supply updates for using Flash headers in this theme.  I did update both the Static Publishing  method  and  Dynamic Publishing methods, so choose what applies.

If you need more information, see the atahualpa tag for the series of posts which provide detailed explanations. This post even has a sample download source code for the Flash (.fla) and alternate content image if you need to start from scratch.

If you have any comments or questions, please feel free to leave them.

By using the %html[html code]%, you specify the HTML code yourself, so you really have complete control. If you don’t know HTML, maybe for now use another option and go to www.w3schools.com for some HTML help. I would recommend creating your HTML code for the header in your prefered designer (I use dreamweaver cs4) so you can test it and ensure it is begin rendered correctly. Then you can paste your code within the %html[....]% parameter in the Atahualpa Theme Options->Style & Edit Header Area – Configure Header Area options. Save your changes and refresh your blog page to verify your new custom HTML header is working correctly.

Here is how to implement:
1. Download .zip file here (this zip contains bfa_header_config.php file).
2. Make a backup copy of the original bfa_header_config.php file in the wp-content/themes/atahualpa/functions folder.
3. Extract the .php from the .zip file in #1. Upload .php file to same location as original bfa_header_config.php.
4. Go to your WordPress Administrator panel->Appearance->Atahualpa Theme Options->Style & Edit Header Area.
5. Update the Configure Header Area using the %html[html]% or the %flash[url,width,height].
6. Put your HTML code in a <div> element and use in-line styling to control width, height, background, etc.

Good Luck with it!

Here is a sample %html[....]% text in a .zip file.
Here is an example set of files I used for testing (.zip file)

To use this example, you will need to upload the images to a folder on your site and edit the URLs in the HTML code to match path to images. The sample creates a 900px by 200px header with a series of balloons with random colors and vertical positions across the header. Also, a flash overlay is included at the left side of the header. This flash overlay is relatively positioned with in-line styling. Hopefully the example is a good concrete example to follow. You could load the javascript from a file to cut down on the HTML length.

I really think this is a worthy addition to the theme header options, as you can completely specifiy an custom HTML header to make your blog using the Atahualpa theme whatever you can imagine it to be!

* note: the %flash[...] option is also supported by the files supplied in this post. If you wish to have a flash header, see Add a Flash Header to WordPress Atahualpha Theme (ver 3.4.4)

This is a significant update to the 2 previous posts for Adding a Flash Header to WordPress Atahualpha Theme for versions 3.2 & 3.4.1. This update does NOT require editing any .php files and utilizes the Atahualpa (or ‘Ata’ for short) Theme Options thru the WordPress Administrative panel to control the Flash object (.swf movie). Basically, it adds parameters to the %flash option so it is not necessary to modify the .php files. For example, %flash[url, width, height]. See below for more details. Flash is still implemented in either the static publishing method using <object tags> or the dynamic publishing method using swfobject.js. See previous posts or google for more discussion on publishing methods.

The easy way is to use the static publishing code provided, but the dynamic is provided for those interested or those looking for an example.

The Static publishing method.

• Download the bfa_header_config.php file here (.zip file)
• Continue with the steps below

The Dynamic publishing method.

• Download the bfa_header_config.php file here (.zip file)
• Continue with the steps below

Common steps for both methods

1. Make a backup copy of the original bfa_header_config.php file. This is easily accomplished by renaming the file to bfa_header_config-ORIG.php. We want to be able to put things back like it was if we screw something up. Things should go smoothly, but always good idea to have a back-up.
   
   
2. Extract bfa_header_config.php from the downloaded zip file above for your prefered publishing method.
   
   
3. Upload bfa_header_config.php to your blog. This file should be uploaded to …/wp-content/themes/atahualpha/functions folder (same location as original file in #1).
   
   
4. Go to your WordPress Administrative panel and go to
   Appearance->Atahualpa Theme Options->Style & edit HEADER AREA. In the Configure Header Area, you can now use %flash[url, width, height] to enable your flash movie.
   
   The proper syntax for the %flash parameter is: %flash[url, width, height].

   example: %flash[header.swf, 1200px, 200px]
   
   The url can be just the .swf filename if file is placed in Atahualpha header folder
   (wp-content/themes/atahualpa/images/header). Otherwise the url should be the complete url,
   ie: http://www.yourdomain.com/blog/wp-content/uploads/2009/10/header.swf.
   The width & height are the width and hieight of your flash movie in pixels. The px suffix is optional.
   

If you are using the dynamic publishing method, which relies on swfobject.js from google, make sure you have uploaded swfobject.js to your web site. If this file is not located in the root of your blog, you will need to alter the path to swfobject.js in the bfa_header_config.php file (line #336).

The %flash[url, width, height] header option is designed to be used as a replacement of the %image option. If you include your logo in your flash movie, then don’t use the %logo option. I sometimes relocate the search box and the feed buttons to the sidebar and don’t use %logo. The %image & %logo options will still display, but it would be in addition to the flash movie. Feel free to experiment. My header options are: %flash[header.swf,1220px,200px] %bar1 %pages %bar2, which results in flash movie at top with page nav-bar between to the horizontal bars.

Also, it very important to test your alternate content by temporarily disabling your flash plugin. To Disable your flash plugin (in IE tools->manage add-ons;firefox tools->add-ons), select the Flash Plugin and Disable it. Then refresh your blog page in your browser and make sure the alternate content is displayed. In the Atahualpha Theme Options->Style & edit Header area, turn ON the Blog title & turn ON the blog tagline. Change any of the other properties of title & tagline to match your blog. Save the changes and refresh your blog page. With flash disabled, you should see your alternate content. This is VERY important, since google and other search engines see the alternate content. And since the Blog title (an <h1> HTML tag), it is important in ranking. The images in the header folder are selected at random to be the alternate content, so make sure you upload one. I usually save a .jpg snapshot of the flash movie and upload that so it has a similar look, but no animiation since it is a .jpg.

If you need a sample flash header to start with, you can download here. I have implemented a few flash headers and I stripped this one down and made a sample for people to use. It is 990px wide by 200px high and has buttons on title and image linked to blog home page. The source files are included (.fla & .as) if you have flash and want to tweak it. Adobe has a 30 day trial for flash if you don’t have it. It is in Flash CS4 using Action Script 3. You need to change the button url link in the button_overlay_as3.as file to match your blog. Alternate content header.jpg included also.

I hope this makes implementing a flash header in the Ata theme easier for those interested, especially those who do not want to edit code. This is the 3rd revision of this hack and since it can be implemented easily without any coding, I think it could be added to the theme distro and allow the most popular WordPress theme to allow flash headers by default.

Good luck with this one! If you have comments or questions, please post them. Thanks for using myDevceIP.com. Feel free to come back if you need to look up an IP address.

UPDATE: The %flash option does require that you have a least one (1) image file (.jpg, .png, etc.) in the Ata Theme’s images/header folder. You will get a ‘foreach’ error from php at top of page if no images are found. You need this image for your alternate content (see above discussion on alternate content). updated 11-30-2009

references: Adding Flash Header to WordPress Atahualpa Theme (ver 3.4.1)
Adding A Flash Header to WordPress Atahualpa Theme

* note that the %flash option uses square brackets [ ] at each end not parenthesis ( ).
and this code has been updated to use the %html[...]% option for a total custom header.
See the Add Custom Header to WordPress Atahualpa Theme post.

This article has been updated for Atahualpa Theme, see Adding Flash Header to WordPress Atahualpa Theme (ver 3.4.4)

This is an update to the original post to add a flash header to WordPress Atahualpa theme. This post uses Atahualpa Theme Version 3.4.1, the original post used version 3.2. Bytes-for-All has released a version 3.4.2 at wordpress.bytesforall.com that provides a handful a specific fixes. This update should work for either version, but was only tested on ver. 3.4.1.

If you use WordPress and the popular ‘Atahualpa’ Theme and want to use a Flash (.swf) header element, this post may be helpful. To make this modification you will need to modify one of the theme’s header files (bfa_header_config.php). One thing you may find helpful, is to setup a test blog that uses the same theme as your Live blog. This way you can test changes, plugins, etc. instead of editing the Live blog. To see an example of WordPress 2.8 with ‘Atahualpa’ Theme and flash header, see www.SuzieTrainsMaui.com/blog.

Let me say, Flash is great! It provides rich content and is compatible with like 95% of browers used today. There are a few different methods to implement a Flash element (a .swf movie) into web content. One method uses <object> tags which is called Static publishing. The other prominent method uses a javascript library named swfobject.js (available from Google) which is called Dynamic publishing. Static publishing is a little simpler than Dynamic, but you can choose the implementation that best suits your level and needs. Code for both methods are provided.

Here are the main steps with a code discussion below:

1. Make a backup copy of bfa_header_config.php.
2. Edit bfa_header_config.php following highlighted code shown HERE. This code shows the Flash Static publishing method. Code changes are highlighted Yellow. See code discussion below for details about edits and the code for Dynamic publishing.
3. Now we need to tell the ‘Ata’ theme to use your flash header. Login to your WordPress Admin panel and goto Appearance->Atahualpa Theme Options. From the new vertical menu, select Style & edit HEADER AREA. In the Configure Header Area, you can now use %flash as a parameter. Most likely you will replace %image with %flash.

   In most cases you will not want to use %image or %logo if using %flash. However, you will want to ensure good alternate content for those valuable search engine robots and the few visitors that don’t have flash installed. So, on that same HEADER AREA options page, make sure Show Blog Title and Show Blog Tagline are yes and setup appropriately to work with your alternate content image. Also, it is important to have Header Image height option set correctly.

4. Upload your flash movie (.swf) to your blog. I would recommend placing the file in the ‘Ata’ theme header/images folder, but you can put where you want, just make sure the path is set properly.
5. View your blog and hopefully you see your new Flash header. You should also test the alternate content by disabling the Flash Add-on for your browser and check your page again. It is a good idea to check multiple browsers to make sure your page is rendered correctly with and without flash.

Code Discussion

The original bfa_header_config.php can be found here for comparison. Note, this example used Atahualpa theme version 3.4.1. Also, if you copy/paste from the .pdf files, carefull not to paste line numbers. HERE is the raw .php in a ZIP file for Flash Static Publishing method.

Line 277: The IF statement was modified to check for %flash in the header items. Technically added OR and test condition for %flash.

Lines 280-302:The $header_image variable needs to be broken up into 3 parts so we can use part of it for alternate flash content. The $header_image variable is replaced by $header_div1, $header_content, $header_div2 and as you can see the last statement sets $header_image to the concatenation of the 3 parts.

Lines 305-319:This is where the flash code is formulated, so ALL this code is added to the .php file. This is where the Static and Dynamic publish methods differ. As you can see, the method shown uses <object> tags which is the Static publishing method. Make sure the path to your uploaded .swf movie is valid (or it won’t work). If you want to use the Dynamic publishing method, substitue this code provide in ZIP file for lines 305-319. Also, make sure you upload swfobject.js and all paths are valid.

Lines 347:Add “%flash” to the list. Notice the comma on the line prior.

Lines 361:Add $header_flash to the list. Notice the comma on the line prior.

You can adjust the code manually if you wish or copy/paste a whole block or the whole file if you wish as the raw .php files are provided above. If you have made any other changes to this file, you may not want to copy/paste the whole file. If you are a php coder, you may wish to make adjustments versus copy/paste so you can understand it, but others may wish to copy/paste a block.

Good Luck with it! Hopefully Bytes-for-All will implement this into the Theme!

This article has been updated for Atahualpa Theme, see Adding Flash Header to WordPress Atahualpa Theme (ver 3.4.4)

If you are a WordPress user and use the ‘Atahualpa’ theme and want a Flash header, this post may help. First for non-WordPress users, WordPress is a Blog publishing system that is very popular (wordpress.org). The ‘Atahualpa’ theme is the most downloaded WordPress theme and is an excellent theme. However it is not the theme behind this site (myDeviceIP.com), which uses another very popular theme ‘inove’. To see a reference of the ‘Atahualpa’ theme with a flash header, see SuzieTrainsMaui.com/blog.

To use a Flash header with ‘Atahualpa’ theme, it will require modification of the theme’s .php code files, so a little web experience is helpful. I recomend to have a test blog setup (on your web server) with ‘Atahualpa’ theme so you can test the modifications before updating the Live Blog.

The ‘Atahualpa’ theme is really well done (great job Bytes For All!!). It provides a lot of options and was programmed well enough for me to make this change (hack) farily easily.  This example uses Version 3.2 of Atahualpa Theme.

1. Make a backup copy of bfa_header_config.php
   
2. Edit bfa_header_config.php following highlighted changes shown here (.pdf). Code changes are highlighted Yellow. See code discussion below for details about edits.
3. Update ‘Ata’ options from WordPress Admin panel->Appearance->Atahualpa Theme options. Go to the Header Options. Add %flash to the ‘Configure Header Area’ (aka header options). You cannot use %image or %logo if you use %flash. You can (and should) setup a header image using Blog Title overlay and Blog tagline overlay. This content will be displayed as alternate content for visitors that don’t have flash and will make the search robots happy.  (to test disable flash add-on and check out SuzieTrainsMaui.com/blog to see alternate content in action.)
4. Upload your flash header file (.swf) to your blog and make sure path and filename in bfa_header_config.php (line 195 in the .pdf) match path and filename to your particular header .swf.
5. You will also need to put swfobject.js in your blog folder and make sure bfa_header_config.php (line 194 in the .pdf) matches your path. The example shows a /blog folder. You can get swfobject.js at Google Code site.  swfobject.js is the javascript code that loads flash (.swf) objects. You will need to download the .zip file, extract and upload swfobject.js to your web server.

Code Discussion

The original bfa_header_config.php can be found here for comparison. Note, this example used Atahualpa theme version 3.2.  Adapting to the newest Atahualpa theme may require some additional adjustments.

Line 9: The IF statement was modified to check for %flash in the header options. Technically added OR and test condition for %flash.

Lines 164-188: Again the IF statement is modfied to check for %flash in header options. Then I needed to break-up header string into 3 parts and concatenate in line 187. This separates the header_content from the DIV tags, which allows us to provide alternate content for non-flash visitors/robots.

Line 191-202: This is where the flash HTML code is formulated, so this code is ALL added to the file. Just make sure the path to swfobject.js and path to your flash movie (.swf) is correct for your blog. In this example, I put the header2.swf in the theme’s header folder, which is where Atahualpa theme stores it header images.

Line 217-218: The last edit is adding our new ‘%flash’ tag to these 2 statements so all the HTML code gets assembled correctly. This is where the beauty of Bytes-for-All Atahualpa theme robust programming allowed easy adding of ‘%flash’ to the header options.

I would hope (and encourage) BFA to implement this into their theme. Again, Great job on Atahualpa theme Bytes for All.

If you attempted this update, I hope it was easy to follow and you got it to work without too much trouble. I can be contacted via the Contact Us link or leave a comment.

To www or not to www? That is the question.

Developers and web site owners will inevitably face the decision to use either domain.com or www.domain.com.  One may say it does not matter which I use.   This question needs to be looked at from a few different points of views:  from a users (or browser) perspective, from a search engine perspective and from a marketing perspective.  There are some different schools of thought related to the Shakespearian question.  There is no correct answer, but different practices and recommendations can improve your search rankings and increase site traffic, and could affect your marketing.  We will analyze this question from the different perspectives mentioned.

Search Engine Perspective:  Search engines uses automated browsing agents (called spiders or googlebots) that crawl your site and they use intelligent algorithyms to index your pages.  These robots will index all your pages it can find and if you are using www.domain.com and domain.com inconsistently across URLs in your web pages, this can confuse the robots and could lead to duplicate content, which can adversly affect your rankings.  If all your URLs are nice and consistent (either www or no www), the search robot will not confuse pages (thus no duplicate content).  So, the search engines want you to be consistent with your use of www or no www.   If you site has both kinds of URLs scattered about many pages, you can use a find/replace function to help make them all consistent. 

Also, if you use Google Webmaster tools, you can set google’s preference as to how to display searches.  Personally, I always use www.domain.com on the development side, so I set google’s prefernence for all my sites to use www.  I would recommend that all HTML href tags and URLs within pages should use the www.domain.com. 

User / Browser Perspective:  Make sure you have read everything up to this point, as this is an Entirely Different Perspective!  Browsers (and users) are fairly tolerant of the use of www or no www.  If you type domain.com into your browser, it will still resolve the address and find the site.  If you type www.domain.com, same thing it works.  However, you may notice something different between them.  Your browser will either show http://domain.com or http://www.domain.com.  If you type in domain.com and the address changes to www.domain.com, then that particular web site redirecting (rewriting) the URL to a consistent method.  Type google.com or yahoo.com into your browser and you will see how those Internet Giants handle the www or no www question.  If you are a webmaster and want your site to redirect domain.com to www.domain.com, see the extra info at the bottom of this post. 

From a Marketing Perspective:  So, browsers can handle www or no www.  But in marketing, it is perfectly acceptable and very common to market just domain.com.  There is no need to put the www all over your nice marketing layouts.  Also long as people remember the domain.com, they should be able to find your site.  

So, in conclusion, I recommend one uses www.domain.com on the development side in the web pages and URLs, but from a Marketing perspective, drop the www and use just domain.com.  The browser are fairly tolerant to either, so there it does not really matter.  When I see a full URL http://www.domain.com versus http://domain.com, the latter just does not seem correct eventhough it works.  I like to see the www in the full URL, because domains are intended to be made of 3 parts (the www, the domain, and the extension). 

Extra:  If you want your site to redirect domain.com traffic to www.domain.com traffic, you will need to edit your .htaccess file.  The follow except is for domain.com to www.domain.com.  Be carefull editing this file, as a simple error can cause lots of problems.  Know what you are doing or ask someone. 

RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} ^domain.com$ [NC]
RewriteRule ^(.*)$ http://www.domain.com/$1 [R=301,L]

Modify the above changing domain.com to your domain.  You can check if it works by typing your domain.com into a browser address bar and you should see the URL change to www.domain.com.  Note:  This .htaccess code is for going from domain.com to www.domain.com, not the other way around (which I would not recommend).

I hope this article was helpful.  I know I cleaned-up all my sites and set my google preferences to www.domain.com.

Obviously, we modified the theme to display the Global & Local IP addresses box on every mydeviceIP.com page.  The IP address box utilizes PHP (a server side web programming language) to display the Global IP address.  The Local IP address uses a java application to determine your local IP address. 

The WordPress install was setup in a sub-directory not in the root directory.  We researched this quite a bit as we wanted to make the correct decision for this site before installation.  If you search google on ‘wordpress install root or folder’, you will find numerous articles discussing this critical decision.  We knew that this site would only contain the blog and no other content.  This might lead one to think that a root installation was a good choice.  We wanted to install in a sub-directory and have it appear that we installed in the root.  

Thanks to this great article at WordPress:  Giving WordPress Its Own Directory at WordPress Codex.  We installed WordPress in a ‘blog’ folder and followed the instructions…and it worked perfect.  The root directory is not cluttered with files.  This is how WordPress should be installed if you want it to operate as if it was installed in the web root.

So, we tip our hat to WordPress.org and all the posts we read that contributed to the development of myDeviceIP.com.  Enjoy! Also, Lunarpages offers some great hosting packages.

A Static IP address is assigned to a particular computer or device and that device has a permanent IP address. 

A Dynamic IP address are not permanent and can change.  Most Internet users connect to the Internet via dynamic IP addressing via their ISP (Internet service provider).  When a device (computer) connects to the Internet and is configured for dynamic (automatic) IP addressing, it requests an address from the Host Provider and the Host Provider determines a available IP address and temporarily assigns it to the device.  If that device is disconnected from the Internet for a while (typically more than 1 day), it will lose the IP address and the Host Provide will assign a new address next time the device connects.  Basically, the Host leases the address to that device.

The format of the IP address is a set of 4 numbers (0 to 255) separated with a dot ‘.’, for example:    74.125.155.103    

The IP-4 addressing system can handle a lot of devices, but the world is running out of IP addresses.  The new IPv-6 standard is currently being implemented and computers / devices are being designed to work with both systems as the world progress to this newer system with much more capacity. 

See the Wikipedia article on IP addresses