1. HOT Divi Ultimate Header Plugin - Design Divi custom header globally in Divi Builder: https://header.diviultimate.com/
    Dismiss Notice

Solved "Logo Helper"

Discussion in 'Get Help On Divi Wordpress' started by Ivy Zhou, Mar 28, 2019.

  1. Ivy Zhou

    Ivy Zhou Member

    Hello, next to my logo, I have a "logo helper" that I inputted through the Theme Options under styles.css
    The current logo helper (the round logo) is directly to the left of the actual logo Screen Shot 2019-03-28 at 2.13.10 AM.png


    Is it possible to get the round logo helper moved down like the image below? The CSS right now is:
    @media only screen and (min-width: 981px) {
    .logo_helper {
    background: url(/wp-content/themes/divi-child/images/Cessna-Logo-R4.png) no-repeat left top; background-size:80%;
    width:90px !important;
    height:75px !important;
    margin-top:.2rem;
    }
    .et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
    padding: 90px 0 0 0 !important;
    }
    /*.page.et_pb_pagebuilder_layout #main-content { margin-top: 3rem; } */
    }

    image001.png
     
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    For the .logo_helper CSS, change it to below:
    Code:
    background: url(/wp-content/themes/divi-child/images/Cessna-Logo-R4.png) no-repeat left top;
    background-size: 95%;
    width: 131px !important;
    height: 115px !important;
    margin-top: .2rem;
    margin-bottom: -43px;
     
  3. Ivy Zhou

    Ivy Zhou Member

    The logo helper did not move... Also, I only want this change on my home page, and not my child pages. Are the margin CSS the numeric values I should alter?
     
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    If you want it to affect homepage only, then try the below full CSS:
    Code:
    @media only screen and (min-width: 981px) {
        .logo_helper {
            background: url(/wp-content/themes/divi-child/images/Cessna-Logo-R4.png) no-repeat left top;
            background-size:80%;
            width:90px !important;
            height:75px !important;
            margin-top:.2rem;
        }
        home.logo_helper {
            background-size: 95%;
            width: 131px !important;
            height: 115px !important;
            margin-top: .2rem;
            margin-bottom: -43px;
        }
        .et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
            padding: 90px 0 0 0 !important;
        }
        /*.page.et_pb_pagebuilder_layout #main-content { margin-top: 3rem; } */
    }
     
  5. Ivy Zhou

    Ivy Zhou Member

    Hmm, the logo helper still looks like screenshot #1 when I want it to look like screenshot #2..
    #1
    [​IMG]

    #2
    Screen Shot 2019-03-28 at 8.36.59 PM.png
     
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    My bad. Some mistake in the previous CSS. Try the below.
    Code:
    @media only screen and (min-width: 981px) {
        .logo_helper {
            background: url(/wp-content/themes/divi-child/images/Cessna-Logo-R4.png) no-repeat left top;
            background-size:80%;
            width:90px !important;
            height:75px !important;
            margin-top:.2rem;
        }
        body.home .logo_helper {
            background-size: 95%;
            width: 131px !important;
            height: 115px !important;
            margin-top: .2rem;
            margin-bottom: -43px;
        }
        .et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
            padding: 90px 0 0 0 !important;
        }
        /*.page.et_pb_pagebuilder_layout #main-content { margin-top: 3rem; } */
    }
     
    Ivy Zhou likes this.
  7. Ivy Zhou

    Ivy Zhou Member

    Hi, how can I add a link to the logo helper? I want the logo helper to lead to the homepage when clicked.
     
  8. Divi.Help

    Divi.Help Administrator
    Staff Member