How to add background image in Protostar?

[shukat1]

Here is my website link: http://mobilephonehistory.site/

Been trying to add he image in for ages but cant do it someone please help!

My code from line 190 to 197 isn't being recognized?

body {
margin: 0;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 13px;
line-height: 18px;
color: #333;
background-color: #fff;
background-image: url('/images/iphone');

[Mr. Wimpy]

Change the line for background-image to:

Code: Select all

background-image: url('/templates/protostar/images/iphone.jpg');

- I added '/templates/protostar' to the url
- I added .jpg as file extension

[shukat1]

Change the line for background-image to:

Code: Select all

background-image: url('/templates/protostar/images/iphone.jpg');

- I added '/templates/protostar' to the url
- I added .jpg as file extension

Hi, ive added it in but its still not picking it up? Does my code seem right? Never been good at css

[Mr. Wimpy]

Line 7130 body.site overrides the background-image of body (line 190).
You either need to remove that background-image from body.site or add the above changes as well.

Can I give you another advice: it looks like you are editing the Protostar template.
This template comes with Joomla by default and with the next update your changes will be lost.

Either add the changes to user.css or make a copy of Protostar and edit that.

Copying protostar:
1. Copy the folder protostar (i.e. protostar2)
2. Open protostar2/templateDetails.xml edit the name to protostar2
3. In Joomla admin, go to Extensions > Manage > Discover
4. You should see protostar2 template, select and click Install
5. Go to Extensions > Templates and set protostar2 as default

Regards,
Wim

[shukat1]

Line 7130 body.site overrides the background-image of body (line 190).
You either need to remove that background-image from body.site or add the above changes as well.

Can I give you another advice: it looks like you are editing the Protostar template.
This template comes with Joomla by default and with the next update your changes will be lost.

Either add the changes to user.css or make a copy of Protostar and edit that.

Copying protostar:
1. Copy the folder protostar (i.e. protostar2)
2. Open protostar2/templateDetails.xml edit the name to protostar2
3. In Joomla admin, go to Extensions > Manage > Discover
4. You should see protostar2 template, select and click Install
5. Go to Extensions > Templates and set protostar2 as default

Regards,
Wim

What will happen if i don't update my Joomla version will it stay? Its only for uni. How often do they update?

[shukat1]

Line 7130 body.site overrides the background-image of body (line 190).
You either need to remove that background-image from body.site or add the above changes as well.

Can I give you another advice: it looks like you are editing the Protostar template.
This template comes with Joomla by default and with the next update your changes will be lost.

Either add the changes to user.css or make a copy of Protostar and edit that.

Copying protostar:
1. Copy the folder protostar (i.e. protostar2)
2. Open protostar2/templateDetails.xml edit the name to protostar2
3. In Joomla admin, go to Extensions > Manage > Discover
4. You should see protostar2 template, select and click Install
5. Go to Extensions > Templates and set protostar2 as default

Regards,
Wim

Sorry for being a noob but would I just create a new css file called user.css and. Copy and paste all that in from the template.css? Would I need to do anything else or will it recognise the new css file itself? Would I have to join it with anything? Thank you

[sozzled]

Sorry for being a noob but would I just create a new css file called user.css and. Copy and paste all that in from the template.css? Would I need to do anything else or will it recognise the new css file itself? Would I have to join it with anything?

See also viewtopic.php?f=706&t=961035&p=3520523#p3520523

No, you don't have to join anything. Protostar will detect and use the CSS contained in the file user.css if that file exists. It's automatic.

[Per Yngve Berg]

Mod. Note: Relocated the topic to the Templates Forum.