This tutorial will show you how you can setup Mail on iPhone or iOS 5 in such a way that you can use Googlemail via IMAP and send emails masked with your custom address.

1. Before we can get started you need to get some login information from your custom email address provider. What we need are the outgoing mail server details, or in short, SMTP details. Here is exactly what you need:
   • Host Name: (like smtp.godaddy.com)
   • Username: (usually your custom email address)
   • Password: (for the above custom email address)

   Don’t panic about these details. They are usually written quite conveniently somewhere in the FAQ of your custom domain provider. Just search for SMTP.

2. Now Let’s get started. Open your iPhone and go into the Settings application. From there, navigate to the Mail, Contacts, Calendars tab and add a new account. Select Googlemail and enter your details.

   

3. A new account has now been created. Now reselect the newly created account. We will now have to edit the outgoing mail server settings. So tap on the SMTP button..

   

4. Then tap on Add Server…. Now enter the details from step 1. Turn on SSL if you like, but then enter the password. You can usually ignore the Port numbers. The iPhone will now verify the information. If it fails, you must have entered the wrong SMTP details. Then turn the server on.
   

   

5. This is it. Test if it works – but it should.

However! For some reason Googlemail allows the option to manage labels separately in it’s web interface and in whatever mail application you are using. I find this very annoying. So if you want Mail on iPhone to not add randomly Sent Messages or Trash labels to your emails, you need to change one last setting.
Go back into the account settings. Tap on Advanced. In Mailbox Behaviors make sure all options behave after the labels on the server. Not on the iPhone.

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.

Before we get started, you need your new icon. You can either create one yourself or download one from sites such as MacThemes. If you do create your own, make sure the icon is in the format that Apple requires it to be. A quick Google search should help out on that.

Once you have your icon, you can start adding it to the app of your choice:

1. Start by downloading the iPhone Explorer. This free tool allows you to access and change files on your iOS device. So we will be needing this to change the icons.
2. Plug your iOS device into your computer and open up iPhone Explorer. Then navigate to your apps .app folder. If, for example, you want to change the icon of Skype, you would navigate to the following path:

   Devicename/Apps/Skype/Skype.app/

   Here is an example screenshot:

   

3. In this folder (I.e.: Skype.app) look for two files named Icon.png and Icon@2x.png. The first icon is a smaller version and for devices without a retina display (old iPhones etc.). The second icon is for the iPhone 4.

   Select these two files and drag them to somewhere in your Finder to create a backup. Before you start wondering, the preview on these icons does not work.

4. Now delete these two icon files from the iOS device using the Delete button in the iPhone Explorer.
   Back in the Finder, rename your replacement icons to Icon.png and Icon@2x.png. Make sure they are in a .png file format. Then copy them into the .app folder (the same folder where you just deleted the two original icons).
5. Now eject your iOS device and restart it. You can do that by holding the home and hold button for a few seconds. Once the iPhone is restarted, you should have your new icon:

   

Image from Sneaky.me.

Did you like this tutorial? Show your thanks by donating something!

It is quite useful to detect visitors from a mobile device because that allows you to redirect them to a modified website suited for smaller screens.

It actually isn’t very hard – here’s how:

All you have to do is add a small snippet of code to all of your pages. Done! You can add this piece of HTML code manually (as the AllAboutiWeb tutorial does it) or using a tool like iTweak.

We will show you how to add this code using iTweak. If you wish to add it manually, we suggest following the excellent tutorial by AllAboutiWeb.

1. Start by downloading iTweak.
2. The following script handles everything from detecting your visitors and redirecting them to your modified website. There is only one piece in the puzzle that you have to change. The script needs to know, to where it should redirect visitors from mobile devices.
   So in the script below, replace the sampleaddress.com/MobileSite with the address you want your mobile visitors to be directed to.

   <script type="text/javascript">
if((navigator.userAgent.match(/iPhone/i)) ||(navigator.userAgent.match(/iPod/i))) {
if (document.cookie.indexOf("iphone_redirect=false") == -1)
window.location = http://sampleaddress.com/MobileSite;}
}
</script></head>

