Personal Development for Smart People^TM Forums

Cassie · 06-21-2007, 01:11 AM

Does anyone know how to implement a .zip file containing a logo and a banner containing text links into a Wordpress main page header? I'm a bit lost where to begin shuffling these files.

Scin · 06-21-2007, 01:50 PM

You'll need to modify your template file to do that. There is a .tpl file you'll need to edit and maybe a couple other files...I'll look into it.

unicorn · 06-22-2007, 11:47 PM

First you need to extract the files within the .zip file to the theme directory. It is located under wp-content/themes/name-of-your-theme.

Image files within the .zip file should be put in the img directory of your theme-directory. Image files are those ending in .gif or .jpg normally for web-use. You are not saying whether the logo and banner are image files. If they are not, they are probably html code that needs to be pasted into the file header.php in the theme directory.

You should open your theme dirctory and look for a file called header.php and styles.css. Open those ones in a regular text-editor (not MSWord, but notepad, textpad, ultraedit or something like that.

In styles CSS look for a section with the name #splash. This is a wordpress function for images in headers. It should look something like this:

#splash {
background:url(img/someimagename.jpg) no-repeat center;
height:160px;
width:900px;
border:#ddd 3px solid;
margin:10px auto; /*Splash's redeclared in functions.php for WP 2.1 */
}
Change this line
background:url(img/yourimagename.jpg) no-repeat center;
(or use left or right according to where you want to place the image. You may also want to adjust the height and width to have it match the size of your picture, or at least get a proportional scaling.

If you don't find the #splash definition in your styles.css, the just copy the one above and put it in with the name of your imagefile instead of someimagefile.jpg.

You cannot use two images as background. If you have gotten two image files you may want to put them together in an image-program, or you will need to place the other directly in the code of the header file.

To get the background image into the header file where you want it, you need the following line in the file header.php:

<div id="splash"></div>

To get the placement where you want it experiment with putting it in the order of the other <div> tags by just putting it in, then load you blogsite and see how it looks, move it around until you are satisfied with the placement.

If your banner or logo is another type of file containing some code, you need to paste that code into the header.php where you want it to display compared to the other elements in the header. Make sure you stay inside of the <body> tags unless the code specifies some script to go in the <head>section.

If you have two images you can put the one that is not in the #splash div inside any of the other divs or create a new div for it.

If you are not familiar with tags and html, I recommend going to this site:
HTML Goodies It has a good reference and lots of articles that can be understood with little background knowledge.

06-21-2007, 01:11 AM	#1 (permalink)
Cassie Senior Member Join Date: Nov 2006 Location: New York Posts: 212	Using a banner with Wordpress Does anyone know how to implement a .zip file containing a logo and a banner containing text links into a Wordpress main page header? I'm a bit lost where to begin shuffling these files.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Wordpress and Adsense	Nahush	Business & Financial	6	12-17-2007 08:19 AM
Wordpress Errors on my Blog	troque23	Technology & Technical Skills	4	06-25-2007 05:52 AM
Very New to Wordpress	jamestl2	Technology & Technical Skills	7	05-28-2007 05:43 AM
Stop WordPress Spam	Adam	Technology & Technical Skills	5	12-12-2006 05:42 PM
WordPress RSS Help	DanielBrenton	Technology & Technical Skills	2	11-11-2006 10:12 PM

06-21-2007, 01:50 PM	#2 (permalink)
Scin Member Join Date: Jun 2007 Posts: 69	You'll need to modify your template file to do that. There is a .tpl file you'll need to edit and maybe a couple other files...I'll look into it.

06-22-2007, 11:47 PM	#3 (permalink)
unicorn Member Join Date: Jun 2007 Location: Oslo, Norway Posts: 51	First you need to extract the files within the .zip file to the theme directory. It is located under wp-content/themes/name-of-your-theme. Image files within the .zip file should be put in the img directory of your theme-directory. Image files are those ending in .gif or .jpg normally for web-use. You are not saying whether the logo and banner are image files. If they are not, they are probably html code that needs to be pasted into the file header.php in the theme directory. You should open your theme dirctory and look for a file called header.php and styles.css. Open those ones in a regular text-editor (not MSWord, but notepad, textpad, ultraedit or something like that. In styles CSS look for a section with the name #splash. This is a wordpress function for images in headers. It should look something like this: #splash { background:url(img/someimagename.jpg) no-repeat center; height:160px; width:900px; border:#ddd 3px solid; margin:10px auto; /Splash's redeclared in functions.php for WP 2.1 / } Change this line background:url(img/yourimagename.jpg) no-repeat center; (or use left or right according to where you want to place the image. You may also want to adjust the height and width to have it match the size of your picture, or at least get a proportional scaling. If you don't find the #splash definition in your styles.css, the just copy the one above and put it in with the name of your imagefile instead of someimagefile.jpg. You cannot use two images as background. If you have gotten two image files you may want to put them together in an image-program, or you will need to place the other directly in the code of the header file. To get the background image into the header file where you want it, you need the following line in the file header.php: <div id="splash"></div> To get the placement where you want it experiment with putting it in the order of the other <div> tags by just putting it in, then load you blogsite and see how it looks, move it around until you are satisfied with the placement. If your banner or logo is another type of file containing some code, you need to paste that code into the header.php where you want it to display compared to the other elements in the header. Make sure you stay inside of the <body> tags unless the code specifies some script to go in the <head>section. If you have two images you can put the one that is not in the #splash div inside any of the other divs or create a new div for it. If you are not familiar with tags and html, I recommend going to this site: HTML Goodies It has a good reference and lots of articles that can be understood with little background knowledge.

Personal Development for Smart PeopleTM Forums

Personal Development for Smart People^TM Forums