是否可以替换 HubSpot 代码库中的社交媒体图标？

Question

我是这个平台和语法的新手。我们的主题中有自定义社交媒体图标。示例：

<a href="{{ module.link_sharetw }}" class="share-button twitter">
<img src="{{ get_asset_url('/greenpeace_p4_theme/assets/twitter.svg') }}" />
</a>

我想在这里替换社交共享模块中使用的默认图标。可能吗？

{% set size = "24px" %}
{% set borderRadius = "3px" %}
{% set linkStyle = "width:"~size~";border-width:0px;border:0px;text-decoration:none;" %}
{% set imgStyle = "height:"~size~";width:"~size~";border-radius:"~borderRadius~";border-width:0px;border:0px;" %}

{% macro render_social_icon(networkName) %}
{% set network = module[networkName] %}
{% if (networkName == "pinterest" and network.pinterest_media and network.enabled) or (networkName != "pinterest" and network.enabled) %}
{% if networkName == "pinterest" %}
{% set pinterest_media = module.pinterest.pinterest_media.src %}
{% endif %}
{% set logo = networkName ~'-color.png' %}
{% set urlOperator = "&" if "?" in page_meta.canonical_url else "&" %}
{% if module.link %}
{% set social_link_url = module.link ~ urlOperator ~ "utm_medium=social&utm_source="|safe ~ networkName %}
{% elif content.email_type.blogRssChild %}
{% set social_link_url = content.rss_email_url %}
{% else %}
{% set social_link_url = page_meta.canonical_url ~ urlOperator ~ "utm_medium=social&utm_source="|safe ~ networkName %}
{% endif %}

<a href="{{ network.custom_link_format }}" target="_blank" rel="noopener" style="{{ linkStyle }}" >
<img src="{{ module_asset_url(logo) }}" class="hs-image-widget hs-image-social-sharing-24" style="{{ imgStyle }}" width="{{ size }}" hspace="0" alt='{{ "Share on " ~ networkName }}' />
</a>
{% endif %}
{% endmacro %}

<div class="hs_cos_wrapper hs_cos_wrapper_widget hs_cos_wrapper_type_social_sharing" data-hs-cos-general-type="widget" data-hs-cos-type="social_sharing">
{{ render_social_icon('facebook') }}
{{ render_social_icon('linkedin') }}
{{ render_social_icon('share_twitter') }}
{{ render_social_icon('pinterest') }}
{{ render_social_icon('email') }}
</div>

我知道有一种方法可以在模块检查器中替换社交媒体图标，但它只需要 png。

Answer 1

在第 12 行你有一个

{% set logo = networkName ~'-color.png' %}

这是定义图标的预期名称。将 .png 更改为 .svg，它应该可以正常渲染。

是否可以替换 HubSpot 代码库中的社交媒体图标？

Is it possible to replace the social media icons in HubSpot's codebase?

svg

hubspot

hubl