ElkArte Community

Project Support => Support => Topic started by: pixer on January 02, 2015, 02:34:56 pm

Title: Add background image
Post by: pixer on January 02, 2015, 02:34:56 pm
Hello,
is possible add background image?
I use Elkarte default theme with simple portal
Thanks.
Title: Re: Add background image
Post by: emanuele on January 02, 2015, 02:47:18 pm
Hello pixer and welcome! :D

Ye, it's possible to change any background and use images if you want, but exactly which background do you want to change?
If you are referring to the most external one, you have to change it on body:
Code: [Select]
body {
background-image: url(.....);
}
Title: Re: Add background image
Post by: pixer on January 03, 2015, 06:23:23 am
I would change the home background image.

Emanuele, you have "Er Core SMF" come dicono i romani. as the Roman people say
where smf there is Emanule them  :P

Elkarte is a very good project :)
Title: Re: Add background image
Post by: emanuele on January 03, 2015, 04:43:23 pm
Quote from: pixer – I would change the home background image.
hmm...
I'm a bit lost. lol
You mean maybe the logo at the top then?

Quote from: pixer – Emanuele, you have "Er Core SMF" come dicono i romani. as the Roman people say
where smf there is Emanule them  :P
LOL
Benvenuto allora! :P

Quote from: pixer – Elkarte is a very good project :)
Thanks! :D
Title: Re: Add background image
Post by: pixer on January 04, 2015, 01:46:18 am
Like this with trasparent foreground.
(http://s23.postimg.org/juerhqf7b/index.jpg) (http://postimg.org/image/juerhqf7b/)

Or this with no trasparent.
(http://s16.postimg.org/411t3xzq9/index.jpg) (http://postimg.org/image/411t3xzq9/)

Thanks.
Title: Re: Add background image
Post by: emanuele on January 04, 2015, 06:13:23 am
Oh okay, then I got it the first time. ;D

You can apply the background to body as I showed you above, then if you want a transparent background...
You have to set it for #wrapper to begin with.
Then I'm not sure which one of the following:
.forum_category,
.forumposts,
.content_category
And some of the following as well:
Code: [Select]
.board_row,
.childboard_row,
.forumposts > div,
.forumposts > li,
.content_category > div,
.content_category > li

And you may (or may not, depends) add some transparency here as well:
Code: [Select]
#top_section

But I'm not really good with CSS...
Title: Re: Add background image
Post by: pixer on January 04, 2015, 06:37:57 am
Thanks for answer but i dont code expert  :-[
can you explain me?

Thanks.
Title: Re: Add background image
Post by: emanuele on January 04, 2015, 07:46:39 am
I'm not a css expert either.

I think something like that may give you some hints:
Code: [Select]
body {
background-image: url(.....);
}

.forum_category,
.forumposts,
.content_category {
opacity: 0.6;
}

.board_row,
.childboard_row,
.forumposts > div,
.forumposts > li,
.content_category > div,
.content_category > li {
opacity: 0.6
}
Title: Re: Add background image
Post by: meetdilip on January 04, 2015, 08:24:33 am
Welcome @pixer
Title: Re: Add background image
Post by: pixer on January 04, 2015, 01:23:46 pm
@Emanuele you are not expert but you are my master  :)
the my final code is this i hope to help someone else:
i open portal.css in theme/default/css because i use simple portal
Code: [Select]
body {
background-image: url(http://www.mysite.com/folder/image/bg.jpg);
}
#top_section,          /* for header section*/
.wrapper,               /* and this for real opacity if i dont add this the color is only clear and not trasparent */
.childboard_row,
.category_boards,
.forumposts > div,
.forumposts > li,
.content_category > div,
.content_category > li {
opacity: 0.9;
}
but i have another little question:
if i use 0.9 for opacity is ok but not perfect, if i use 0.9.5 the opacity gone, if i use 1.0 gone again,
what value should i use?

Thanks @meetdilip  :)
Title: Re: Add background image
Post by: emanuele on January 04, 2015, 03:30:49 pm
Probably you added a dot more than necessary? 0.95 instead of 0.9.5?
Title: Re: Add background image
Post by: pixer on January 05, 2015, 02:11:24 am
This morning my first thought just wake up has been to parameter 0.95, and then on the forum I read your answer. :)

Now is perfect! 8)

Thanks.
Title: Re: Add background image
Post by: emanuele on January 05, 2015, 11:56:34 am
:D