Jul 14

Ever wonder where that tiny little icon next to the address bar, or on the left side of a tab in a web browser comes from? This tiny image is known as a favicon. It allows websites to ‘brand’ their site in a web browser with their company logo or icon. You can easily add your own icon to your site made in EverWeb. This feature is available on the Site Publishing Settings page. Normally you would need to upload a 16×16 image labeled ‘favicon.ico’ but EverWeb takes care of all of this for you. Just select the image you want to use and publish your site. The video tutorial below will illustrate how to utilize this feature.

[youtube]http://www.youtube.com/watch?v=DAjN8YRe-II[/youtube]
Jul 10

One of EverWeb’s built-in widgets is the Image Slider. This widget allows you to create a slick looking slideshow on your website. Some people might use the image slider as a preview for a larger image gallery, or for other purposes such as a slideshow to show off their professional photographs. Whatever use you might have for the image slider, it is definitely a great addition to any website. EverWeb’s image slider widget is highly customizable so making it fit the design of your site is rather easy.

Below is a video tutorial that will show you how to use the image slider widget. From EverWeb’s latest major update (1.8) you can now make the image slider respond to the width of the browser. Let me know what you think of the image slider and what features you like/dislike or think needs to be added to it.

[youtube]https://www.youtube.com/watch?v= FqTyt6O6xRo[/youtube]
Tagged with:
Feb 05

As we have been discussing in previous posts, EverWeb is a new iWeb-like editor that will allow you to easily make your own website.  As I was talking to some small business owners last week, I was astounded to hear how much money they were spending on their websites, and nearly none of them we’re happy with the current site they had. It’s times like that I think we are lucky that we all know about iWeb and now EverWeb. Thousands of dollars can be saved by doing it yourself, and you just can’t put a price tag on having all the control over what gets done and how it gets done.

E-Commerce was a hot topic with iWeb, and this is no different with EverWeb. Luckily, adding e-commerce to an EverWeb made site is actually very easy to do using PayPal. All you will need is a free merchant account. You will be able to add Buy Now buttons, or even Add To Cart button’s that will allow users to add multiple items to their shopping carts before checking out. This is extremely useful for those of you that sell multiple items on your website. You can also use PayPal for adding Donate buttons, as well as subscription based payments.

If you do not like the default buttons that come with PayPal, you can upload your own custom buttons while creating the button on PayPal.

Here is a video tutorial that will actually show you the process of  setting up a basic add to cart button in PayPal. You may be surprised at just how easy it is.

[youtube]http://www.youtube.com/watch?v=ysNeZTvpL9I[/youtube]

If you have any comments or questions, please let me know. If there are any requests for similar third-party additions to your EverWeb site, leave a comment below and let me know. I hope everyone is having as much fun with EverWeb as I am.

Jan 31

MobileMe’s days are numbered, and many of you have been inquiring about what will be happening to your website. Plain and simple, you need a new web host. My advice to you is don’t procrastinate, get this done as soon as possible. You will be thankful you did later on. Here is a quick video tutorial that will show you how to transfer your site from MobileMe to a real web hosting company. If anyone has any further questions, just let me know and I will do my best to help out.

[youtube]http://www.youtube.com/watch?v=__wO7LXy0uY[/youtube]

As we inch closer and closer to the final days of MobileMe, many iWeb users should now be looking for a real hosting company to host their websites for them. In this tutorial, I am going to show you how to easily move your website from MobileMe to a real web host.

The first thing you will need to do is sign up for hosting. To do this, go to ragesw.com and click on Web Hosting. Then click on the Sign Up Now button. In this first step, you can either register a new domain name if you do not already have one, or you can transfer your domain over to RAGE Web Hosting. If you are not familiar with what a domain is, google.com, and apple.com are both domains.

So if you want to register a new domain, type in the name in the first box under the Register a new domain option. You can also select the extension for the domain by clicking on this drop down menu.

