如何为 Google 课堂分享按钮使用圆形徽标？

Posted 2023-02-16

【中文标题】如何为 Google 课堂分享按钮使用圆形徽标？

【英文标题】：How can I use the round logo for the Google Clas-s-room Share Button?

【发布时间】：2016-05-19 17:12:51

【问题描述】：

我想使用“Google Clas-s-room Branding Guidelines”页面中显示的谷歌课堂分享按钮的圆形标志。

我使用了“Add a Clas-s-room Share Button”页面中的示例，但我不知道如何使用圆形徽标而不是方形徽标。

谁能帮忙？

【问题讨论】：

你想把它添加到什么地方？网页？使用 javascript？

只是尝试从 Google 课堂示例页面运行示例，但使用圆形徽标而不是方形徽标。我想也许有一个数据属性可用于指定徽标形状，但在文档中找不到任何相关信息。

用您使用的语言标记问题。它会让适当的观众看到您的问题。

【参考方案1】：

使用CSS更改图标。

下载圆形图标包：https://developers.google.com/clas-s-room/assets/clas-s-room_circle_logo.zip

在线上传你想要的图标并覆盖background-image-rule

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

.mgQYsb 
    background-image: url("https://www.gstatic.com/clas-s-room/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 上的同一文件夹中，但没有找到任何东西。

【参考方案2】：

您不能“配置”分享按钮本身以使用不同的徽标；要做到这一点，您需要"manually" display the icon and then direct the user to the REST share endpoint。