问题
Currently, it appears like a square with no text beside, we want to customize the look & feel without disturbing the icon of course to match our other buttons.
Already tried adding styles to the div which is converted to the share icon, but unsuccessful so far.
<div id='widget-div' class='btn btn-blue'>Google Classroom</div>
The above line renders as below :
Any idea how to proceed further or which direction to look into ?
回答1:
To get a completely different share button you will need to write your own JS to style the button correctly, handle the mouse click, etc., and then direct the user to a URL of the form https://classroom.google.com/share?url=https://foo.com/ (source). (You'll need to following the branding guidelines too.)
回答2:
To modify the button you can refer to the Share button documentation. However, there are some restrictions that you would need to follow to modify the Classroom button in the appropriate way.
Here you can find all the specifications and restrictions to the logo. Check if these specifications allow you to modify the logo accordingly to your needs.
回答3:
You can put the white logo (square or circle) on a colored background of your choice. Full brand guidelines here
来源：https://stackoverflow.com/questions/32010259/how-to-customize-the-look-feel-of-the-google-classroom-share-button