Jump to content


Add background image for body and branding


28 replies to this topic

#1 smilecoffe

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 11 December 2011 - 04:20 AM

I found a lot of topic how to add a background image but I still can't add background image for body and branding.

But do I need to upload the background image to forum folder and link to it or can I just use a Photobucket link?
And can I add background image on the branding and have a logo at the same time? Like 2 layers of image on the header

Can anyone help me? :(

#2 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 12 December 2011 - 10:33 PM

Adding an image as a background is not so simple task.

You can't add an image of fixed dimensions as it would look different in different screen resolutions.
That's why most skins use just colored backgrounds instead of an image background.

In case of branding background you'd have to create a specific image which would have to be 64px in height and being repeatable horizontally so we can use "repeat-x" CSS value.

In case of a whole page background the image would have to be repeatable horizontally and vertically so we can use "repeat-x" and "repeat-y" CSS values.

For instance switch here to "Paradox" skin to see how it looks>
Here is a code from that skin:

Posted Image

Skin's author created 422x420 image, which as you can see has a random pattern so it can easily be repeated horizontally and vertically.

#3 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 03:54 AM

I still don't get it :(

here is the code for branding and body I set

Quote

#branding {
background: #0f3854 url('http://haehyukjj.com/public_html/admin/setup/public/images/branding_bg1.png') repeat-x;
border-bottom: 1px solid #1b3759;
min-height: 120px;
}
as you said I must have an image has 64px height so I think I might change the value

Body

Quote

html, body { /* Safari has trouble with bgcolor on body. Apply to html tag too. */

background-image: url(http://i631.photobuc...n/backgound.png) repeat scroll 0 0;
color: #5a5a5a;
}

body {
font: normal 13px helvetica, arial, sans-serif;
position: relative;
}


#4 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 04:11 AM

You can't host background image just somewhere.
You need to upload that image to your board through FTP.

What's your board address?

#5 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 04:40 AM

I tried upload to my board with the branding background but it also doesn't work :(
my board address is http://haehyukjj.com
and this is where I uploaded the image http://haehyukjj.com...randing_bg1.png
is that right?

#6 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 05:39 PM

Link to the image doesn't work.

#7 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 10:15 PM

then what should I do?

#8 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 10:16 PM

What image do you want to add as a background?

#9 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 10:44 PM

this one
Posted Image

#10 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 10:52 PM

You have to upload it to your board through FTP and include proper path in CSS value.

#11 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 11:05 PM

I did upload the image to my board
But it's still not work that I think it's weird
can you give me an example of the CSS? :(

#12 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 11:19 PM

You did something wrong with uploading.
Your background CSS code still reads this:


Quote


html, body {


background: none repeat scroll 0 0 #EBE7AB !important;
color: #5A1E0A;
}


Look at my Paradox skin CSS code:



Quote


html, body {


background: url("http://www.smartestcomputing.us.com/public/style_images/Paradox/body.jpg") repeat scroll 0 0 #444444;
color: #BBBBBB;
}


which means that you have to:
- upload your background image (backgound.png) to:
/public/style_images/2HJJ (or whatever is the exact name of your skin) folder
- adjust CSS code so it reads:

html, body {


background: url("http://haehyukjj.com//public/style_images/2HJJ.../backgound.png") repeat scroll 0 0;
color: #5A1E0A;
}

#13 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 13 December 2011 - 11:44 PM

I give up TT^TT
nothing change even I did exactly what you said Mr. Broni D;
I wish I could find someone do this job for me TT^TT

#14 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 13 December 2011 - 11:59 PM

PM me with the access to your FTP.

#15 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 14 December 2011 - 01:04 AM

You're almost there.
You seem to have two settings for the background:



Quote

html, body {


background: none repeat scroll 0 0 #FFFFFF !important;
color: #4E200D;
}

and




Quote




html, body {


background: url("http://haehyukjj.com/public/style_images/Christmas_v__01/branding_bg1.png") repeat scroll 0 0 transparent;
color: #5A5A5A;
}


The second one is correct.
Remove the first one.

#16 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 14 December 2011 - 06:19 AM

can you test it for me?

#17 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 14 December 2011 - 10:29 PM

I don't think you did anything. Still the same.

#18 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 14 December 2011 - 11:28 PM

that's why I ask you ;(
I did everything but it's not show any differences

#19 Broni Re: Add background image for body and branding

    Malware Annihilator

  • 24,883 posts
  • Joined: October 04, 2004
  • 1,860 topics
  • Age: 57
  • Skin: IPBoard wide
  • Local time: 07:51 AM
  • Zodiac:Virgo
  • Gender:Male
  • Location:Daly City, CA
  • OS:Windows Vista
  • Country:
Offline
  • Time Online: 57d 10h 30m 28s

Posted 14 December 2011 - 11:29 PM

Can you give me an access to your ACP?

#20 smilecoffe Re: Add background image for body and branding

    Member

  • 39 posts
  • Joined: August 17, 2011
  • 4 topics
  • Skin: IP.Board
  • Local time: 06:51 AM
  • Zodiac:Leo
  • OS:Windows 7
  • Country:
Offline
  • Time Online: 1d 13h 51m

Posted 15 December 2011 - 12:08 AM

the account I gave you already have ACP access





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users


This topic has been visited by 8 user(s)