Creating a Header / Banner

Hi, 2 questions. I am hiring someone to do 2 jobs for me. The first job is that I am hiring someone to make a banner for my classiccraft website. Here is a link:

The second job is that I need them to upload it to my site. This person will make it go live on my site.

Here are my 2 questions. Please answer both questions. Sometimes, only 1 question is answered.

Question 1: What instructions should I give the person making the banner? What size should I tell him to make it? What other instructions do I need to give? What exactly should I write technically? What do they need to know? What instructions would you give if you had this theme and needed a header / banner? What format of file? Size of file etc…… PLEASE TELL ME WHAT TO SAY TO THIS PERSON. I WANT THIS TO BE A SMOOTH PROCESS. PLEASE BE AS DETAILED AS POSSIBLE SO THERE IS NO CONFUSION BETWEEN ME AND THE GRAPHIC DESIGNER.

Question 2: What instructions do I need to give them in order to upload it to my site and make it live? PLEASE BE AS DETAILED AS POSSIBLE SO THERE IS NO CONFUSION BETWEEN ME AND THE PERSON UPLOADING THIS TO MY CLASSICRAFT THEME.

Thank you very much. This will help me greatly. And please remember, I will copy / paste your response to my graphic designer so please be as detailed as possible. I want them to understand you correctly the first time.

 

Hello,

1. Make banner size of 1000px X 300px, make lightweight png image.
2. Make banner image i will help to upload that banner to your site.

Thanks & Regards
Yogesh Bhade

 

The banner is finished. How can you help me upload it?

 

Hello,

Upload your image in dashboard and use following css to make it header background.

Code:

.top_header {
background: url('image url');
}

Enter image url in above code like as background: url(images/banner.png)
It will resolve your issue.

Thanks & Regards
Yogesh Bhade

 

I have made the changes but it looks weird on my cell phone. Also, there is a big space above the header?

 

Header must be a PNG? I uploaded a PNG.

 

Hello,

You can upload any format of images.(like jpg, png etc.)
Delete important from following code of your Custom CSS.

Code:

.menu_wrapper{
margin-top:300px !important;
}

Make it only

Code:

.menu_wrapper{
margin-top:300px;
}

Then add following css code in Custom CSS.

Code:

@media only screen and (max-width: 960px) and (min-width: 768px){
.menu_wrapper {
margin-top: 235px;
}
}
@media only screen and (max-width: 767px) and (min-width: 480px){
.menu_wrapper {
margin-top: 150px;
}
}
@media only screen and (max-width: 480px){
.menu_wrapper {
margin-top: 90px;
}
}

It will resolve your issue.

Thanks & Regards
Yogesh Bhade

 

It still looks the same. I have created a temporary admin. Can you help me with this from the backend?

 

Hello,

You have used following code in Custom CSS, just delete height: 300px !important; line from your Custom CSS.

Code:

div.header {
background: url("http://earthpossible.com/wp-content/uploads/2014/09/header.jpg") no-repeat scroll 0 0 rgba(0,0,0,0) !important;
height: 300px !important;
background-size: 100% auto !important;
}

It will resolve your issue.

Thanks & Regards
Yogesh Bhade

 

I did everything that you said. For some reason, now at the moment…. the website is not loading.

 

Do you offer support where I can paypal you to upload the header?

 

Actually, my server is down. I will wait

 

Here is a new screen shot. The banner is not appearing

 

Hello,

Your issue have been fixed. Please visit your site.

Thanks & Regards
Yogesh Bhade

 

I visited the site on my computer and my cell phone. It still is not working. I see a blank space. This is the file for the original jpeg if you can upload it.

 

Hello,

Your website is working great, see video on following link.
http://screenpresso.com/=mJSQ

It might be cache problem, so please clear your browser cache & cookies, use Ctrl+f5 button to clear cache from browser.

It will resolve your issue.

Thanks & Regards
Yogesh Bhade

 

Thank you for the video. However, I clear the cache & cookies and I still see a blank space above. I do not see what I saw in the video. I am using Safari and a Galaxy 2 phone if that helps.

 

Hello,

Paste the code given below in Custom CSS section
(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

div.header {
width: 100%;
padding-top: 1px;
}

It will resolve your issue.

Thanks & Regards
Yogesh Bhade