If you are transferring a domain, click on the second option to transfer existing domain to RAGE Web Hosting and  type in your domain. When you are all done, click the Click to Continue button. You should see the domain you typed, and the Status reading Available. Then click the Click to Continue button.

On the next page, you will see some information about the services you will be getting. The drop down menu next to Billing Cycle will allow you to select how long you want to sign up to hosting for.

You can read through the remaining configurable options and check off anything else that you want to add to your order. When you are done, click on the Update Cart button.

On the next page, you will need to enter your EPP code. An EPP code, or authorization code, is a security code that verifies that you are the actual owner of the domain you are trying to transfer.

You can obtain this code by logging into your account where you purchased your domain from. You should be able to find the code by browsing around, or you can e-mail your current registrar and ask them to give you the code, and to also unlock your domain so you can transfer it.

Once you obtain the code, simply key it in and click on Update Cart. From there you will be able to checkout and order your hosting.

A few notes on some of the things I just mentioned. Firstly, I didn’t show the process for people who are just buying a new domain. That is because it is very straight forward and you won’t need any help with it. Second, if you are having trouble obtaining your EPP code, you can just e-mail RAGE Web Hosting and they will help you get it.

After you have signed up, you will receive your signup e-mails from RAGE Web Hosting. In one of those e-mails, you will see an e-mail that looks similar to this one. These are the FTP login details. All we need to do with these is plug them into the corresponding fields on the iWeb publish page. It’s always a good idea to click the Test Connection button to ensure you copied and pasted everything correctly. If you transferred your domain, make sure to follow the instructions in the Domain Name Details section of the e-mail, as you will need to update your name servers to indicate that RAGE Web Hosting is hosting your site as well as housing it.

And that’s it. Once you publish your site, you can then visit your website on your new web host.

Aug 09

After adding the attention bar on my site in July 2011 to show the article “iWeb and Beyond” I had a lot of people on the comments, forum, facebook, and Twitter requesting to post a tutorial on how to add an attention bar to their iWeb sites.  So this tutorial is on how to do just that.  First off let’s explain what an attention bar could be used for.  Of course I used it to on my site to get peoples attention and make sure a certain article I wrote got read.  It’s pretty hard to miss.  You might also use it to let your viewers know that your site will be experiencing some matainance, or perhaps you have a big deal or sale on your site, or you could use it for advertising, or if you really just need to get your viewers attention.  So there are some ideas for how you could use this.

Watch the video above the “How To” or you can view the text tutorial by going here.  Below are the resources you’ll need:

File Download:

Download attention-bar.zip File »

Code:

Thanks everyone and hope you had fun with this iWeb tip.

If you found this tutorial helpful, please consider donating as it takes a lot of time to put together these tips. Thanks much for visiting iWebUnlimited.com.

[iWeb-Code=’donation’]

May 12

Are you hosting your iWeb site on your server? That means that you can’t use the built in comments feature in iWeb. It only works if you have a MobileMe membership. Well here comes iWebUnlimited to the rescue. Now you can get comments into iWeb no matter who your hosting your website with. Just follow the steps in this video and your set!

If your doing the iFrame way use this code below to create a blank HTML page:


<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Comments</title>
</head>
<body>
<!-- Add Comment Code Here -->
</body>
</html>



If you found this video helpful, please consider donating to the iWebUnlimited cause by clicking below.

[iWeb-Code=’donation’]


Tagged with:
Apr 29

Photo Swapper HTML Image Viewer in iWeb.

This adds a little image swapping viewer in iWeb.  Just follow the steps in the video tutorial.

Continue reading »

Tagged with:
Mar 10

Edit: I’m leaving Jason’s post below, but I wanted to show you guys a much much much easier way to add your meta tags to your iWeb website. I never recommend iWeb users to edit the HTML on their site. It’s really not necessary, especially with the resources made available to us. So watch this video on how to add meta tags to your iWeb website. You’ll also see how to add other items such as Title Tags, Alt Text, Meta Description, and codes for Google Analytics and Statcounter.com. If you have any comments or suggestions, please let me know!

