简体   繁体   English

如何删除Blogger CSS小部件包

[英]How to remove Blogger CSS widget bundle

I'm trying to write a blogger template from scratch. 我正试图从头开始写博客模板。 I've added some elements and styles to my template. 我在模板中添加了一些元素和样式。 But, I found that some other CSS stylesheets are included and they are also applied to the page elements as shown below: 但是,我发现包含了一些其他CSS样式表,它们也应用于页面元素,如下所示:

在此输入图像描述

The first CSS background rule was the only thing I applied in <b:skin> tags are the remaining were not from my styles. 第一个CSS背景规则是我在<b:skin>标签中应用的唯一内容,其余的不是我的样式。 So, how can I remove them. 那么,我该如何删除它们。 I can overwrite them if they were right, but there are some wrong declarations( _height:100% ) 如果他们是对的,我可以覆盖它们,但是有一些错误的声明( _height:100%

Make a backup of your template first. 首先备份您的模板。

TO BLOCK BLOGGER CSS: 阻止BLOGGER CSS:

Find this: 找到这个:

<b:skin><![CDATA[lots-of-css-code]]></b:skin>

and replace with this: 并替换为:

&lt;style type=&quot;text/css&quot;&gt;&lt;!-- /*<b:skin>*/</b:skin>

Find this: 找到这个:

 <b:template-skin>bunch of code</b:template-skin>

and replace with this: 并替换为:

<link href='https://www.somewhere.com/yourstylesheet.css' rel='stylesheet' type='text/css'/>

or replace with this: 或者替换为:

 <style>your-custom-css-here</style>

One solution might be to explicitly override each style included in the unwanted stylesheets. 一种解决方案可能是明确覆盖不需要的样式表中包含的每种样式。

Essentially this would require that you call your own stylesheet to reset each unwanted style to it's default after the unwanted stylesheet has been called. 基本上,这需要您调用自己的样式表,以便在调用不需要的样式表后将每个不需要的样式重置为默认样式。

Since your styles are further down the cascade they will cancel out the unwanted styles. 由于你的风格在级联下方,它们将取消不需要的风格。

It's a totally messy solution, but better than nothing. 这是一个完全混乱的解决方案,但总比没有好。

!important should be used only as a last resort. !important应该仅作为最后的手段使用。

<script>
$("[href$='css_bundle.css']").remove();
</script>

Use this if you use jquery library. 如果使用jquery库,请使用此选项。

There are two external CSS files that are added by Blogger officially. Blogger正式添加了两个外部CSS文件。 Removing them can cause a messed up Blogger template but if you are a designer and added your own CSS instead of Blogger then its important to delete unwanted CSS files that can cause a heavy load. 删除它们会导致混乱的Blogger模板,但如果您是设计师并添加了自己的CSS而不是Blogger,那么删除可能导致重负荷的不需要的CSS文件非常重要。

<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' /> <link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/4219271310-widget_css_2_bundle.css' />

These are two Blogger official CSS bundle files that re in every Blogger blog. 这些是每个Blogger博客中的两个Blogger官方CSS捆绑文件。 One thing you have to note that you can make these line into HTML comment but not permanently delete. 有一点需要注意,您可以将这些行转换为HTML注释,但不能永久删除。

For this, there is a long tutorial that you can find at How To Remove/Hide Blogger Official CSS In Your Custom Template? 为此,您可以在如何删除/隐藏自定义模板中的Blogger官方CSS中找到一个很长的教程 So follow this and remove Blogger official CSS bundle. 请按照此操作删除Blogger官方CSS捆绑包。

Disable Default Blogger Css Bundle : 禁用默认Blogger Css捆绑包:

You can remove widget_css_2_bundle.css with this steps below : 您可以通过以下步骤删除widget_css_2_bundle.css

First step : 第一步 :

search for <head> tag and replace it with : 搜索<head>标记并将其替换为:

&lt;head&gt;

Second step : 第二步 :

search for </head> tag and replace it with : 搜索</head>标记并将其替换为:

&lt;/head&gt;&lt;!--<head/>--&gt;

Note : This is the best way because is not affect the variables if you use variables in your template. 注意:这是最好的方法,因为如果在模板中使用变量,则不会影响变量。


Disable Plusone.js and Widgets.js 禁用Plusone.js和Widgets.js

Now if you want to disable Plusone.js and Widgets.js to increase you page speed follow this steps below : 现在,如果要禁用Plusone.jsWidgets.js以提高页面速度,请按照以下步骤操作:

search for </body> tag and replace it with : 搜索</body>标记并将其替换为:

&lt;!--</body>--&gt; &lt;/body&gt;

That's all save your template and well done :) Now you can create your own blogger template from scratch like you want ;) 这就是保存你的模板并做得很好:)现在你可以像你想的那样从头创建自己的博客模板;)

With the release of the new theme engine last year, Blogger has now made it easier to remove the default CSS and JS files that it includes in the template. 随着去年新主题引擎的发布,Blogger现在可以更轻松地删除模板中包含的默认CSS和JS文件。

To remove them, add the following attributes to the <html> tag at the start of the template code (present under Theme 🢂 Customise) - 要删除它们,请将以下属性添加到模板代码开头的<html>标记中(显示在主题🢂自定义下) -

<html b:css='false' b:js='false' ...

b:css='false' - Removes the default CSS included by Blogger in the template b:css ='false' - 删除模板中Blogger包含的默认CSS

b:js='false' - Removes the default JS included by Blogger in the template b:js ='false' - 删除模板中Blogger包含的默认JS

The only way I found around is was to leave the skin tags completely empty and add some style-Tags in the head-part or link to a stylesheet. 我找到的唯一方法是将皮肤标签完全留空,并在头部添加一些样式标签或链接到样式表。 It works for me, but it's still ver annoying. 它对我有用,但它仍然很烦人。

If You use this code <b:skin><![CDATA[...]]></b:skin> , it will change to be comment code and it still shows in the front page, even though it's unused. 如果您使用此代码<b:skin><![CDATA[...]]></b:skin> ,它将更改为注释代码,它仍会显示在首页中,即使它未使用。

This way is very simple from all way I found. 从我发现的各方面来看,这种方式非常简单。 Change <b:skin> ... </b:skin> to this code: <b:skin> ... </b:skin>更改为此代码:

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
   <b:skin> ... </b:skin>
</b:if>

It will remove the style of <b:skin> in the front page without change to be a comment code. 它将删除首页中<b:skin>的样式而不更改为注释代码。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM