• 0

How to Add a Site Background Image Inline


Question

Posted · Report post

I am trying to add a background image for my site inline so I can assign a class and use some css and JavaScript to adjust its size and center positioning on the fly according to browser size. For the life of me I can't figure out how to add it it inline. Can someone please clue me in on how, where and what code to use to accomplish adding the image inline?

I already have the css code and JavaScript code, only need inline code and where to enter it.

Share this post


Link to post
Share on other sites

1 answer to this question

  • 0

Posted · Report post

Hi, 

 

Far be it from me to tell you how to design your site, but I think the method you're using could lead to other, more serious issues down the line.

 

With DMS, which is already designed to be responsive, out of the box, you just need to:

1.  Upload the image to Dashboard > Media > Add New.  When the image uploads, click "Edit" and you'll see, on the right, the URL for the image.

2.  Go to the site in Chrome, logged in, and click Custom Code.  Add the most basic CSS to include the background-image there, using the URL for the image. 

3.  The positioning should be done with CSS, not Javascript, as that is likely to break next time WP upgrades or it could cause conflicts elsewhere.  Moreover, it may not work on many browsers, including older browsers.  You can use CSS found here: http://www.w3schools.com/css/css_background.asp

4.  You can create browser specific CSS found here:  http://docs.pagelines.com/tutorials/browser-specific-css

 

The process is no more complicated than you described, and I think infinitely safer and browser-friendly.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now