Need a little more help in the search engine war with your iWeb site? Well this tutorial will show you how to add Meta Tags to your iWeb pages.

Continue reading »

Feb 21

Highslide JS is a great way to get that ever so popular image zoom effect just like the fancy zoom post I’ve done in the past. The difference is, is that this one will give you the ability to zoom more than just images. Though FancyZoom is a bit more light weight, there are some great advantages to Highslide. This tutorial will need the use of an HTML editor like Coda, Espresso, Dreamweaver, even TextEdit. You’ll also be using the tips page for the code reference and download which can be found here.

Feb 21

So your iWeb is getting pretty packed with pages and multiple sites and maybe even your band asked you to create a website for them and you don’t want to combine it with all your personal webpage files in iWeb. How do you create a whole new iWeb file and jump back and forth between your sites. Well this video shows you all of that. You can have as many iWeb files as you’d like. iWeb has no file>open option so learning this trick will help you make multiple sites and be able to jump between them as you please.

For OS X Lion Users

If you’ve install OS X Lion on your mac then you’ll need to do this a bit differently.  Simply download my application below and every time you launch it Lion will ask you to choose your iWeb domain file that you want to open.  Enjoy!

Download iWeb Launch App »

Feb 21

FancyZoom in iWeb, huh? What’s that. Well there are a many websites these days that have that popular image zoom effect so that when you click on the image it animates the photo larger. Well many have asked, how can I do that with iWeb? Well here it is, this is the tutorial to show you just how to do that. Keep in mind this one is a bit more complex, but it can be done without getting your hands to dirty in code.

Feb 21

This tutorial shows you how you can use Keynote from the iWork family to enhance the graphics in iWeb. Take a look.

Feb 21

This tutorial will show you how to make different parts of your image clickable.  Great if you want each head of a family photo to go to a different page, or a sports team photo, or many other possibilities.

Feb 21

Trying to get flash video into iWeb eh? You can’t bring it in like you do a regular flash .swf file. Flash video extension is .flv and it can’t work without some sort of .swf player to go with it. This video shows you some tricks to get flash video into iWeb. There are quite a few different options and this tutorial will show you how to get your flash video in iWeb in many different ways.

Here are the steps below:

VIEW DEMO »

Step 1:

Get video you desire to be a flash video and convert it to .flv format if it’s not already.

How do I convert my video to flash video you ask?

Well there are a number of different ways.  You are going to need one of these converter below:

  • Adobe Media Converter (comes with CS4 or Flash Video Encoder from CS3)
  • Visual Hub (no longer in development, but if you got it while it was out, lucky you)
  • Aimersoft Video Converter ($65)
  • Perian QuickTime Plug-In + QuickTime Pro (Perian is free, QuickTime Pro is $29)
  • SoThink FLV Converter ($45)
  • FFMpegX (Free, but it requires some external file installations, they make it a little difficult to get, so here it is made easy by me.  Click here to download the app and here to download the extra files.  Your welcome ;-).  You can get instructions and more info on the software here. After you open the .dmg file and drap application to your app folder and launch the app it will ask you to locate 3 files to add onto it.  They are the ones I provided.  I would recommend moving them to home folder/library/application support/ffmpegx (you’ll make this folder)/put 3 files here that were in the .zip folder here.  Then in the FFMpegX App you’ll know where to find the 3 files to install and they’ll be in a safe place where no one will touch them.  Hope that makes sense.  If it sounds to complex, just go buy one of the other converters above to make life easier for you.)

Which ever converter you use, just convert that video file to a .flv format.  So in a nutshell, step one is convert video to .flv

Step 2:

Download the Longtail Video JW player by clicking here»

You’ll be downloading a .zip file.  Double-click to open and inside you will see 2 files; one called “player.swf” and the other “swfobject.js”.  We will need these files to make this work.  So now we should have a total of three files

  1. Our .flv flash video we converted in step one
  2. player.swf file
  3. swfobject.js file

