Add social icons and change header border color.

Home Forums Iconic One Pro Support Add social icons and change header border color.

This topic contains 4 replies, has 2 voices, and was last updated by  Themonic-Support 6 years, 9 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #4953

    Aliensoft
    Participant

    Please help me with accomplishing the following tasks using a child theme:

    1. Change the color of the header border (the border that raps around the navigation and header. I could already change the background of this section).
    2. Change the social icons in the header. Would like the images from the child theme to update the parent theme.
    3. Add social media options on the theme customization section. For example; add github to the options page and when url specified it should update the header accordingly.

    Thank you in advance.

    #4954

    1)

    
    .site-header {
        border-left: 1px solid #e9e9e9;
        border-right: 1px solid #e9e9e9;
        border-top: 1px solid #e9e9e9;
    }

    Change the hex color to your choice

    2) Just change the images in img folder inside theme folder keeping the same image names. Then drop the folder in the child theme.

    3) Modifying the options page would require custom work.
    But you can modify header.php to add github icon easily.

    Line 70 and 71 of header.php is (just below class rss)

    
    <?php } ?>
    </div>

    Add your github image code html inside it:

    
    <?php } ?>
    github html here
    </div>
    #4955

    Aliensoft
    Participant

    Thank you. I followed your suggestions. However; some things are not working as expected. The images from the child theme is not overwriting the images in the parent theme.

    Furthermore, I had to add !important to the border css to get that working. Any suggestions?

    #4956

    Aliensoft
    Participant

    Here is the link to my website: https://www.rizonesoft.com

    #4957

    For the border CSS, try the following – one of them should work:

    
    #page .site-header {
        border-left: 1px solid #333333;
        border-right: 1px solid #333333;
        border-top: 1px solid #333333;
    }

    OR

    
    #page .site .site-header {
        border-left: 1px solid #333333;
        border-right: 1px solid #333333;
        border-top: 1px solid #333333;
    }

    Another solution would be put it under simple custom css plugin or customizer custom css section.

    I could see the new icons on your site now, if still need further help email
    [email protected], please note that child theme customization and troubleshooting may be charged extra.

Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Add social icons and change header border color.’ is closed to new replies.