Announcement

Collapse
No announcement yet.

VB cloud how to change background image of your forum

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Flash04jv
    commented on 's reply
    Looks like you will need to add the @ symbol back after you paste the code, before the word media, it doesn't copy and paste correctly in the code box I guess.
    Last edited by Flash04jv; Sun 30 Oct '16, 9:23am.

  • Flash04jv
    replied
    I don't know if this is something that will help you, but just in case, it's another option to spruce up your page and is super easy. I do it just randomly depending on season or relative events going on in our area.

    Just paste this code into CSS Editor, and add an image URL you have uploaded to a site like Imgur, Photobucket or VB File Manager, into the 2 places it says "Photo".

    Code:
    /*URL changes the forum photo background of outside edges*/
    html {
    background: url(Photo) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    }
    
    [USER="3396"]media[/USER] only screen and (max-width: 640px) {html {background: url(Photo) }}
    Forgot to add, you will also need to go to your Style Var Editor in Admin CP. Under > Global, change the body_background to: transparent.

    You can also change Header > header_background to transparent.
    And you can do Global > content_background to transparent.
    And Breadcrumbs > breadcrumb_background to transparent
    Last edited by Flash04jv; Sun 30 Oct '16, 9:22am.

    Leave a comment:


  • Nintenex
    replied
    Weird, its being bi-polar with me, it was working at first and now it doesnt work at all.

    Leave a comment:


  • Nintenex
    replied
    What Size does the image need to be to fit perfectly? mine was too big

    Leave a comment:


  • Mark.B
    replied
    Glad you got it sorted.

    Leave a comment:


  • Dale D-FL
    replied
    Originally posted by Mark.B View Post

    Needs to be:

    Code:
    url(https://pmf.vbulletin.net/core/css/0/0/1/7/9/6//images/halloween-bats-horror-scary-red-night-header.jpg)
    Mark, thank you for the input. I did it as you said and it worked like a champ. You support folks are the best.

    Leave a comment:


  • Mark.B
    replied
    Originally posted by Dale D-FL View Post

    Wayne, I followed your instructions and added what you see underlined here https://pmf.vbulletin.net/core/css/0...ght-header.jpg to the header_background of the Pink Style and clicked save but, nothing changed. Did I leave something out? Since it failed to work I cleared the URL out and will try again once you get back to me.
    Needs to be:

    Code:
    url(https://pmf.vbulletin.net/core/css/0/0/1/7/9/6//images/halloween-bats-horror-scary-red-night-header.jpg)

    Leave a comment:


  • Dale D-FL
    replied
    Originally posted by Wayne Luke View Post
    Once you have uploaded the image to your vBCloud File Manager and received the URL, then you can add it to a background by editing the proper style variable. In the case of this thread it would be the header_background image. Go to the AdminCP and select Styles -> Style Manager.

    Find the style you want to change and choose "Style Variable Editor" off the Choose Action... menu.

    Scroll down to the Header group and find header_background. Click on it and its options will appear in the right part of the screen.

    One of the options is Background Image. You're editing that one. You will add your URL between the double quotes so it looks like url("/your/url/here/someimage.ext")

    Save at the bottom and click on Site Home Page at the top of the AdminCP to see the changes.

    You'll need to repeat this for every style you want to change.
    Wayne, I followed your instructions and added what you see underlined here https://pmf.vbulletin.net/core/css/0...ght-header.jpg to the header_background of the Pink Style and clicked save but, nothing changed. Did I leave something out? Since it failed to work I cleared the URL out and will try again once you get back to me.

    Leave a comment:


  • Mark.B
    replied
    Originally posted by Wayne Luke View Post
    Works on Joe's site too:
    https://sedona.vbulletin.net/

    Leave a comment:


  • Wayne Luke
    replied
    Works here: https://forums.rabidbadger.io/index.php

    Leave a comment:


  • Nintenex
    replied
    Ill see if this works wayn when i did it before it didn't work at all.

    Leave a comment:


  • Wayne Luke
    replied
    Once you have uploaded the image to your vBCloud File Manager and received the URL, then you can add it to a background by editing the proper style variable. In the case of this thread it would be the header_background image. Go to the AdminCP and select Styles -> Style Manager.

    Find the style you want to change and choose "Style Variable Editor" off the Choose Action... menu.

    Scroll down to the Header group and find header_background. Click on it and its options will appear in the right part of the screen.

    One of the options is Background Image. You're editing that one. You will add your URL between the double quotes so it looks like url("/your/url/here/someimage.ext")

    Save at the bottom and click on Site Home Page at the top of the AdminCP to see the changes.

    You'll need to repeat this for every style you want to change.

    Leave a comment:


  • Dale D-FL
    replied
    Originally posted by Mark.B View Post

    Needs to be the other way round...you need to upload your image into the file manager, then copy the URL it gives you.

    When you've done this, please post back with the entire piece of code you have put into the stylevar.
    Mark, after uploading the image to the file manager this is the code I received core/css/0/0/1/7/9/6//images/halloween-bats-horror-scary-red-night-header.jpg does this code look correct and does it get uploaded to Style Manager>Global>body_backgrund>upload image?

    Leave a comment:


  • Mark.B
    replied
    Originally posted by Nintenex View Post

    I put the image url into the first one, and i uploaded the image to Vbcloud File manger
    Needs to be the other way round...you need to upload your image into the file manager, then copy the URL it gives you.

    When you've done this, please post back with the entire piece of code you have put into the stylevar.

    Leave a comment:


  • Nintenex
    replied
    Originally posted by Mark.B View Post

    It *does* work, however for us to be able to help we need to know full details.

    What is the exact code you are putting in, and which stylevar are you putting it into please?
    I put the image url into the first one, and i uploaded the image to Vbcloud File manger

    Leave a comment:

Related Topics

Collapse

Working...
X