3. Now open up iTweak and navigate to the Search & Replace tab. Select the checkmark. Then choose your published site. If you publish to MobileMe or .Mac you will find your site on the iDisk (located at iDisk/Web/Sites/)
   If you publish to a folder, you will hopefully know where your site is.
   If you publish to your FTP server directly from iWeb, you will have to download your site from the server first. iTweak can only edit your site if they are on your hard-drive or on the iDisk.
4. Once your site is chosen, click the + button and paste the following code into the search box:

   </head>
   
   In the replace box, you paste the edited code from step two. Do make sure you paste all of the code into the box.

   In the end it should look similar to this:

   

5. You can now optionally Save the Search & Replace table so that you don’t have to re-edit and type the code you want to run iWeb.
6. Now click the Process Site button and let iTweak add the code to your site. If you now view you site from an iPhone or iPod touch, you should automatically be redirected to your mobile site.

Do you want to create sitemaps for your iWeb site? Add some Meta-Tags? Check out iMap.

With the help of JS-Kit and iTweak this is all possible.

If you want to see how the outcome looks, then head over to the demo.

1. Download iTweak. Make sure you are running the latest version of iTweak. You can check for the latest version of iTweak by clicking the “iTweak” menu item in iTweak and then selecting “Check for Updates.”
2. Now open iWeb and create a text-box at the position where you would like the comments and the entry-fields to appear. Choose an appropriate width and height.
3. In the text-box, type the following keyword (do not copy-and-paste it from here):

   %%JSKIT_COMMENTS%%

   See this screenshot:

   

4. Now publish your site either to MobileMe or to a folder. Once completed, open iTweak and navigate to the “Search & Replace” tab on the very right.
5. Tick the checkmark-option to “Search & Replace.” In the table, click the “+” button and so add a new row. In the left column, enter the following:

   %%JSKIT_COMMENTS%%

   In the right column copy and paste this:

   <div class="js-kit-comments" permalink=""></div><script src="http://js-kit.com/comments.js"></script>

   See this screenshot:

   

   You can use the saving mechanism to save the contents of the search and replace table. In that way you do not have to re-enter this code each time you open iTweak. You can then just open the previously saved table.

6. Choose your published site by hitting the “Choose published Site.” If you publish your site to a folder, you should know where you can find it. If you publish to MobileMe, you find your site on the iDisk.
   MobileMe iWeb ‘08 users use this path:

   iDisk/Web/Sites/SITENAME

   iWeb ‘06 users follow this path:

   iDisk/Web/Sites/iWeb/SITENAME

   Replace the keyword “SITENAME” with your actual sitename.

7. Now just hit the “Process Site” button. If you publish to a folder, you must now upload the site to your server so that the comments appear. If you view at them on your Mac, the comments will not be visible.

   Everyone: Keep in mind that the next time you publish from iWeb, iWeb will overwrite these changes. Hence, you will have to run iTweak each time you publish from iWeb to ensure that the comments will show up.

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.

This is the second part to the tutorial. It explains how to use iMap in conjunction with the Google Webmaster Tools: how to get a Google Webmaster Tools project, how to verify your site and add a sitemap. All this will ultimately help you to show up on Google.

If you haven’t watched the first tutorial just yet, then go ahead and do that first.

So, if you want to see how you can efficiently use iMap with the Google Webmaster Tools, then go ahead and launch the video tutorial:

Launch Tutorial

Get to the Google Webmaster Tools!

If you run into any problems, then do not hesitate to contact me. You can find a contact form on the contact page.

Looking for cool iWeb Templates? Go here.

If you want to learn how to create a verification file for the Google Webmaster Tools and use the Tools, then take a look at the second part of this tutorial.

So, if you want to see how iMap functions and how easy it actually is to use it, go ahead and launch the video tutorial:

Launch Tutorial

If you run into any problems, then do not hesitate to contact me. You can find a contact form on the contact page.

I hope this tutorial is much clearer and just gets across how to efficiently use iMap.

