Home Forums Porto Template background image for boxed version

This topic contains 7 replies, has 2 voices, and was last updated by  Support2 5 months ago. This post has been viewed 236 times

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #10026529

    kkc
    Participant

    Hi,
    I been trying to get a background image working on the boxed version of portfolio#4. No luck so far. Tried this is the custom css:
    body {
    background: url(img/patterns/gray_jean.png);
    background-size: cover;
    background-position: center;
    }

    html {
    background: url(img/patterns/gray_jean.png);
    }

    Any help would be appeciated


    #10026532

    kkc
    Participant

    I said Portfolio#4 in my last post – should read Corporate4


    #10026534

    Support2
    Keymaster

    Hello,

    You need add the background code only at <html> tag:

    html {
        background: url(img/patterns/gray_jean.png);
    }

    Please, try that and let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


    #10026537

    kkc
    Participant

    I removed it from the body tag and now it’s just in html tag in the custom.css and it’s not working.


    #10026544

    Support2
    Keymaster

    Hello,

    Right, in that case probably the path of image it’s incorrect. Do you changed the folder structure of the template ?
    Check if the image “gray_jean.png” it’s on “img/patterns/” folder.
    Also check if the body it’s with background-color: transparent, you can check it using the Developer Tools of browser and inspecting the element.

    If the problem still persist, please send a online link of your website for us, so we can inspect your code and check why the image it’s not showing for you.

    Kind Regards,

    Rodrigo.


    • This reply was modified 5 months ago by  Support2.
    #10026546

    kkc
    Participant

    Hi Rodrigo,

    I checked for the image, it’s in the correct folder. Here is the info from Chrome inspection: (It doesn’t show it here, but the line “background-color: #FFF;” has a strike through line through it.

    theme.css:13

    body {
    background-color: #FFF;
    color: #777;
    font-family: “Open Sans”, Arial, sans-serif;
    font-size: 14px;
    line-height: 22px;
    margin: 0;
    }

    Right now I’m just working on the files on my computer, so no link I can give you yet.


    #10026547

    kkc
    Participant

    Hi,
    Figured it out after looking at inspection in chrome. Error It Wasn’t finding background image changed code in custom CSS from:

    background: url(img/patterns/gray_jean.png); to this

    background: url(../img/patterns/gray_jean.png);

    and now it works. I assume this is because I’m running it directly on my computer?

    Thanks for your help.


    #10026559

    Support2
    Keymaster

    Hello,

    Great that you figured this out!

    At really this is necessary when adds the CSS code inside a file, like (css/custom.css) for example.
    In our test here we added the code inline, sorry by we not have figured this out before.

    Let us know if you need further assistance.

    Kind Regards,

    Rodrigo.


Viewing 8 posts - 1 through 8 (of 8 total)