WebRing's Blog -  - 
|
Thu, Oct 1st - 11:06AM
Transferred Site Repair Tutorial #2 - Backgrounds
In the last tutorial, we went over the steps of identifying the remaining GeoCities links in your transferred site.
Now it's time to fix those links. Today, we will address the repair of your background images.
How to Assess Your Background Needs
Not everyone will need to change their backgrounds. You will not need to fix any of your background elements if...
- Your site has a solid color background.
- Your background image is one that you uploaded.
Not sure if you uploaded the image or used one provided by GeoCities? No need to worry; we'll cover that in the next step.
How to Identify Background Elements
It's time to open up your CMS and start searching for your remaining GeoCities background elements. For those just joining us, you'll want to read the previous tutorial: Transferred Site Repair Tutorial #1 - Links
Once you have your first page that needs editing open in your CMS, open your browser's Find function. Did it? Good. Now we're ready to proceed.
Enter "geocities" into the Find box of your browser, then click the Next button. This should highlight the first remaining GeoCities link in your site.
In the example below, we have accessed file/page "index.html" and found this GeoCities background:
This is exactly the link we need to address. Let's look at the different elements of this piece of code:
- "background=" - This is a tag that tells your page where to look for the image that will be used to create the page's background.
- "geocities.com" - This tells you that the background image is being called up from GeoCities' servers.
- "/clipart/" - This is the clear indicator that this isn't just an image that our transfer utility failed to copy. The associated image is part of GeoCities' available standard graphics.
Since we found "geocities.com" and "/clipart/" in this page's code, we will now need to repair the link with something more permanent.
What to Do about the GeoCities Background
Next, we need to figure out what we want to replace the background image with. You really have three options:
- Remove the image and use a solid background color instead.
- Find a replacement image for the background.
- Create a replacement image for the background.
In this case, the page uses an image that is unique to GeoCities. This means that finding a replacement background image won't be easy. So, we'll go ahead and use the easiest fix in our arsenal...
Replace Image with a Colored Background
Nothing makes for a quicker and satisfying fix as removing the background image and using a solid color for your background.
To make this change...
- Highlight and delete all of this line: background="www.geocities.com/clipart...crane2.gif"
- Change the letters and numbers that follow "bgcolor=" to the color of your choice. (Here's a site that makes finding a color's code easy: http://html-color-codes.info/)
- Click the "Save" button found at the bottom of the CMS edit window.
For this example, we will turn this...
into this...
After you've made a similar change to your page, you should refresh (F5) your browser window to view the change to your site.
Here's altonbcc's site before making the change:
After deleting the background image and changing the bgcolor to "#E6E6E6," here's what the site looks like:
Replace the Background Image
Don't want a plain color for a background? Then you'll need to search the web for some free images that you can use. There are many such services out there.
What you do with the images once you find them depends on the service providing them.
For those services that require you link to their images (known as "hotlinking"), you will simply change the "background=" URL to the place where the image is hosted.
For those services that require you to host the image on your own servers, here's what you need to do:
- Close your CMS edit window.
- Click the Upload icon
 in your CMS. This will open a new upload window. - Follow the instructions to upload the image to your Webspace folder. Once you upload the image, move to the next step.
- Re-open your CMS edit window for the page you're editing.
- Replace the GeoCities "background=" URL with the name of your image's file (ex. "clouds.jpg"). If you stored your image in a subfolder, like "images," then you'll need to precede the file name with the folder name (ex. "images/clouds.jpg").
- Click the CMS edit window "Save" button and view the changes.
To find free replacement images, you should consider searching the many rings dedicated to free graphics on WebRing.
A Resource Challenge
Consider yourself savvy at finding the free graphics for use on websites? We challenge you to design a single page on your Webspace that lists and reviews at least 10 free graphics sites. For details, visit Webspace Resources.
Create a Replacement Background Image
If you're even mildly talented with any of the copious graphics programs out there, like Photoshop or Paint Shop Pro, then you have the ability to craft your own unique background images.
Once you've created a new background image, follow the steps above to replace your GeoCities image with the new one.
If you are a graphic designer who has images they would like to see all over the web, contact us at membership@webring.com. Make the subject line "Graphics for Webspace." We'll make it worth your while.
Next, we will bring you "Transferred Site Repair Tutorial #3 - Buttons"
Comment (0)
|
|
|
| October 2009 |
| |
|
|
|
1
|
2
|
3 |
|
4 |
5
|
6 |
7
|
8 |
9 |
10 |
|
11 |
12 |
13 |
14 |
15
|
16 |
17 |
|
18 |
19 |
20 |
21 |
22 |
23 |
24 |
|
25 |
26 |
27 |
28
|
29 |
30 |
31 |
|
prev
|
|
next
|
|
Invite
What's New |
Popular |
Auctions |
Blogs |
Webspace |
Shoutbox |
Forums |
TopicCraze |
Newsletter |
Contact Us