If you want to continue right to the second part of this tutorial, here you go.

Looking for cool iWeb Templates? Go here.

Image Zooms … what? Not sure what I am talking about? Take a look at the demo.

The internet has quite a variety of scripts that allow you to create these zooms. Here are just a few:

• FancyBox
• LightBox
• FancyZoom

All of them are very easy to integrate, but Cabel Sassers FancyZoom is the simplest. That’s why we will be using his.

Now let’s get started.

1. For this tutorial you will be needing four things:

   » iTweak. It’s free.
   » This search and replace database file for iTweak.
   » The actual FancyZoom. Download it from the blog post.
   » An iWeb-site with an image. That image needs to be enabled as a hyperlink. That hyperlink needs to go to an image file (the image that should later enlarge). The file type should be .jpeg or .png. For more details, see the FancyZoom post by Cabel.

   

2. Now publish your iWeb site to your default location.
3. Now go ahead and take a look at the downloaded FancyZoom folder. Inside there you should find two further folders. One is named images-zoom and the other js-global. Open up the images-zoom folder. Inside that folder you will find another folder. Open that one up as well. In there you will find a collection of images. Move all of the images into the folder js-global two directories higher. You can now trash the images-zoom folder.

   

4. Rename the folder js-global to fancy-zoom.
5. Now we have to do some nasty little code editing. What you have to do is open up the file FancyZoom.js and edit line 44 from this:

   var zoomImagesURI = '/images-global/zoom/'; // Location of the zoom and shadow images

   to this:

   var zoomImagesURI = 'fancy-zoom/'; // Location of the zoom and shadow images

   Alternatively you can just download the edited file and replace it with the original one.

6. Open up iTweak and navigate to the Search & Replace tab. There you will find a button labeled “Open Table.” Click on it and now choose the file downloaded previously. The file is named FancyZoom.itwksr. Once you’ve opened it up, you should see something like this:

   

   Make sure you tick the option to “Search & Replace Code.”

7. Now navigate to the “File Copy” tab in iTweak. Tick the option to “Copy Files.” Then click the “+” button and for your source folder select the renamed folder fancy-zoom (step 4). For your destination folder select your published iWeb site.

   

   Optionally you can save the “File Copy” table using the “Save Table” button. That will allow you to reopen the table the next time you launch iTweak without having to manually reselect your folders.

8. Now click the button in the bottom-left labeled “Choose Published Site.” Navigate to your published site and hit “Choose.” Then hit the “Create” button and iTweak should do it’s job.
9. Now you’re done! Visit your site and enjoy the zoom you’ve got.
   Please do note that when you publish again … you’ll have to start all over with this tutorial as iWeb overwrites the published files each time you publish.

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.

For this tutorial, we will be using a free application called iTweak. It has been made to simplify such additions to the iWeb application and so it is just perfect to use.

Please note that this tutorial is only available to those who publish to a folder and upload to a server that is capable of running .htaccess files. Please ask your hosting service first before you start this tutorial.

View a the final result (a demo) here or get right started.

1. As stated earlier, you will have to have downloaded the latest version of iTweak (this tutorial requires at least version 1.4.7). Publish your site from iWeb as well.
   To protect your site, you need to have a password, a username and the absolute path to another file (more on that later).
2. We will start off with the login data.
   htAccess, the method for the password protection, requires the login data to be encrypted. .
   To encrypt your login data, visit this site. Enter your username and your preferred password into the two provided textfields. For this tutorial I will be using “Hello” as my username and “World” as my password. See this example:

   

   Click “Create Password” and continue to the next step.

3. Now you will get a page with your username and you password jammed between two dark blue bars. It should say your username and then a combination of weird letters and symbols separated from the username through a colon.

   

   Copy this whole encryption and get ready to paste it into iTweak (Shortcut: Apple + C).

4. Open up iTweak and navigate to the “Security” tab. Tick the option to password-protect your site and in the text-field labeled “Login Data” paste in the encrypted data from the previous step. Make sure you copy/type this password 100% correctly!!!
   You can now type in your username in iTweak as well. Your window should now look something like this:

   