We just need to do one more thing and we’re ready to roll

Step 3:

We’ll need to have an image that will sit there until the user decides to click play.  So just export out a frame of your video.

It might be easier to go back to your original video to export out the frame.  You can do this in QuickTime pro, iMovie, Final Cut, and many other apps.  Or if you want to make it simple, just play your video, stop it on a frame that you would like to be your hold image and do a screen shot.  You can do a screen shot by pressing “command + shift + 4” on your mac, then draw a box around the frame of video your holding on.  When you let go you’ll have a new .png still frame  on your desktop.  We are going to use this to be the video preview.

You should now have four files.  Fyew.  These are all the files we need and we are ready to roll.  So we should have these four files

  1. Flash Video (our .flv video we converted in step one)
  2. “player.swf” (file we downloaded in step 2)
  3. “swfobject.js” (file we downloaded in step3)
  4. Preview image (file we created in this step.  You should name it preview.png)

For file size reasons you may want to open that image you created in step 3 in the application “Preview” and choose file>save as and save it as a jpeg image and bring the image quality down a bit so that the file loads quickly on the web.  Just a suggestion, if you have photoshop you could choose file>save for web and size it down that way too.  You can use a .png file or a .jpeg file for this

Step 4:

Now put those four files (.flv, .swf, .js,(.png or .jpeg)) onto the server, meaning your iDisk or your own ftp server.  If your using MobileMe I’d recommend making a folder called flash in this location: iDisk/Web/Sites/flash/put 4 files here. Just make sure you have these 4 files on your iDisk or server all all will be well.

Step 5:

Almost done.  All we need to do now is use the below code in an html snippet and replace the items in red with our own server path names.


<script type="text/javascript"
src="http://web.me.com/yourusername/flash/swfobject.js"></script>
<div id="player">This text will be replaced</div>
<script type="text/javascript">
var so = new SWFObject('http://web.me.com/yourusername/flash/player.swf','mpl','720','480','9');
so.addParam('allowscriptaccess','always');
so.addParam('allowfullscreen','true');
so.addParam('flashvars','&file=http://web.me.com/yourusername/flash/yourflashfile.flv&image=http://web.me.com/yourusername/flash/yourimage.jpg&stretching=none');
so.write('player');
</script>

Just replace the items in red with the path that goes to your files on the iDisk replacing the appropriate names to point to the right place.  So be sure to put in your MobileMe username and your correct flash video name (yourflashvideo.flv) and your preview image (myimage.jpeg or myimage.png).  Also be sure to adjust the width and height of your video with the 2 numbers that are red in the code.  Once it’s all updated and you have all your links pointing to the right spot, hit “apply”.

Done!

We now have flash video in iWeb successfully! Yay!

Hope it wasn’t too complicated for ya.  Just do it a couple times and you’ll have it down in no time.  There is a video I made that will walk you through this too if you’d rather look at that.  Just got the Video Tutorials section and it’s all about flash video.

Note: You can use Longtail Video JW Player on your site for free as long as your not selling anything, have ads on your site, etc.  If you are doing those things you need to purchase a license.  It’s €30 (Euro) which is about $41 dollars.  You can purchase a license here»

More Notes:

If your wanting to customize the JW player, they have a nifty little embed code creator that you can tell it what paramaters you want to be set.  Click here to go to it.

Feb 21

This tutorial will show you how to get more advanced navigation in iWeb. Navigation such as custom rollovers, drop down menus, and more. It’s the ultimate tutorial on getting a new navigation that goes far and beyond what the default is offered in iWeb. It’s a must see for any heavy iWeb user.

Feb 21

This tutorial from iWebUnlimited.com will help you learn how to add a website to go inside of your website in iWeb. Very useful if you want to load a page into iWeb, such as putting in a form, your facebook page, myspace page, etc. Use this tutorial to show you how.

Feb 21

This tutorial  will show you how to get files created with Adobe Flash (.swf) into iWeb. By using a little code.

preload preload preload