Currently, Oxygen’s Social Icons element doesn’t allow you to change or modify Social Media Links, which isn’t great with the new Twitter/X rebranding, or new social networks that aren’t available.
However, if you want to change the logo, you can recreate the Social Icons element using a Link Wrapper with an Icon element. Here’s a quick JSON example that you can copy and import into your site using Oxygen’s Cross-site copy-and-paste feature:
{"component":{"id":79,"name":"ct_div_block","options":{"ct_id":79,"ct_parent":100003,"selector":"div_block-79-44","original":{},"nicename":"Social Icons Container","classes":["social--container"]},"depth":3,"children":[{"id":80,"name":"ct_link","options":{"ct_id":80,"ct_parent":79,"selector":"link-80-44","original":{"url":"https://facebook.com/oxygenbuilder"},"nicename":"Link Wrapper (#80)","classes":["social--link-wrapper"]},"depth":4,"children":[{"id":81,"name":"ct_fancy_icon","options":{"ct_id":81,"ct_parent":80,"selector":"fancy_icon-81-44","original":{"icon-id":"FontAwesomeicon-facebook-square"},"nicename":"Icon (#81)","classes":["social--icon"]},"depth":5}]},{"id":82,"name":"ct_link","options":{"ct_id":82,"ct_parent":79,"selector":"link-82-44","original":{"url":"https://github.com/soflyy/oxygen-community"},"nicename":"Link Wrapper (#82)","classes":["social--link-wrapper"]},"depth":4,"children":[{"id":83,"name":"ct_fancy_icon","options":{"ct_id":83,"ct_parent":82,"selector":"fancy_icon-83-44","original":{"icon-id":"FontAwesomeicon-github-square"},"nicename":"Icon (#83)","classes":["social--icon"]},"depth":5}]},{"id":84,"name":"ct_link","options":{"ct_id":84,"ct_parent":79,"selector":"link-84-44","original":{"url":"mailto:[email protected]"},"nicename":"Link Wrapper (#84)","classes":["social--link-wrapper"]},"depth":4,"children":[{"id":85,"name":"ct_fancy_icon","options":{"ct_id":85,"ct_parent":84,"selector":"fancy_icon-85-44","original":{"icon-id":"FontAwesomeicon-envelope-square"},"nicename":"Icon (#85)","classes":["social--icon"]},"depth":5}]}]},"classes":{"social--container":{"original":{"flex-direction":"row","display":"flex","selector-locked":"false"},"key":"social--container"},"social--link-wrapper":{"original":{},"key":"social--link-wrapper"},"social--icon":{"original":{},"key":"social--icon"}}}
Next, to get the new social icons, we’ll want to upload a custom SVG Icon set to your site. The attached Icon Set has icons for X, TikTok, Discord, and Mastodon: https://drive.google.com/file/d/1rsdaEvOzOWYeGTVgciuBiJU0b2jcONXZ/view?usp=sharing.
There’s a more complete list of Brand Icons here: https://icomoon.io/app/#/select/library.
More info about uploading Icon Sets can be found here: https://oxygenbuilder.com/documentation/other/custom-svg-icon-sets/.
Happy Sailing!