5. Now we have to deal with filling the last text-field; the absolute path to the .htpasswd file. There are two options to solve this. Either you can use a file I made to easily get the absolute path (requires a PHP-capable server) or you have to contact your hosting service and ask them about the absolute path.

   » Option A: Go ahead and download this file. Place the file named “info.php” inside the published folder from iWeb. Upload the whole folder (or just the contents, depending on how you like it) to your server. Now visit the file in your browser by typing a URL similar to this:

   http://domain.com/Sitename/info.php

   or if you only upload folder contents then type something similar to this:

   http://domain.com/info.php

   When you view the file you should find a huge blue table outlining all sorts of geeky stuff. Search for “SCRIPT_FILENAME” and to the right of that you will see the absolute path to the “info.php” file.
   Now copy the whole path except for the first slash and the “/info.php” extension:

   

   » Option B: If you server does not support PHP, then simply contact your hosting provider and ask them for the absolute path to be used inside your .htaccess file. They will know what your talking about.

   In both cases, please note that the path varies from each person! There is no scheme or pattern that you can follow.

6. Having acquired the absolute path in the previous step, copy and paste it into the provided text-field in iTweak. See this image:

   

7. Now choose your published site by hitting the “Choose Published Site” button and then hit “Process Site.” iTweak will now protect your site with the 100% secure .htaccess method. It will create two invisible files that you won’t see in the Finder. If you upload your site to your server by simply grabbing the whole published folder, then thats fine and the protection will work fine. On the other hand, if you just upload the contents of a published folder, then you have to use something like Coda to view invisible files in your Mac and make sure they get uploaded as well!
8. Done! The next time you publish, simply reuse iTweak to add the protection and your ready to go.
   If you run into any problems, please contact me via email and do NOT use the comments form below.

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.

For this tutorial, we will be using a free application called iTweak. You can go ahead and download it right here.

Please note that this tutorial will require the use of a PHP capable server. Otherwise, the tutorial and the form will not work. .Mac, sadly, is not capable of PHP. All those who don’t have PHP support, can take a look at a simple HTML snippet ready code from Wufoo.

The finished form will have a name, email, website field and a textarea for people to type their message. The style will apply to the theme you are using in iWeb. Simply try it out and you’ll see how it looks.

See the demo page for the result.

1. So now that you have downloaded iTweak, we can get started. Open iWeb.
2. Add two new pages. The first page will represent the page where you will have the actual form for visitors to fill in.
   The second page will be the page where people will be redirected to if they have successfully submitted their page. Also known as the “Thanks for your mail” page. The thanks-page should not be included in the navigation bar or no links should directly link to this page.
   You can give the two pages any names you like – but remember them and be sure to know which one is which!
3. In the first page, so the form-page, add a new text-box. The text-box should have the dimensions of around 400px wide and 270px high. In this text-box, you will later find the form.
   In the text-box, without changing any of its style (ie.: borders, colors, fonts), type in the following keyword:
   %%CONTACT_FORM_MAIN%%
   See this image:

   

4. Now let’s move on to the second page, the thanks page, again, create a text-box. This time the dimensions do not really matter as we will just have a short line thanking the visitor for the message. Then, without changing any of the text-box’s style, write the following right into it:
   %%CONTACT_FORM_SUB%%
   See this image:

   

5. Now publish your site and open iTweak. After the publish, iWeb is no longer needed.

   

   In iTweak, navigate to the “Discussion” tab and at the bottom you will have the ability to type in your email. Jam it right in the box.

6. Now, choose your site. You now have the ability, to use the two drop-downs to select your thanks and form page. Do that!
7. Now, make sure you have ticked the option to add the contact form and hit the publish button! Upload the files to your server and try the form! The form will not work if you view your site on your Mac (remember, it’s not a server).
   Lastly, if you have any errors, please contact me via email and do NOT use the comments form below!!!

Looking for iWeb Templates? Check out my huge collection right here.

If you have enjoyed this article and you wish to make a small donation, then feel free to do so by clicking here.