你曾经发生过这些事情吗? 您安装了一个插件,它具有您正在寻找的确切功能,但是……它不能正常工作。 即使更改了所有设置,后者也并不总是适应您的 WordPress主题. 因此,由于这个小缺陷,您可能正在考虑选择另一种解决方案。 如何添加WordPress的CSS代码1

不过,如果您有点杂物,也许您可​​以在此添加CSS代码来解决博客上的问题,那么您也许可以解决它,特别是在插件无法正常工作的情况下如果开发者没有正确地提供CSS部分,则您必须自己完成。

本教程将允许您通过在您的 WordPress插件.

但是之前,如果您从未安装过WordPress发现 如何安装WordPress博客7步骤 et 如何找到,安装和你的博客激活WordPress主题.

然后,回到我们为什么在这里。

自定义CSS样式=对外观的更多控制

自定义CSS样式允许您操纵各种元素的外观,而这些元素的外观超出了开发人员的预期。 如今,许多高端插件都包含自定义样式选项,但是免费插件在这方面并不总是那么细致。

选择最受欢迎的插件之一: 联系表7。 它几乎没有CSS处理。 但是,借助自定义CSS,您可以完全更改表单的各个方面。

但是,即使具有详细选项的插件也无法始终为您提供自定义CSS代码的功能。

因此,学习一些CSS并安全地添加它,将使您能够 能够模拟访问者可以看到的内容。

为什么需要正确添加CSS代码?

您当然不想在您的网站上添加混乱的CSS。 正如许多开发人员所相信的那样,将CSS代码添加到博客中有对与错的方法。如何添加WordPress的CSS代码2

发现我们的 4 WordPress插件可在博客上自定义CSS

当您以正确的方式添加 CSS 样式时,它们将始终是安全的,即使您更新了您的 WordPress主题,如果您决定更改您的主题,您将能够轻松地将它们复制并粘贴到新主题中。

另见 如何自定义WordPress网站的CSS

相反,如果以错误的方式添加它们,您的 CSS 代码将更加暴露并且可能无效。 你们中的一些人使用 WordPress主题 迪维。 所以我将向您展示如何向此 WordPress 主题添加 CSS 代码。

在Divi的何处添加CSS样式

为了在Divi上安全地添加CSS代码,您需要访问“ 主题选项 »在您的Divi菜单中:

附加一个代码,CSS-的主题 -  WordPress的

然后,在“常规”标签中(这将是默认情况下加载的标签页),则需要滚动到页面底部。 在那里您会找到一个名为“ 自定义CSS »:

代号CSS-定制 - 迪维

从技术上讲,您需要做的就是在此处输入您的自定义CSS代码,然后点击“ 保存更改 ”。 但是,由于我们希望它真的很容易移动或复制,因此我们将更进一步。 通过咨询发现有关Divi的其他教程 我们关于Divi的最佳资源

因为您可能已经在Divi上添加了一些自定义代码,所以它将帮助您在本节中组织自定义CSS。 为此,您需要添加评论,例如 CSS Styles Start Here插件 ”。 然后,您可以在此部分中添加自定义CSS代码。

要添加评论,您需要做的就是复制并粘贴以下代码:

/ * CSS Styles Start Here插件* /

添加-A-CSS代码定制 - 迪维

该注释不会有任何影响,但会帮助您组织各种自定义CSS样式。 Divi还可以在更新时保持自定义CSS样式的安全,因此您不必担心丢失它们。

在其他WordPress主题上添加CSS代码的位置

如果您使用其他WordPress主题,则需要将自定义CSS代码添加到子主题。 如果您不使用子主题,或者不知道它是什么,我邀请您阅读本教程: 如何在WordPress上安装子主题

假设您已设置了子主题,则可以在WordPress信息中心中直接转到“ 外观>编辑器 “

定制-的主题 -  WordPress的

确保您正在编辑正确的子主题。 您的修改必须在文件“ styles.css的 “。

然后,您只需要像以前一样添加自定义CSS即可。 首先,创建一个注释块,并添加代码:

几个附加块的代码,CSS-上的WordPress

总结一下

在开始这一冒险之前,您需要具备一些CSS知识。 你会找到 各种在线课程。 另外,您应该知道添加代码不仅仅是添加代码。 为了找到修改方法,您将需要使用注释块来举例说明进行CSS修改的原因。

还发现一些高级WordPress插件  

您可以使用其他 WordPress插件 赋予现代外观并优化您的博客或网站的处理。

我们在这里为您提供了一些高级WordPress插件,它们将帮助您实现这一目标。

1. Slider Pro

Slider Pro是CodeCanyon的三大畅销产品之一。 它在管理区域中提供了干净直观的用户界面,并为用户和访客提供了流畅的浏览体验。Slider Pro响应式WordPress滑块插件

它避免了不必要的幻想,这些幻想通常对于正在寻找所需信息的用户来说是一个障碍。 此外,它着重于简单性和性能,同时提供了广泛的定制可能性。

也发现 如何在WordPress上使用Slider Revolution创建幻灯片

在浏览器的搜索栏上对Urls的管理是在后者上标记我们的功能之一。 顾名思义,这是您需要的专业解决方案。

另请阅读我们的 5 WordPress插件可在博客上创建常见问题解答

其特点是:优化利用图像易于定制,流动的硝化,p许多布局更多。

下载| 演示| 虚拟主机

2。 ARMember

ARMember 是一个 WordPress插件 内容保护。 这是一个独特的解决方案,可让您在任何网站上销售订阅。 它具有一整套工具,可让您 保护 全部或部分内容。

Armember Wordpress会员插件

它的另一个特点是它提供了一个免费选项,但在功能方面有点有限。 说到功能,这个强大 WordPress插件 除其他外提供: 的可能性 计划其内容,支持多种订阅计划,易于配置,不同订阅计划之间的迁移, WooCommerce支持,几种型号 形式等等。

它也是该领域的参考。

下载 | 演示 | 虚拟主机 

3。 WooCommerce购物车基于运输

购物车运输 允许您根据客户购物车中的商品设置不同的运费。 有三种计算方法:按总价,按购物篮中的物品数和按重量。 WooCommerce-车为基础,航运插件 -  WooCommerce  - 航运为主的上车

例如,购物篮的小计或重量越大,或者客户购买的物品越多,运费也越高。

另见我们的 10 WooCommerce插件创建运输方案

您也可以将此功能设置为仅在某些国家/地区可用。

下载 | 演示 | 虚拟主机

推荐资源

查找有关其他推荐资源的信息,以帮助您构建和管理网站。

结论

这里 ! 这就是本教程的内容,它向您展示了如何在WordPress中安全地添加自定义CSS代码。 如果你有 评论 或建议,请随时在保留部分中告知我们。

但是,您也可以咨询我们的 RESSOURCES,如果您需要更多的元素来执行创建Internet网站的项目,请参考我们关于 WordPress博客创建 或者那个 Divi:有史以来最好的WordPress主题.

但与此同时, 在您不同的社交网络上分享此文章

...