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

How can I use the round logo for the Google Classroom Share Button?

本文关键字:Google 用于 课堂 共享 按钮      更新时间:2023-09-26

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

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

谁能帮忙?

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

使用 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 的同一文件夹中,但没有找到任何东西。