自定义化谷歌主题

不管什么先来一句谷歌大法好坑定不会有问题，，天天对浏览器总有一天会审美疲劳，嗯对就像我，对这使用了很长的谷歌主题陷入了深深的沉思，有时候阿人心情不好的时候总想换个主题（？，比如说我，不过翻遍了谷歌商店都没有找到令我中意的主题，对于专业的强迫症人士来说一个让他看起来感到别扭的主题对它来说简直是一种另类的折磨，于是少年开始了自定义主题之旅。

那么应该如何开始呢

那当然是谷歌的文档阿，果不其然很快就能找到，介绍的超级详细，感觉完全不需要说一句废话，任何脱离官方文档的教程都是耍流氓，

Chrome Theme Reference

既然知道了怎么制作主题，那就直接开始吧，当然更复杂的操作请自行摸索

第一步

新建文件夹，文件夹内定义mainifest.json

以我的主题为例内容是这样的

{
    "name": "youmingsama",
    "version": "1.0",
    "description": "夏日",
    "manifest_version": 2,
    "theme": {
        "images": {
            "theme_frame": "images\/theme_frame.png",
            "theme_toolbar": "images\/theme_toolbar.png",
            "theme_tab_background": "images\/theme_tab_background.png",
            "theme_ntp_background": "images\/theme_ntp_background.png"
        },
        "colors": {
            "frame": [
                54,
                48,
                47
            ],
            "toolbar": [
                205,
                210,
                204
            ],
            "tab_text": [
                54,
                48,
                47
            ],
            "tab_background_text": [
                205,
                210,
                204
            ],
            "bookmark_text": [
                54,
                48,
                47
            ],
            "ntp_background": [
                255,
                255,
                255
            ],
            "ntp_text": [
                50,
                50,
                50
            ],
            "ntp_link": [
                6,
                55,
                116
            ],
            "button_background": [
                0,
                0,
                0,
                0
            ]
        },
        "tints": {
            "buttons": [
                0.02,
                0.07,
                0.2
            ]
        },
        "properties": {
            "ntp_background_alignment": "bottom",
            "ntp_background_repeat": "repeat"
        }
    }
}

第二步

创建文件夹images

创建使用的图片，各个模块官方文档力都有介绍，这里就不在解释啦

第三部

打开谷歌开发这模式。在不济直接拖入就好啦，当然这里建议选择直接打包成可执行文件crx就好啦，如果直接拖拽的画可能会产生问题，如果拖拽的源文件的相对位置发生相对改变的时候，主题会加载失败，所以建议直接打包成可执行文件

可能会产生bug

因为没有对屏幕进行适配，在不同的屏幕下图片可能并不兼容，我这边是多屏，在我的竖屏上就出现了非常尴尬的画面，因为没有做适配，顶部会有一大段空白区域，查阅文档，也只有ntp_background_repeat这一个处理方法

ntp_background_repeat"

ntp_background_repeat" : “no-repeat”
This property element is used to control the repetition of the image element theme_ntp_background.It is specified as…
“ntp_background_repeat” : "VALUE"In the place of VALUE you can enter either “repeat”, “no-repeat”, “repeat-x” or “repeat-y”. Depending upon the image you’ve created as the background you can choose to repeat the image along x-axis or y-axis or turn repeat off, since repeat is on by default!

于是我这边忘了取出上面一大部分空白区域，非常不情愿的用了 ntp_background_repeat": "repeat,来遮盖住了尴尬的空白区域，但是不可避免的出现了图片重复。此乃下策！！！！如果有更好的解决方案请私信我。欧内该！！！

效果图

以及并不完美的竖屏图

自定义化谷歌主题