Secure-Pro – customization colors

Home Forums All Other Themes Secure-Pro – customization colors

Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • #148074
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi, I’m using Secure-Pro theme and have those issues :

    1) Social media on Topbar
    When I put my social media link on Topbar Left Text 1, it make the Topbar almost double size then if I put on Topbar Right Text 1

    https://ibb.co/WKP6MLF
    https://ibb.co/ZhRGCyY

    2) Menu / Submenu customization
    I find this code by doing a search on the forum here (I just adapt it to my color and for Menu and Sub-Menu):

    #topmenu li a:hover, #topmenu li.menu_highlight_slim:hover {background-color:#E80035 !important;}
    #topmenu ul li ul li a:hover { color:#fff !important;}

    #topmenu ul.sub-menu li a:hover, #topmenu li.menu_highlight_slim:hover {color:#E80035 !important;}

    Since I put this code, the menu goes to uppercase, even if the option Turn Menu Text to Uppercase is unset. When I saw that, I removed the code but seems on computer the option Turn Menu Text to Uppercase doesn’t work anymore, when I click on publish it goes back to uppercase. On mobile is ok.

    Can you, please, provide me the CSS code to have my menu / sub-menu look like on both picture below ?

    https://ibb.co/wYCh5VK
    https://ibb.co/pnQ1qqJ

    Is it possible to thave that kind of view for mobile/tablet as well ?

    3) Is it possible to make, on computer view, the menu bar bigger ? I would like that the hover background red goes on the red Topbar and not having a small black (background picture) between

    Something like that :
    https://ibb.co/swRGSf9

    4) Page Title background color ?
    I’m using a background picture, and sometimes I have the page title in white that goes to a more light part of the color, so the title in white in that case is not so readable. Is it possible to have a specific background color (color I can choose) to avoid that effect ? Maybe it will be nice if there’s a possibility to have like an transparency effect to that background color ?

    5) Topbar larger ?
    Is it possible to have the color of the Topbar going more on the left/right of the screen on computer view ?
    Something like that :
    https://ibb.co/XJZmNwg
    the Topbar Left / Right Text can stay in place, just the red color.

    I look forward to hearing from you.

    Best regards.

    Joël

    #148116
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    Hi,

    1) Social media on Topbar
    When I put my social media link on Topbar Left Text 1, it make the Topbar almost double size then if I put on Topbar Right Text 1

    And: We did not get any social media issues, please put social media in the left text 1, then we will solve it

    2) Menu / Submenu customization
    I find this code by doing a search on the forum here (I just adapt it to my color and for Menu and Sub-Menu):

    Ans: Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    #topmenu ul li a { text-transform:capitalize !important;}

    3) Is it possible to make, on computer view, the menu bar bigger ? I would like that the hover background red goes on the red Topbar and not having a small black (background picture) between

    Ans: Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .header.type1 {
        padding-top: 0 !important;
    }

    4) Page Title background color ?
    I’m using a background picture, and sometimes I have the page title in white that goes to a more light part of the color, so the title in white in that case is not so readable. Is it possible to have a specific background color (color I can choose) to avoid that effect ? Maybe it will be nice if there’s a possibility to have like an transparency effect to that background color ?

    Ans: Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .thn_post_wrap .page-title {
        background-color: rgba(0,0,0,0.6);
        padding: 10px 0;
    }

    5) Topbar larger ?
    Is it possible to have the color of the Topbar going more on the left/right of the screen on computer view ?

    Ans: Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    .head-info-area {
        background-color: rgb(232, 0, 53) !important;
    }

    Regards,
    Dave

    #148148
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave,

    Thank you for you quick response.

    Solutions for the points 2 to 5 works good.

    I’ve moved the social media to the left text 1 with the same code. You can see that the Topbar is bigger now.

    I would like also to change have a background color for the active menu, I’ve put this code but it doesn’t work :
    /*Active menu background color*/
    #topmenu ul li.current-menu-item>a:link, #topmenu ul li.current-menu-item>a:visited, #topmenu ul li.current-menu-parent>a:link, #topmenu ul li.current_page_parent>a:visited, #topmenu ul li.current-menu-ancestor>a:link, #topmenu ul li.current-menu-ancestor>a:visited {
    background-color: #E80035 !important;
    }

    I look forward to hearing from you.

    Best regards.

    Joël

    #148155
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave,

    In addition to my previous reply.

    Is it possible to have for mobile the possibility to change the “Mobile Outer Toggle Bar Background color” ? There is an option on Header for Mobile Outer Toggle Bar Color but not for background color.

    Thank you.

    Joël

    #148161
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    @media screen and (max-width:1023px) {
    .head-info-area .left span{ padding:0 !important;}
    .sidr {
        background-color: #282828 !important;
    }
    .pad_menutitle {
        background-color: #d00433 !important;
    }
    }

    Regards,
    Dave

    #148166
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave,

    I suppose the code you gave me is for my post #148155 ?

    It doesn’t work. It change the menu color and background color on the mobile, but that’s not I wanted. I wanted the 3 bar from the button, like the picture :
    https://ibb.co/cQGdm9g

    Can you please also have a look at post #148148 ?

    Thank you.

    Joël

    #148195
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

    @media screen and (max-width:1023px) {
    #simple-menu .fa-bars {
        background: #fff !important;
        padding: 0 5px !important;
    }
    }

    Regards,
    Dave

    #148243
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave,

    It’s working thank you.

    Can you please have a look at post #148148, I copy below :

    1) Topbar bigger with Social media link at Left text 1
    I’ve moved the social media to the left text 1 with the same code. You can see that the Topbar is bigger now.

    2) Background color for the active menu ?
    I would like also to change have a background color for the active menu, I’ve put this code but it doesn’t work :
    /*Active menu background color*/
    #topmenu ul li.current-menu-item>a:link, #topmenu ul li.current-menu-item>a:visited, #topmenu ul li.current-menu-parent>a:link, #topmenu ul li.current_page_parent>a:visited, #topmenu ul li.current-menu-ancestor>a:link, #topmenu ul li.current-menu-ancestor>a:visited {
    background-color: #E80035 !important;
    }

    I look forward to hearing from you.

    Best regards.

    Joël

    #148274
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    Hi,

    Kindly send us your URL of the site and WordPress admin details (Username & Password) via email:[email protected] Please mention this forum URL while replying so that we understand what needs to be done.

    We’ll check and revert back to you.

    Regards,
    Dave

    #148278
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave, done.

    Regrds.

    Joël

    #148279
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    Hi,

    Replied via email.

    Regards,
    Dave

    #148288
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi, ok I reply too to the email.

    Regards.

    Joel

    #148311
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    🙂

    #148339
    JOEL MULLERJOEL MULLER
    Participant
    • Topics: 3
    • Replies: 9
    • Total: 12
    Member since: March 19, 2020

    Hi Dave,

    I upload a picture : https://ibb.co/3C4ZXYp

    Seems it didn’t go through the email as attached picture.

    Best regards.

    Joël

    #148350
    Sonl SinhaSonl Sinha
    Moderator
    • Topics: 0
    • Replies: 30975
    • Total: 30975
    Member since: August 16, 2013

    okay

Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.