Custom Social Icons

  • Author
    Posts
  • #95439

    I recently took over management of a website using the Tempera theme. Included in the social media links/icons are 2 custom buttons. I need to delete one but cannot find where to do so. My instinct was to go to: “Appearance –> Social Media Settings” but only see our actual social media links. These icons appear next to the search field at the top of the page, along the right side of the page, and in the footer (I do know how to change these settings).

    Where would I find these custom links/icons that live with the social media icons?

    Website: www.hubga.com

    #95668
    Zed
    Cryout Creations mastermind

    The theme supports up to 5 social icons. The indicated site displays 7 social icons, which means it was customized to do this.
    You will most likely need to browse the code of the child theme to figure things out (the customizations may be based on the information available here: https://www.cryoutcreations.eu/docs/themes-legacy/faqs/tempera/#how-to-add-another-social-icon-in-tempera)


    If you like our creations, help us share by rating them on WordPress.org.
    Please read the available documentation and search the forums before posting.
    #97629
    ollyeden
    Power User

    Hello Zed,

    I do want to display the social icons in the top-bar.

    Unfortunately the icons change color and are hard to recognize.

    Can I change the color of the icons, so that this also works in the Top-Bar?
    Currently the colors only work in the footer ;-(

    Kind regards,
    Oliver

    #97849
    Zed
    Cryout Creations mastermind

    The social icons are already displayed in the top bar on the site.
    The icons are image based and to change their colors you’d need to change the images themselves.


    If you like our creations, help us share by rating them on WordPress.org.
    Please read the available documentation and search the forums before posting.
    #97945
    ollyeden
    Power User

    OK, but if on the right side or in the Footer, the icons are orange.
    Why could not be the same usage at the top-bar?

    Website: www.haus-seedeich.de

    #99103
    Zed
    Cryout Creations mastermind

    @ollyeden the indicated site does not display any social icons in the footer or on the side.

    Additionally, none of the menu items (to access the rest of the site) seem to work at this time (perhaps a permalink/rewrite error?)


    If you like our creations, help us share by rating them on WordPress.org.
    Please read the available documentation and search the forums before posting.
    #99111
    ollyeden
    Power User

    Hi Zed,

    it was an misconfiguration and is fixed at the Same Time you looked at it.

    Kind regards,
    Oliver

    #114566
    sneakerbot
    Power User

    Are social icons supported for Bravada Plus yet? I’ve followed the tutorial, but not seeing anything.

    Thank you and appreciate it!

    Website: www.sneakerbot.com

    #114711
    Zed
    Cryout Creations mastermind

    @ollyeden: the menu works now, but the site has no social icons in the footer or the sides. The social icons in the top bar are those of the theme and they appear to work.


    @sneakerbot
    , which tutorial did you follow? This topic is about Tempera, whose social icons functionality works completely different from that in Bravada, which you are using .


    If you like our creations, help us share by rating them on WordPress.org.
    Please read the available documentation and search the forums before posting.
    #119892
    ollyeden
    Power User

    Hi Zed,

    is it possible to show the Social-Icons in my Top-Bar colored like in Footer oder Side-Bar?

    I don’t use Footer and Side now.

    Kind regards,
    Oliver

    Website: www.haus-seedeich.de

    #120254
    Zed
    Cryout Creations mastermind

    Hi @llyeden,

    Since the social icons are image-based in Tempera, their color is not configurable. However it can be force-adjusted using custom CSS, for example:

    #topbar .socials a img { 
        filter: invert(100%) invert(85%) sepia(36%) saturate(4886%) hue-rotate(172deg) brightness(92%) contrast(89%);
    }

    To obtain the necessary filter sequence use this site with your desired color code, but prepend an extra invert(100%) to the list since we’re starting from white, not black.


    If you like our creations, help us share by rating them on WordPress.org.
    Please read the available documentation and search the forums before posting.
Viewing 11 posts - 1 through 11 (of 11 total)

You need to log in to reply to this topic.