如何将圆形徽标用于 Google 课堂共享按钮

Question

我想使用 Google 课堂共享按钮的圆形徽标，如"Google 课堂品牌指南"页面所示。

我已经在"添加课堂共享按钮"页面中使用了该示例，但我不知道如何使用圆形徽标而不是方形徽标。

谁能帮忙？

Answer 1

您不能将共享按钮本身"配置"为使用不同的徽标;为此，您需要"手动"显示图标，然后将用户定向到 REST 共享终结点。

Answer 2

使用 CSS 更改图标。

下载圆形图标包：https://developers.google.com/classroom/assets/classroom_circle_logo.zip

在线上传您想要的图标以覆盖background-image规则

使用示例代码时，我得到CSS规则如下：

.mgQYsb {
    background-image: url("https://www.gstatic.com/classroom/logo_square_48.svg");
}

覆盖此规则

.mgQYsb {
    background-image: url("<your url>/<your logo>") !important;
} 

让我们希望班级保持不变。或者你可能会发现一个更通用的规则，它不考虑类，比如

div.hrIdWidgetContainer>div>div> {
    background-image: url("<your url>/<your logo>") !important;
}

我试图使用实际规则，看看圆形徽标是否在 gstatic.com 的同一文件夹中，但没有找到任何东西。