The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How do I enlarge the size of Banner in the Header?

View previous topic View next topic Go down

Solved How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 25th 2013, 11:08 pm

Been looking all over this forum on how to do this and still am clueless.  Is it done in CSS?

Here is a link to my forum... http://thesimmerssociety.forumotion.com/forum

Thank you.

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by SLGray on August 25th 2013, 11:14 pm

You will have to edit the image to enlarge it.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35670
Reputation : 2375
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 25th 2013, 11:19 pm

We have tried different sizes of the image from 1008x175, 1220x220 and 1000x300. No matter which size, it remains the same.

Any recommendations for sizes?

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by bulfrog on August 26th 2013, 12:55 am

I've been working on using different sizes for this site and I'm wondering if there is some max/min or scaling that might need adjusted in the coding?

We can get it large on one computer but then it's very distorted on other computers and devices.

Thank you for any help. We are trying to launch and this is our last major hurdle.

bulfrog
New Member

Posts : 2
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 1:24 am

You can remove the header image in AP>>Display>>Pic management and add this code below to your CSS stylesheet:

I already placed your banner image in this code below.

AP>>Display>>Colors>>CSS Stylesheet:
Code:
#pun-intro {
background-color:#666;
background-image:url(http://i70.servimg.com/u/f70/17/30/92/29/trytry10.jpg);
background-repeat:repeat no-repeat;
text-align:center;
background-size:cover;
margin:0;
padding:1.5em 1em 1em;
}

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 1:34 am

Hi runawayhorses. Thanks for the coding, but not sure I am understanding properly.

Here is the image we are wanting to use -http://i779.photobucket.com/albums/yy71/Peacemaker_ic/TSS%20banner%20challenge/Cityscape/12_zps7f9cb139.jpg~original

Also, we will switch up banner pics monthly. Can you tell me how I could switch them myself?

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 1:41 am

Hi, Ok I changed the banner image to your other one, try this code below. You can change it at anytime by changing the URL of the image in the code, its after url("

Code:
#pun-intro {
    background-color: #666666;
    background-image: url("http://i779.photobucket.com/albums/yy71/Peacemaker_ic/TSS%20banner%20challenge/Cityscape/10_zps9c9848b3.jpg");
    background-repeat: repeat no-repeat;
    margin: 0;
    padding: 1.5em 1em 1em;
    text-align: center;
    background-size: cover;
}

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 1:44 am

That is awesome, but it is showing up as a sliver. The width is perfect, but the height is off.

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 1:48 am

Ok, I added a minimum height property to the code, try this new code now:

Code:
#pun-intro {
  background-color: #666666;
  background-image: url("http://i779.photobucket.com/albums/yy71/Peacemaker_ic/TSS%20banner%20challenge/Cityscape/10_zps9c9848b3.jpg");
  background-repeat: repeat no-repeat;
  margin: 0;
  padding: 1.5em 1em 1em;
  text-align: center;
  background-size: cover;
  min-height: 175px;
}


Last edited by runawayhorses on August 26th 2013, 1:56 am; edited 1 time in total (Reason for editing : fixed code)

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 1:53 am

Loving the look, but got this error...


kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 1:55 am

Sorry my mistake I added too many brackets to the code. remove the old code and replace with this code below, this will work fine:

Code:
#pun-intro {
background-color:#666;
background-image:url(http://i779.photobucket.com/albums/yy71/Peacemaker_ic/TSS%20banner%20challenge/Cityscape/10_zps9c9848b3.jpg);
background-repeat:repeat no-repeat;
text-align:center;
background-size:cover;
min-height:175px;
margin:0;
padding:1.5em 1em 1em;
}

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 1:59 am

Works like a charm! Thank you ever so much! Very Happy

One more question though...what do you recommend being the picture dimensions?

Every month we hold a banner pic contest and I'd like to know what to tell members.

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 2:02 am

You're welcome!

I'd stick with that size you have now which is 1008 wide by 175 high.

Looks good! Very Happy


runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 2:03 am

Thanks again!!! I really appreciate it! Very Happy

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by bulfrog on August 26th 2013, 2:11 am

Yes, Thank you very much!

bulfrog
New Member

Posts : 2
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by runawayhorses on August 26th 2013, 2:12 am

OK, you're very welcome! Smile

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by kimwriter75 on August 26th 2013, 2:15 am

Topic is solved. Very Happy

kimwriter75
Forumember

Posts : 30
Reputation : 1
Language : English

Back to top Go down

Solved Re: How do I enlarge the size of Banner in the Header?

Post by SLGray on August 26th 2013, 2:31 am

Topic Solved & Archived


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35670
Reputation : 2375
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum