Background image.

User 173811 Photo


Registered User
10 posts

Hi,
I am creating a site with a background that has a color, not an image. I would like to be able to insert a nice image to spruce it up. Currently the css for the background looks like this:
/* Layout Elements */

body.grid-1 {
background-color: rgba(222, 19, 19, .6);
}

Does anyone know how to do this? Thanks! Elaine

This is the temporary location of the site:

http://pro-techconsultants.com/pro-vital/

User 2088758 Photo


Senior Advisor
2,722 posts

Yes you can but you have to do this after you export your project. I would create a custom.css file and store it in the same folder as your other css files. Then just modify the row you are working on and add the image. If you need a more detailed explanation let me know.
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
User 187934 Photo


Senior Advisor
18,767 posts

What kind of image are you trying to use? One that needs to repeat or one single image that will fill the body?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

Here's my S-Drive site with
examples of what can be accomplished in VSD.
https://progrower.coffeecup.com/
Here's my CoffeeCup SCCP Shop with examples of what can be done.
https://progrower.coffeecup.com/shop/
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 173811 Photo


Registered User
10 posts

Hi Steve,
Sorry for sounding like a beginner, but I am. :rolleyes:
I do already have a custom css for my google map. I guess I could do a custom2 css? I have exported the file, so now I have to figure out how to alter the html to accommodate a background image. Currently my css looks like this to give me a color background:

/* Layout Elements */

body.grid-1 {
background-color: rgba(222, 19, 19, .6);
}

And when I try to apply an image it wipes everything out. So, I am doing something very wrong!! :)
Eric,
I just want to have some kind of a texture background. I am open to purchasing something on istock. I am pretty sure I don't want it to repeat. I am attaching and image that I would like to work, but don't think it is big enough.
Thank you!! Elaine
Attachments:
User 2147626 Photo


Ambassador
2,942 posts

Someone else will have to tell you how to do it, I don't code. But if you like it, you are free to use this . . .
http://gunsmoke.me/cloud/graphics/grey-back.png

If you would like to see some other sample backgrounds, checkout http://gunsmoke.me/gfh/files.php
After selecting a file to download, just select to continue as guest. You do not need to register to download.
Graphics for the web, email, blogs and more!
-------------------------------------
http://sadduck.com
User 173811 Photo


Registered User
10 posts

Oh, wow, that's nice! Thanks!:cool:
User 187934 Photo


Senior Advisor
18,767 posts

If your going responsive then using a single image and stretching it gets a little tricky as far as what image you can get away with. Using a repeating image is easy and there's plenty available on the net.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

Here's my S-Drive site with
examples of what can be accomplished in VSD.
https://progrower.coffeecup.com/
Here's my CoffeeCup SCCP Shop with examples of what can be done.
https://progrower.coffeecup.com/shop/
This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2088758 Photo


Senior Advisor
2,722 posts

Hi Lainsky,

For your enjoyment just finished it! How to add a background image to Responsive Layout Maker.
http://youtu.be/Ypi_D6H8HAI

Hope this helps.
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
User 173811 Photo


Registered User
10 posts

Hi Steve,
Thank you so much for making the video, it is really helpful. I do have some more questions though.
1) If I go back to RLMP to make changes, I will lose all of the content and images that I have placed, I am wondering if I can just alter the html to get the effect I am looking for?
also
2) I want the background image to apply to the entire grid, not just a row. It would make sense to me that I should be able to add the background image and settings of the image right after the "body.grid-1 { " and replace the background color with my new background image and settings. This doesn't work though, so I must be missing something.
I will go back and re-watch the video.
Thanks again for making the video! You guys are awesome!



User 173811 Photo


Registered User
10 posts

I just noticed that I have two references to the background in my main css:

body.grid-1 {
background-color: rgba(222, 19, 19, .6);
}
body.whole-background {
background-color: rgba(222, 19, 19, .65);
}

Would it be ok if I put the background image where the color is in both?
Thank you,
Elaine

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.