Okay
  Public Ticket #1212154
Header color / google map color
Closed

Comments

  • Estudio started the conversation

    I'm trying to align my header text to the right, but it's been a hassle for me. I'm trying to hard code the CSS because I don't see an easy way to do it. I have succeeded on aligning the text, but I still have an extra space I can't get rid off. Please help

    Attached files:  Capture.PNG

  •  215
    Support Agent replied

    Hi,

    The text seems to be aligned.

    Could you tell us what exactly are you referring to? How would you like the text to look like?

    Thanks in advance.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    I made the necessary corrections. Much appreciated.

  • Estudio replied

    I'm having trouble with another section in the Home page. This is the mobile version of the website. Please help me align this part.

    Attached files:  Capture.PNG

  •  215
    Support Agent replied

    Hi,

    What you could do is adjust the margin right on responsive. In order to do that, please add Extra Class Name to the section containing the text.

    Then add the below code to Custom CSS field in Appearance >Customize >General Settings:

    @media (max-width: 990px) {
    .responsive_display p {
    margin-right: 50px;
    }
    }
    

    Please adjust the margin and breaking point according to your needs.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    Can't seem to change the color nor make them bolder o less bolder. What's the class so I can try to make changes?I

    I want them to be the same color even though the word in the bottom is bolder.

    Attached files:  white.PNG

  •  215
    Support Agent replied

    Hi,

    The bold word has the <b> tag added to it, and displays the accent color. Should you want to change its color (without changing the accent color, that is), please add the following code to Custom CSS field:

    .headline b.animate.animated {
        color: #0cb8b6;
    }
    

    Please adjust the color according to your needs.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    Perfect, it worked. How would I change header without the accent or alternative?

    Attached files:  Capture header.PNG

  • Estudio replied

    Just that one, no the entire headers

  •  215
    Support Agent replied

    Hi,

    The color of this headline depends on the color of its background. Should you want to add a custom color (other than black and white), first, please add the Extra Class Name to the section containing the headline.

    Then, add the following code to Custom CSS field:

    .header_color .header .headline {
      color: #fff;
    }

    Please adjust the color according to your needs.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    I did as you said, and it worked. Now, I would like to have that dash below the superheadline the same color (yellow) like the Headline.

    Attached files:  Capture.JPG

  • Estudio replied

    I noticed another issue. Once I did this

    .header_color .header .headline {  color: #fff;
    }

    This <b> bold changed to yellow once again.

    .headline b.animate.animated {    color: #0cb8b6;
    }
  • Estudio replied

    I find it to hard to change the colors of every headline I want. Please help

  •  215
    Support Agent replied

    Hi,

    In order to change the color of the dash, please try adding the following code:

    .btDarkSkin .btDash.topDash .dash:before, .btLightSkin .btDarkSkin .btDash.topDash .dash:before {
        -webkit-box-shadow: 0 2px 0 0 #fff inset;
        box-shadow: 0 2px 0 0 #fff inset;
    }
    

    Could you tell us where you added the code to change the color of <b> tag? Also, could you tell us which headline did you want to edit, and what is exactly the issue?

    If you need further assistance, please send us your wp login credentials so we can have a closer look.

    Thanks in advance.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    Please look at the image I attached.

    In regards to the code, in section 1 of the home page, I named the class: slider_header.

    and the header in section 3, I named the class as you said before: header_color.

    Then I went to my custom CSS plugin and made the changes there.

    for slider_header

    .slider_header {   
        color: #FFF; 
    }

    and for the header_color as you said

    .header_color .header .headline {  color: #fff;
    }

    Attached files:  Capture.PNG

  •  215
    Support Agent replied

    Hi,

    Could you tell us where exactly you added the code? Was it in Custom CSS field in Appearance >Customize >General Settings? Also, in order to change the color of the <b> tag, you need to add the following code, along with the css class you added. So the code should look like this:

    .slider_header.headline b.animate.animated {
        color: #fff !important;
    }
    

    If the changes are not visible on some pages, please go to those pages' editor, and check if there's a code already added to Override Global Settings. If so, either remove that code, or add the code for headline to that field as well.

    Let us know if this worked.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    It didn't work. Are these 3 kind of the same? 

    Attached files:  prueba.JPG

  •  215
    Support Agent replied

    Hi,

    Please add all the code you are adding to Override Global Settings to one custom_css element (separated by space, of course), instead of three, that you have now.

    Let us know if this helped.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    These are from a CSS  editor plugin I use:

    /* boton contactanos */
    .contactbot {
        background-color: transparent;
        border: 1px solid #fff;
        border-radius: 5px;
        margin-top: 3px;
        color: #fff !important;
      }
    /* Curvatura de columna izquierda */
    .izquierda {
      border-bottom-left-radius: 30px;
    }
    /* Curvatura de columna derecha */
    .colderecha {
      border-bottom-right-radius: 30px;
    }
    /* TamaƱo de botones medianos */
    .btnMedium {
        font-size: 14px;
        padding: 7px 9px;
    }
    /* Curvatura de Botones */
    .btDarkSkin .btnOutlineStyle.btnLightColor, .btLightSkin .btDarkSkin .btnOutlineStyle.btnLightColor, .btLightSkin .btnOutlineStyle.btnLightColor, .btDarkSkin .btLightSkin .btnOutlineStyle.btnLightColor {
        background-color: transparent;
        border: 2px solid #fff;
        color: #fff !important;
        border-radius: 11px;
    }
    /* Wrap del Map */
    .btGoogleMapsWrap {
        background-color: rgba(251, 199, 87, 0.82);
        color: #7b7b7b;
    }
    .derecha {
        
        text-align: right !important;
        margin-right:150px !important;
    }
    .derecha .strong .animate .animated {
      color: #eee;
    }
    .testim {
        color: #fcbc32;
    }
    

    These are from the Global Override

    .barracontact {   margin-top: 7px !important; }
    .header_color .header .headline {   color: #fcb316; }
    .slider_header.headline b.animate.animated {     color: #eee !important; }
    .headline b.animate.animated {     color: #FFF; }
    
  •   Estudio replied privately
  •  215
    Support Agent replied

    Hi, 

    Thank you for sending us your credentials.

    Like we noted, the code added to custom_css element in Override Global Settings, needs to be added to one custom_css element. We moved the code, so it seems that homepage is displaying properly now.

    Regarding the CSS plugin, please note that we cannot provide support for third party plugins, nor can we guarantee the plugin will be compatible with the theme. There is a Custom CSS field in Customization panel, that you could use, or, alternatively, you could use child theme.

    Thanks for understanding.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    It's been great help! Now I know what to do

  • Estudio replied

    What is the Class for the subtitle? I want to change the color from white to grey. 

    Attached files:  Capture.JPG

  • Estudio replied

    Nevermind, I found it

  • Estudio replied

    Now I would like to change some things in the map.

    The color of the letters, the space between lines.

    Current I have it like the part of the image that has a #1 in it, I want it like #2

    Attached files:  Capture.JPG

  •  215
    Support Agent replied

    Hi,

    We were not able to locate the exact map from your screenshot, but below is the code that should work for that map as well. First, please add Extra Class Name to the section containing the map. Then add the following lines of code:

    .name_of_your_class .btGoogleMapsWrap {
        color: #fff;
    }
    .name_of_your_class .btLightSkin .btDarkSkin .btIco.btIcoDefaultType.btIcoAccentColor:hover .btIcoHolder:after {
        color: #fff;
    }
    .name_of_your_class .header .headline {
     color: #fff;
    }
    .name_of_your_class .header.small h4 {
        margin: 0;
    }

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    1) I want the title to be #fff and the Icons to have the same color (#7b7b7b) as the rest of the information. (Take a look at the attachment)

    How would I do this?

    **

    2) I noticed another issue, the other headers (You guys edited changed color as well, they went from white to yellow)

    Attached files:  screenshot.jpg

  •  215
    Support Agent replied

    Hi,

    1. The code for title is:

    .name_of_your_class .header .headline {
     color: #fff;
    }
    

    And the code for icon color is:

    .name_of_your_class .btLightSkin .btDarkSkin .btIco.btIcoDefaultType.btIcoAccentColor:hover .btIcoHolder:after {
        color: #fff;
    }
    

    2. The code is not working since you, again, added two custom_css field on one page. Please move all your custom CSS to one field, separated by space.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    Not only the title changes, but also some of the info. I would like only the title white.

    Attached files:  screenshot.jpg

  •  215
    Support Agent replied

    Hi,

    We edited the code. It seems to be displaying properly now.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!

  • Estudio replied

    It's looking great. How would I change all the grey font to be the same as the other grey font? (one is bolder than the other). Also, I need to change the color of the icon's. I tried this code, an it's not working

    .mapa .btLightSkin .btDarkSkin .btIco.btIcoDefaultType.btIcoAccentColor:hover .btIcoHolder:after {    color: #7b7b7b;
    }
  •  215
    Support Agent replied

    Hi,

    Glad we could help!

    To change the font weight, please try adding the following code:

    .mapa p {
      font-weight: inherit;
    }

    Regarding the icon color, it seems that in your custom_css field, you have two codes for the icons. Please try removing one of them, and see if that makes a change. Also, the icon color can be changed through element's settings.

    Let us know if you need additional help.

    Regards, BoldThemes team

    If you like our products please consider leaving us a rating. A huge thank you from BoldThemes in advance!