Archive for the ‘Flash Header’ Category

Change the height of the flashfader header slideshow

Saturday, May 3rd, 2008

A few times I’ve gotten asked about how to change the height of the Flashfader header slideshow. It’s not terribly difficult, but it’s not as easy as you might think, either.

1. Step 1: Go to “Manage” –> “Flashfader” and set the height to whatever you want it to be. Click “save.”

2. Step 2: Go to “Design” –> “Theme Editor” and choose “Stylesheet (style.css)” to edit it. Scroll down to line 268 (there’s a line marker at line 265). This chunk looks like this:

/* LINE 265 */
 
#header-masthead {
height: 250px; /*height of masthead*/
background-image: none;
}

Change the height to whatever you want it to be.

3. Step 3: Finally, you’re going to need to use an FTP program or your File Manager to edit one more file, called “flashfader.js” It’s in your “prophoto” theme folder. Open it up with WordPad or TextEdit, and you will see two places where it says ‘height=”250px” or something like that. Change the height to your desired height in both places. Save your changes and reupload the file, overwriting the one on your web server.

4. Step 4: If you’ve already uploaded images into your Flashfader management area that are not your desired height, you’ll need to delete them and reupload new ones. Also, if you uploaded images that were something other than 250px high while your settings were still set at 250px, Flashfader may have cropped them. So, if they’re still not showing up right, delete them and reupload them.

5. Step 5: Empty your browsers cache and check your work.

Helpful related resources:
Using an FTP program
Using a web-based file manager utility

Questions? Leave them in the comments instead of emailing for support so everyone can benefit from the clarification.

How do I create 980 x 250 px images for the header?

Saturday, March 1st, 2008

Some people get confused when trying to create images that are 980 pixels wide by 250 pixels high for the header area masthead or Flashfader images.

One common thing I hear is that people can’t figure out how to get them sized that way, because whenever they try to set one of the dimensions, it screws up the other dimension.

Basically, you’re not just resizing when you’re trying to make images into these dimensions, you’re cropping.  If you try to just resize and leave the box “constrain proportions” checked, you’ll never get it to work, because most photos are a 2:3 ratio, and 980×250 is a different ratio.

So, if you’re trying to make a single image into a header image, I would recommend FIRST just resizing the image so that the width is 980px and let the height be whatever it will be.  THEN use the crop tool to crop out a 250px tall section of the image.  Here’s what the crop tool looks like in Photoshop:

This will create a very “panoramic” look, and can be quite cool. You get some unique crops when doing this, like below, from Joel Llacar’s website:

Or, if you want to make a collage-type multiple-images-in-one-image look, then resize a bunch of images to 250px tall and let their width be whatever.  Then create a new file in Photoshop with the dimensions of 980×250px, and copy those image into it and play around with it in there.

Below is an example of such an image I created in Photoshop.  Click on it to view and/or download the full-sized version.  You can see that even though it looks like one image, it is actually several images made into one.

Some people get confused when trying to get their Flashfader to look like this and think they can upload a bunch of little images of varying widths, but you can’t.  You have to create composite images out of the small images first, like the one shown above, with the exact dimensions of 980px by 250px.

FAQ: Help, my flash fader header images are tiny!

Saturday, February 23rd, 2008

If you uploaded correctly-sized (980px x 250px) images for your flash fader header slideshow, and they are showing up tiny, follow these steps to fix it:

1. In your Flashfader management area (under “Manage” –> “Flashfader”) make sure you have set the dimensions correctly to 980 width and 250 height and click “Save”, as shown below:

2. Then, DELETE the images you already uploaded by clicking the “Delete” button next to them, shown below. (You have to delete them because if you uploaded them with the wrong settings, Flashfader actually crops the images while they are being uploaded).

3.  Then, upload your images again.

4. Finally, you’ll have to force your browser to empty its cache before you can see the changes in your blog.  In Firefox, this is done by going to “preferences” –> “privacy” –> “private data” –> “clear now.”   In Safari,  just go to the “Safari” menu and choose “Clear cache…”.  In Internet Explorer, go to “Tools” –> “Internet Options”  –> “General” –> “Browsing History” — “Delete…”.

Related Post:  Why can’t I see changes to my Flashfader header slideshow

I changed images in my flashfader flash movie, but I don’t see the changes in my browser. What’s wrong?

Saturday, February 2nd, 2008

Q: I changed images in my flashfader flash movie, but I don’t see the changes in my browser. What’s wrong?

A: When you are adding or subtracting new images from your flash movie, you may not see your changes immediately. This is because many browsers “cache” .swf files. English translation: many browsers download and save flash movies in a temporary folder to speed page loads. Your browser may be using an old version of your flash movie. To get around this, you can just wait a couple days, test in another browser, or force your browser to empty its cache.  The option to force the browser to empty its cache can often be found in preferences, or options, or privacy, or something like that.