人们为什么首先使用网站搜索表单?这是因为他们正在寻找通过浏览网站或使用导航无法获得的直接相关结果。
有时,这些搜索结果会提供其问题的答案(例如有关公司退货政策的信息)或匹配的产品或内容列表(例如与页面构建器插件相关的博客文章)。无论他们要寻找什么,都可以肯定地说一件事:
访问者希望您的WordPress搜索表单能够快速,准确地提供结果。
只需移至Kinsta,即可将WordPress网站的速度提高200%。 今天免费迁移
当您从整体上看消费者行为时,这很有意义。Google设定了几乎不可能的在线搜索标准。根据SparkToro的调查结果,Google中超过一半的搜索为零点击。基本上,Google使搜索变得如此高效,人们通常不需要访问网站即可获得问题的答案。
当然,您的网站访问者不是在使用内部搜索期望或希望获得零点击结果。他们使用搜索来查找网站的其他部分以进行探索。但是,您的WordPress搜索和Google搜索的共同点是:消费者希望他们俩都能提供快速,便捷和高度相关的结果。
只有一个问题:WordPress的本机搜索功能不是很好。
因此,在本指南中,我们将探索您需要了解的所有信息,以为访问者优化WordPress搜索体验:
内部搜索到底有多重要?
如果您以正确的方式设计网站,访问者自然会遵循您摆在他们面前的途径。井井有条的菜单也有帮助。
也就是说,内部搜索在其中起着重要作用。
将WordPress搜索视为您网站的快速通行证。当您的搜索功能执行应有的方式时,它可以在几秒钟内将访问者从步骤1带到步骤5。
这对于内容丰富的WordPress网站尤其有用。这里有些例子:
电子商务
NordicWare之类的在线商店可以帮助访问者从主页访问:
NordicWare:主页中带有搜索栏的标题
只需使用网站右上角的搜索栏,即可缩小产品列表的范围:
NordicWare:搜索结果页面
通过始终显示商品搜索表单,访问者无需浏览商店的菜单或类别就可以找到要购买的特定商品。
博客,播客和新闻站点
拥有大量内容存储库的网站(例如Kinsta)(拥有39页博客文章(并且正在不断增长))将受益于搜索栏:
Kinsta:博客页面和分页
通过在博客的顶部放置特定于博客的搜索表单,读者可以比滚动39页更快地找到所需主题。
Kinsta博客顶部的WordPress搜索栏
博客可能很难浏览很多内容。由于您想保持博客页面简短以保持较高的加载速度,因此增加显示的帖子数量不是一个好主意。
取而代之的是,搜索栏将帮助您的访问者更有效地浏览与他们当前兴趣无关的帖子。
列表网站
搜索是访问者在汇总列表(例如房地产,旅游,专业服务等)的网站上进行的首批操作之一,例如Trulia的示例:
Trulia:主页搜索属性
搜索元素总是足够简单就可以开始。例如,指定位置,人员姓名或职务。但是结果页始终使用户能够根据需要过滤其结果:
Trulia:示例搜索结果页面
知识库
搜索是帮助中心和Elementor等产品的知识库的有用组件:
Elementor:知识库文章的主题和计数
与手动搜索以下类别相比,搜索可以帮助用户更快地找到问题的答案:
Elementor:在文档中搜索“模板”
在许多情况下,用户自己可以轻松解决用户使用SaaS产品所遇到的问题。如果您希望保持实时聊天和服务台支持中不存在易于解决的问题,请使您的知识库易于搜索。
底线
如果您的网站上有很多东西,请不要以为导航会帮助访问者浏览网站。建立类似快速通行证的搜索体验,将他们准确地带到他们需要和想要去的地方。
如何将搜索添加到您的WordPress网站
您可以使用一些选项来实现和启用网站的基本WordPress搜索:
使用主题将WordPress搜索添加到菜单
取决于您安装的WordPress主题,您只需单击几下就可以将搜索添加到菜单中。在此示例中,我使用的是Astra主题。
首先要做的是进入外观>自定义:
WordPress–导航到“自定义”菜单
接下来,转到标题>主菜单。
WordPress–自定义菜单
在“菜单中的最后一项”下,从下拉菜单中选择“搜索”。
WordPress–将搜索栏添加到菜单
这会将搜索图标和栏添加为导航菜单的最后一个元素。
WordPress–搜索栏添加了主题设置
使用其他WordPress主题时,此搜索激活设置可能与主题定制器不在同一个位置。如果有的话,您可以在“标题”设置下找到它。否则,您必须使用以下选项之一手动添加它。
使用WordPress小部件添加搜索
WordPress小部件使您可以将内容添加到内容周围的元素(如侧边栏和页脚)中的专用块中。
您可以使用WordPress小部件创建的一种内容块是搜索栏。
首先在外观菜单下找到小部件:
WordPress–找到“小部件”菜单
您会在这里找到所有可用的小部件部分。根据您使用的主题或模板,您可能只会看到补充工具栏或页脚,或者可能会看到更全面的选择,例如:
小部件和部分的示例
无论如何,现在您需要确定要在搜索栏上显示的位置。
假设您计划每天发布新的博客内容,并且知道存档将迅速增长。因此,在每个博客页面上都显示一个搜索栏将是有益的。
滚动到小部件的底部,然后找到一个名为“搜索”的小部件:
搜索小部件
您可以通过单击它并选择添加它的部分来添加它,如下所示:
通过下拉菜单添加搜索小部件
或者,您可以将小部件拖放到希望其显示在其中的节中:
通过拖放添加搜索小部件
将其放置在所需位置后,为其命名:
给您的搜索窗口小部件命名
保存所做的更改,然后访问您的站点以确认它看起来像您想要的样子:
搜索栏已添加到博客
现在您可以看到搜索栏位于博客侧栏的顶部,可供读者使用。
使用WordPress工具将搜索添加到您网站的主要内容
虽然将搜索栏放置在网站上始终显示的元素中很有用,但您可能也会发现有理由将其包含在页面的实际内容中。
有几种方法可以做到这一点:
使用WordPress编辑器
古腾堡(Gutenberg)编辑器无疑使设计更具创意的页面布局更加容易,而不必依赖HTML或简码。
现在,借助WordPress编辑器,您可以将此类元素添加到页面中的是搜索小部件:
在古腾堡中搜索小部件块
使用此选项时,您可以更好地控制搜索栏的显示方式。例如,您可以更改搜索栏的标题,占位符文本以及按钮:
使用古腾堡自定义搜索栏
您甚至可以使用自定义CSS类更改搜索块的样式。
使用页面构建器插件
对于那些喜欢使用Elementor拖放式页面构建器插件的人,您也可以使用所选插件访问搜索小部件。该过程类似于您对Gutenberg所做的操作。
在打开新页面或帖子并激活Elementor编辑器的情况下,从Elements列表中搜索WordPress搜索小部件:
在Elementor中搜索小部件
将“搜索”元素拖到希望其在页面上显示的位置。例如,这是一个404页,可帮助用户使用搜索栏重新回到正轨:
带有搜索栏的404页面示例
如您所见,与Gutenberg相比,页面构建器插件使您可以更好地控制WordPress搜索栏的显示位置,从而可以在其他内容之上和之中进行分层。
带有主题
在某些情况下,您可能会发现一个主题和模板,该主题和模板会自动将搜索添加到您的网站内容中。不过,执行此操作的主题类型往往非常专业,例如“住宅房地产”主题:
住宅房地产主题演示
由于在这样的列表网站上搜索可能会变得复杂,因此主题开发人员会将功能内置到模板中是有意义的。
预订网站主题是带有内置搜索功能的另一个示例,就像旅行预订主题中的演示一样:
旅游预订主题演示
可以想象,将搜索功能内置到您的WordPress主题和模板中将为您自己构建一些复杂的内容节省很多麻烦。而且,如果主题针对性能进行了优化,那么它的搜索引擎解决方案也应该是(同样,无需担心的一件事情)。
使用代码添加WordPress搜索
还有一种方法可以在您的网站上添加基本的搜索表单,但这需要您对编码感到满意。
为此,请转到外观>主题编辑器:
主题编辑器
您要做的是使用functions.php主题文件为搜索栏创建一个简码:
functions.php主题文件
在文件底部,添加以下代码段:
add_shortcode('shortcodename','get_search_form');
将“shortcodename”替换为您自己的搜索表单名称。确保全部为小写字母,没有空格,数字或符号。更新文件后,您可以在网站上开始使用您的简码。
这是一个例子:
自定义简码,用于将搜索栏添加到您的网站
以将任何常规文本添加到站点的方式添加了简码。只需记住将其括在方括号()中即可。
虽然您将无法在编辑器中看到搜索栏,但是请查看页面的预览,然后您会在网站的前端看到它:
搜索栏添加了简码
尽管这是一个快速的编辑,这对本文的目的是有好处的,但是最佳实践建议不要编辑主题的代码,而是创建WordPress子主题。
关于WordPress搜索限制的注意事项
您可以使用很多选项将基本的WordPress搜索功能添加到您的网站。但是够了吗?
除非您拥有一个很小的网站,或者想要将搜索限制在博客上,否则它可能不会。让我解释。
WordPress的本机搜索表单可浏览您的网页和博客文章中的以下几种内容:
- 页面标题
- 段落文字
- 图片标题
- 图片标题
- 图片替代文字
- 档案名称
您可以想象,这对您的用户来说是难以置信的限制。对于初学者来说,如果您需要从网站上其他类型的页面或内容(例如WooCommerce产品)中检索结果,则基本搜索表单不会显示与其匹配的结果。网站的其他元素也是如此:
- 小部件
- 用户评论
- 分类和标签
- 图片库标题,标题和替代文字
- 自定义字段
- 和更多
WordPress搜索不仅限于显示的结果。它的大小也受限制。您的网站越大,数据库处理结果的难度就越大,将结果提供给访问者的时间就越长。
那么,如果您需要比WordPress搜索所允许的功能更强大,更可持续的产品呢?
让我们看一下改善它的一些方法。
如何改善内部WordPress搜索体验
如果满足以下至少一项要求,则应阅读有关修复WordPress搜索的下一部分:
- 您的网站上有一千多页的内容或产品。
- 您的数据表明内部搜索很流行,但并没有带来任何转化。
- 您的搜索表单正在采取很多行动,但是您的网络托管服务器正在努力处理请求(即,加载结果需要花费几秒钟的时间)。
- 您希望扩展网站,而不必担心搜索会在整个过程中使您(和访问者)失败。
- 基本搜索并没有减少它。您需要更高级,更敏捷的功能来处理用户执行的各种搜索。
准备潜水了吗?您可以采取以下6项重要措施来改善WordPress搜索:
提示1:创建自定义搜索页
与其给访问者一个简单的搜索栏来帮助他们在您的站点上滑动,不如创建一个自定义搜索页面?
在网站菜单中搜索“牛仔布”
似乎您的访客似乎不熟悉搜索,但是可以通过专门的搜索页面来改善体验。
要创建自定义页面,您需要通过FTP或文件管理器对网站进行后端访问。
进入WordPress数据库后,将查找以下文件路径:
/wp-content/themes/(您的主题名称)/page.php
page.php是一个文件,用于定义网页的基本结构。换句话说,它是页面模板。我们现在要做的是为您的搜索页面创建一个模板。
重要
注意:如果看到名为search.php的文件,请不要理会它。该文件决定了搜索结果页面的显示方式,而不是初始搜索页面的显示方式。
复制page.php,并将新文件命名为searchpage.php。然后,打开它进行编辑。
将page.php代码示例复制到新文件中
该文件中的大多数代码都需要替换,因为此处定义了典型的网页或博客文章。相反,您需要将其剥离回来,使其仅包含搜索页面上所需的内容。这是我如何构建搜索页面的示例:
搜索我们的商店
欢迎来到很棒的在线商店!在这里,您会发现各种各样的产品,彻底改变您的工作,生活和娱乐方式。
使用下面的搜索表格,使自己朝正确的方向前进。
WordPressCodex提供了有关创建自定义搜索页面时可以做什么和不能做什么的更多指导。但是,如果您喜欢我将要展示的结果,那么您可能唯一需要更改的是出现在以下内容之间的内容:
和:
保存searchpage.php模板后,请返回WordPress。现在,我们需要创建一个名为“搜索”的页面。
给页面命名,然后打开侧栏上的“页面属性”。您将看到刚刚创建的“搜索页面”的模板:
搜索页面模板已创建
选择搜索模板,然后发布页面。现在,您将在实时网址(应该为https://yourdomainname.com/search/)上看到该网址。而且,如果您使用了与上面的代码相似的代码,则将导致页面看起来像这样:
WordPress中的自定义搜索页面示例
创建并发布此页面后,您可以根据需要进行操作。您可以将其添加到菜单中或链接到其他位置。只要确保链接放置在您的访客容易看到它的地方即可。
提示2:让您的WordPress搜索不仅限于页面和帖子
尽管上面的技巧为您提供了一个运行WordPress搜索的新地方,但是它不能解决搜索哪种内容的问题。对我们来说幸运的是,有许多插件可以解决此问题。
使用WP扩展搜索升级基本WordPress搜索
如果您只想能够浏览网站上的更多内容和元数据,那么WP扩展搜索是一个不错的选择。
WordPress中的WP扩展搜索设置
使用此插件,您的访客将能够从以下位置检索结果:
- 帖子
- 页数
- 媒体文件
- 分类目录
- 标签
- 摘录
- 元数据(如作者姓名)
这是一个轻巧且易于配置的插件,可改善小型企业网站和博客的基本搜索功能。
使用高级Woo搜索升级WooCommerce搜索
如果您有电子商务网站,则可以改用AdvancedWooSearch插件。
启用后,您可以将WooCommerce搜索表单放置在网站上的任何位置。如果您希望它替换已经存在的所有基本WordPress搜索表单,则该插件具有快速的“无缝集成”选项,可以自动将它们替换为您。
您也可以手动将表单添加为小部件或简码。由你决定。
该表格将类似于基本的WordPress表格:
Woo高级搜索示例
此表格与您以前的表格有两个主要区别。
首先是该表单搜索您的WooCommerce产品内容和元数据,包括标题,SKU,摘录,类别,标签和ID。
这是第二个区别:
Woo高级搜索:实时搜索结果
当您的访客开始输入他们的搜索查询时,将显示匹配的结果。这就是所谓的“实时”搜索,而且由于插件使用了AJAX,它可以即时发生。
如果这些选项看起来很有希望,但是您正在寻找WordPress搜索表单的更强大或更快速的升级,请继续阅读。
提示3:改善WordPress搜索结果的显示方式
接下来,让我们讨论一下您可以采取哪些措施来改善如何向访问者显示搜索结果。
这就是为什么您不能忽略此提示的原因:
默认显示搜索结果
默认情况下,WordPress搜索显示的结果与此页面相似。页面顶部将显示“搜索结果:(关键字)”,然后是每个匹配的页面或帖子。如果有特色图片(如上面的牛仔裤),它将完整显示。
然后摘录:
搜索结果显示大图和节选
这只是一个匹配结果。想象一下,如果有几个“牛仔”匹配,更不用说数十个或几百个,那么进入此搜索结果页面将有多困难。
要解决此问题,我们将寻找WordPress插件来提供帮助。
通过象牙搜索改善表格的外观
像上面提到的插件一样,象牙搜索使您可以选择从中提取哪种类型的内容和元数据搜索结果。不过,有了这个,您就不必在基本页面和发布数据或电子商务之间做出选择。您可以在这里挑选垃圾:
象牙搜索设置
关于此插件的另一个值得注意的提示是,它使您可以自定义搜索表单以及网站的其余部分:
象牙搜索:在主题定制器中定制设计
您可以控制搜索表单的所有方面:
- 色彩
- 文本
- 样式
- 表格动画
- 装载机图片
除此之外,您还可以配置诸如实时AJAX搜索之类的功能,并为访问者带来实时查看其匹配项的好处:
使用象牙搜索从自定义搜索栏中实时搜索结果
将此插件视为WordPress搜索的下一步。
自定义Ajax搜索的搜索结果显示方式
现在,不仅仅是搜索表单的外观会在访问者身上留下深刻的印象。您所做的结果显示也会影响他们的体验。
借助AjaxSearchLite和Pro插件,您将为它们带来更智能,更快捷的搜索体验,从而为他们带来惊喜。
以下是一些您可以做什么的示例:
AjaxSearch插件:搜索行为
行为使访问者的搜索体验更有效,例如,当他们开始键入内容时立即打开搜索表单,并将他们重定向到搜索结果,无论他们按下返回键还是放大镜图标。
Ajax搜索插件:自动完成和建议
自动完成和建议功能利用Google搜索功能来加快访问者的搜索速度。
AjaxSearch插件:关键字突出显示
关键字突出显示是另一个有用的功能,可以在匹配结果中突出显示用户的关键字。这使得更容易发现更相关的结果。
这是一个显示方式的示例:
搜索结果中突出显示的关键字
该插件还使您能够指示结果应如何显示:结果页面的布局方式和应显示的元素(例如精选图片+摘录+作者姓名)。
此外,您可以告诉搜索引擎从特定位置提取图像。例如,如果没有精选图片,则可以请求将页面上的第一张图片用于搜索结果。
您还可以决定如何裁剪每张图像以及以何种尺寸裁剪。这样,您可以使搜索结果页面的大小和外观更易于管理-随着网站内容量的增加,这一点变得尤为重要。
还有一件事:该插件不仅可以帮助您使搜索结果看起来更好。它也加快了他们在访问者面前的显示速度:
AjaxSearch插件:性能优化可加快搜索速度
您可以在此插件中进行三种性能优化:
- 应用自定义AJAX处理程序。
- 禁用图像裁剪。
- 在页脚中加载JavaScript。
通过配置这三个设置,可以帮助您的Web服务器不被连续搜索请求所淹没。
就是说,这只是优化WordPress搜索速度时的冰山一角。继续阅读以了解有关Elasticsearch的更多信息。
提示4:加快WordPress搜索
尽管WordPress搜索表单的外观和搜索功能很重要,但一切发生的速度也是如此。
通过Elasticsearch获得超快速和复杂的搜索功能
在某些时候,WordPress搜索插件和您的MySQL数据库将不再适用。当您网站的搜索查询不断增加时,确保最佳搜索体验的唯一方法是使用Elasticsearch。
Elasticsearch是一个开源搜索和分析引擎,以其速度,稳定性和可扩展性而闻名,它只是Elastic堆栈的一部分。当与Logstash(用于数据处理)和Kibana(用于数据可视化和管理)结合使用时,Elasticsearch以前所未有的方式为网站的搜索引擎提供支持:
- 查询更多内容类型(如PDF)和元数据
- 模糊匹配以减少“无结果”
- 相关内容建议
- 特定于地理位置的内容推荐
- 多面(多过滤器)搜索
- 更快的查询处理
- 实时访问搜索查询数据
尽管Elasticsearch是开源的并且可以免费使用,但是您将需要托管的Elasticsearch托管(这不是免费的)。您可以通过多种方式获得此信息:
1.ElasticPress+KinstaElasticPress插件使您能够将Elasticpress搜索功能无缝集成到WordPress网站中:
ElasticPress设置
如果您想在WordPress中使用Elasticsearch的高级索引和快速查询功能,这是一个不错的选择。如果您需要将Elastisearch添加到Kinsta托管的网站上,则应与客户支持联系并请求它,但是您将无法访问完整堆栈(Elasticsearch+Logstash+Kibana),因为在Kinsta上使用Elasticsearch仅限于将服务与WordPress集成以支持更快的查询。
要获得完整的堆栈访问权限,您需要使用外部Elasticsearch托管服务。
2.弹性如果需要,您可以直接使用源代码:Elastic。您也可以使用多种选择来部署搜索引擎。
您可以获得完整的堆栈,并利用其先进的数据处理和管理工具。这是设置和入门过程的一部分:
弹性:全栈部署配置
此外,您可以控制如何优化Elasticsearch服务器:
在Elastic中选择部署优化
根据您的网站将要处理的查询类型提供建议,这使您可以轻松决定如何最好地加快和增强搜索引擎。
如果您想简化设置,请改用Elastic的站点搜索工具:
弹性站点搜索仪表板
然后,您将被带到该仪表板,在该站点中,一旦您的站点被索引,您可以:
- 使用JavaScript代码段安装搜索引擎。
- 自定义搜索引擎如何与结果排名,权重和同义词一起使用。
- 管理可以显示在搜索结果中的内容。
- 设置转化跟踪。
- 配置搜索建议。
- 查看您的搜索查询数据。
它的解决方案不如ElasticStack强大,但是如果您只是在寻找易于实现和管理的高性能搜索,那么这是一个不错的选择。
3.亚马逊弹性搜索亚马逊拥有自己的Elasticsearch服务也就不足为奇了。如果您已经在使用AWS托管和部署服务,那么这对您来说是个不错的选择。
与上述选项类似,它是一项托管服务,可让您创建具有复杂查询功能的快速搜索引擎。
提示5:缓存搜索结果页面
优化WordPress搜索速度的另一种方法是通过缓存搜索结果。启用缓存后,您的服务器将不必一遍又一遍地连续处理相同的查询。相反,它将检索并显示静态搜索结果页面,从而为访问者提供近乎瞬时的结果。
启用缓存的一种方法是使用WordPress缓存插件。
Oneofthetop-ratedplugins,W3TotalCache,callsattentiontothecachingofsearchresultspages,sostartthereifyou’relookingforacachingsolutionthatprioritizesthekindsofperformanceoptimizationsyouneed.
OryoumighttryWPRocket.Althoughitdoesn’tcachesearchresultspagesbydefault,it’screatedtheCacheSearchResultshelperpluginforthatexactpurpose.
AnotherwaytoenablethisisbyusingtheAjaxSearchPropluginmentionedearlier.I’vealreadyshownyouafewwaysthattheLiteversionofthepluginoptimizessearchperformance.TheProversionaddsevenmoreoptimizations,includingimageprecachingandsearchphrasecaching.
Tip6:ActivateSearchTrackinginGoogleAnalytics
Lastbutnotleast,remembertoactivatesearchtrackinginGoogleAnalytics.You’llfinditunderAdmin>AllWebSiteData>ViewSettings.
ActivatingsearchtrackinginGoogleAnalytics
Toturnon-sitesearchtracking,switchthetoggleto“ON”.Thiswillrevealanewfieldcalled“Queryparameter”.ThisistheelementinyourURL(anddatabase)thatdefinesasearchqueryandresult.
ThesearchparameterforGoogleAnalytics
Theletter“s”,inthiscase,iswhatdefinesthesearchqueryonthewebsite.Ifyou’reunsureofwhatyourownsearchparameteris,runatestsearchandlocatetheletterorwordfollowingthequestionmark.
Ifyoursearchallowsvisitorstoselectcategoriesandfilters,youcanenablesitesearchcategories,too.Youmayneedtoindicatemultipleparametershere.
Onceyou’redonesettingupsearchinGoogleAnalytics,you’llbeabletofindallofyourdataunderBehavior>SiteSearch.
SitesearchdatainGoogleAnalytics
JustliketherestofGoogleAnalytics,thisdataprovidesyouwithawealthofopportunitytofigureout:
- What’sdrawingvisitorstoyoursiteinthefirstplace.
- Whichsearchtermsarequeried,butyourwebsitehasfailedtoprovideananswerorsolutionfor.
- Whichcontentorproductsgetsearchedthemost.
- Whichsearchqueriesleadtothemostconversions.
- Whichpagesmoresearchqueriestakeplaceon.
Paycloseattentiontowhatyourvisitorsaredoingwithsearchandyoucanmoreeffectivelyshapetherestoftheon-siteexperienceforthem.
Internalsearchisnormallyoverlookedbutitprovidesinvaluableinsightsaboutyourusers.LearnhowtoimproveandspeeduptheWordPresssearchfunctionality!??
ClicktoTweet
摘要
WordPresssearchmightseemlikeasimpleenoughmatter—anditisifallyouneedisabasicsearchfunctiontohelpvisitorsnavigateadozenorsopages.
YoucanaddasimpleWordPresssearchfunctiontoanumberofareasonyourwebsite,liketheheader,menu,sidebar,footer,andevenin-linewithyourcontent.Thereareanumberofwaysyoucanaddthesesearchelements,too:
- Yourtheme’ssettings
- AWordPresswidget
- Apagebuilderplugin
- Apre-madethemetemplate
- Code
Don’tforget:thelargeryourwebsiteisandthemorecomplexyournavigationbecomes,themoreyou’regoingtoneedasolutionthatenhancesyourWordPresssearchcapabilitiestoprovideabetterUXtoyourvisitors.AndabetterUX,mostofthetimes,resultsinincreasedconversionsforyou.
1Shares
Total:1
0
0
1个
0
0
0
0
0
.essb_links.essb_links_listlia{ margin-top:0px;}@mediaonlyscreenand(min-width:64em){ .container–narrow.pb–60, .knowledgebase.user-content{ 职位:相对 } .widget-share{ position:absolute; left:-200px; top:0px; height:100%; width:200px; box-sizing:border-box; } .widget-share-aligner{ width:200px; padding-right:62px; box-sizing:border-box; }html(lang="nl").widget-share-aligner{ width:210px; } .widget-share-inner{ padding-bottom:62px; } .knowledgebase.user-content.widget-share-inner{ padding-top:0; } .widget-share.amount{ 显示:flex; align-items:center; justify-content:flex-end; width:100%; margin-right:11px; font-size:14px; font-weight:500; margin-bottom:10px; } .widget-share.amountsvg{ margin-right:8px; margin-left:10px; } .essb_links.essb_links_list{ flex-direction:column; align-items:flex-end; } .essb_links.essb_links_listli{ display:block; margin-bottom:5px!important; } .widget-share__total{ margin-bottom:0px!important; } .widget-share__total.heading–small{ color:#999999; font-size:14px; font-weight:300; } .essb-total-value{ margin-right:4px; }
}.essb_links{ margin:0px; padding:0px;}.essb_counter_right{ display:none!important;}.essb_links.essb_template_circles-retina.essb_link_hackernewsa,.essb_links.essb_template_circles-retina.essb_link_reddita,.essb_links.essb_template_circles-retina.essb_link_maila,.essb_links.essb_template_circles-retina.essb_link_mwpa,.essb_links.essb_template_circles-retina.essb_link_buffera,.essb_links.essb_template_circles-retina.essb_link_linkedina,.essb_links.essb_template_circles-retina.essb_link_facebooka,.essb_links.essb_template_circles-retina.essb_link_twittera { color:#43414e!important; background:#f3f3f6!important;}
.essb_links.essb_template_circles-retinalia:focus,.essb_links.essb_template_circles-retinalia:hover{ border-color:#fff!important; background:#43414e!important;}
.essb_links.essb_template_circles-retinaa{ border-color:#f3f3f6!important; background:#f3f3f6;}.essb_links.essb_icon:before{ font-size:15px!important; top:8px; left:9px;}.essb_links.essb_icon{ width:32px; height:32px;}.essb_links.essb_counter_modern_right.essb_counter_right{ background:#f3f3f6!important;}@mediaonlyscreenand(max-width:63.999em){ .widget-share-aligner{ position:relative!important; top:0!重要; } .essb_links.essb_links_listli{ margin-right:8px!important; }}
内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/168653.html