Support Forum

Home Forums OceanPlaza WP Background image behind widgets/services/menu

All Wordpress Themes

This topic contains 21 replies, has 3 voices, and was last updated by  Support Team 4 3 years, 10 months ago.

  • Author
    Posts
  • #12770

    daynapuspoky
    Participant

    Hello,
    I posted a comment through themeforest earlier and I was directed back here 🙂
    I had a question regarding background images behind the footer widgets or services inserts and headers.
    On a home page i am working on i have placed in the 3 ‘services’ in th emiddle of the page to display an about us caption, apply, contact us. But i would like to put a full image behind it so its sitting on an image. It will cover the full area. I have tried a few things but i haven’t had any luck. I was wondering if i could get some direction on how to do this? Same with adding a full width and responsive image right below the header on each page. I have placed an image in some pages but they sit way below the header/ nav, and inside the container. I love the different angles and would like to keep those.
    As well as removing the titles in each page, before the content. It will say “contact us” on the contact page right about the content i place in. I can’t seem to find where i go to remove them.

    i understand this is not done through the dash board, but i am having a hard time locating the code that produces these things. Any direction would be greatly appreciated. Thanks again for your time 🙂

    url: dev.forestcitystaffing.com

    Dayna P.

  • #12774

    Support Team 6
    Participant

    Hello, Dayna!
    I’ll help you. I need some time.

  • #12775

    daynapuspoky
    Participant

    Thanks so much, I truly appreciate it 🙂

    Dayna P.

  • #12779

    Support Team 6
    Participant

    I have one request to you. Give an access to your WP admin area in private reply.

  • #12780

    daynapuspoky
    Participant
    This reply has been marked as private.
    • #12783

      Support Team 6
      Participant

      That is all I can propose. I added this css to file style.css (Appearance=>Editor) http://prntscr.com/5b731v and wrapped all blocks of the page in <div class="background"> http://prntscr.com/5b73or:

      .home .background{
      background-image: url('http://lookw.ru/1/42/1380310128-background-wide-wallpaper-1920x1200-009.jpg');} //change source your background image
      
      .home .service_box .section-mid {
      background: rgba(0,0,0,0) !important;}
      
      .home footer {
      position: relative;
      z-index: 100;
      }
      
      .home .footer-top-bord {
      border-color: transparent transparent #37a850 !important;
      }

      This css only for home page background http://prntscr.com/5b74e0. Don’t forget change link to the background-image.

  • #12931

    daynapuspoky
    Participant

    Thank you for the help, i really appreciate it.
    So for this css it is only obtaining to the home page background, right?
    Now is this the same approach i would take for each page, and their banner images? I want them to be the full width of the screen, not sitting in the container and way under the main menu. I would like it to look like the home page banner.

    Once again, thanks so much for your time.

    Dayna P.

  • #12934

    Support Team 6
    Participant

    Okay, I’ll see how can help.

  • #13020

    Support Team 4
    Participant

    Hello!
    Try to add this css code:

    body .background {
        background-image: url("http://dev.forestcitystaffing.com/wp-content/uploads/2014/11/truck_home.jpg");
    }
    
    body .service_box .section-mid {
    background: rgba(0,0,0,0) !important;}
    
    body footer {
    position: relative;
    z-index: 100;
    }
    
    body .footer-top-bord {
    border-color: transparent transparent #37a850 !important;
    }
  • #13118

    daynapuspoky
    Participant

    Hello, thanks again for the help. I was wondering how i would go about removing each post-title heading on each page. It appears at the top of all the content, on every page i create. For us it is not needed.
    Once again, great theme and thank you for all the help.

    Dayna Puspoky.

  • #13125

    Support Team 4
    Participant

    Hello, again!
    Please, show me on screenshot what same you want to remove?

  • #13128

    daynapuspoky
    Participant
    This reply has been marked as private.
  • #13129

    Support Team 4
    Participant

    I don’t see images, use any online services, please.

  • #13130

    daynapuspoky
    Participant
    This reply has been marked as private.
  • #13131

    daynapuspoky
    Participant

    okay sorry

  • #13132

    daynapuspoky
    Participant
    This reply has been marked as private.
  • #13133

    Support Team 4
    Participant

    Ok, I think understand you and I’ll see what can be done.

  • #13138

    Support Team 4
    Participant

    Try this css:

    .page-id-1482 .id_page2 .container {
        padding-top: 40px;
        width: 100%;
    }
    .page-id-1482 .id_page2 .container h1 {
        display: none;
    }

    Or this:

    .page-id-1482 .id_page2 .container {
        padding-top: 40px;
        width: 98%;
    }
    .page-id-1482 .id_page2 .container h1 {
        display: none;
    }
  • #13139

    daynapuspoky
    Participant

    and do i just place this in styles.css through ftp , or should i go through the editor to styles.css? and does it matter where in the file i place it?

    thanks

  • #13140

    daynapuspoky
    Participant

    this is just adjust the container of the entire page, i need it to apply only to the top image on each page. Would the image have to be placed into a separate div?

  • #13141

    Support Team 4
    Participant

    No difference, via FTP or via wp-admin. Better to insert in bottom of file.

  • #13144

    Support Team 4
    Participant

    It’s imposable, img can’t be largest of main element.
    But I can propose add this css to previous first code:

    .page-id-1482 .id_page2 .post-entry span {
        display: block;
        margin: 0 auto;
        width: 50%;
    }

The topic ‘Background image behind widgets/services/menu’ is closed to new replies.