毕节网站开发公司:如何修复WordPress中缺少的边栏-极简慕枫

毕节网站开发公司:如何修复WordPress中缺少的边栏

2019-04-25

毕节网站开发公司在WordPress中不时会发生一些疯狂的事情,这些事情会导致站点的布局删除你的侧边栏,或者做一些奇怪的事情,比如把它移到你的内容下面或者放在页脚上。WordPress缺少的侧边栏通常只是代码错误的结果。有时,它是由一个主题,插件,甚至一个更新错误引起的。幸运的是,只要一点故障排除就可以修复它。

WordPress缺边条的故障排除

缺少的侧边栏问题几乎总是由您最近所做的更改引起的。这种变化可能是由于:

  • 新主题
  • 一个新插件
  • 最近的一篇文章
  • 最近对代码的修改

有些修复方法很简单。其他人可能需要一些时间来通过代码和补救。有了几个简单的故障排除过程,这不会太困难。让我们看看几个例子,看看如何修复它们。

设置和简单解决方案

毕节网站开发公司在排除故障时,我学到了一种困难的方法,即先看简单的事情。当问题是主题中的简单设置时,花半天时间研究代码太容易了。从最近的任何添加或更新开始,如代码、主题和插件。

在深入研究代码之前,让我们先看看一些非常简单的东西,它们很容易被忽略。对于那些拥有大量WordPress经验的人来说,其中一些可能是显而易见的,但即使是使用WordPress多年的人也可能没有遇到过。例如,它有可能已经使用WordPress多年,从来没有改变主题。

小部件随着新主题消失

 

毕节网站开发公司

有时,解决方案很简单,当您切换到一个新主题时,需要放置小部件。

Widgets Disappear with New Theme widget area

主题有不同的小部件布局,当您进入一个新主题时,必须设置它们。

毕节网站开发公司在本例中,小部件区域已经就位,但其中没有小部件。

毕节网站开发公司

拖放小部件,您就可以重新启动并运行。

后布局设置

 

Post Layout Settings

许多主题有额外的设置,您可能需要检查。例如,Divi为您提供了一组额外的POST设置。在屏幕右侧的帖子标题对面是一个名为DVI后设置。在这里你会发现一个下拉框叫做页面布局。你可以从右边框, 左边框,和全宽. 全宽关闭那个帖子的侧边栏。如果您在某些页面或帖子上有侧边栏,而在其他页面或帖子上没有,这可能是问题所在。

更新WordPress

确保你没有错过更新。WordPress和主题是这个问题最重要的部分。有时,您可能需要重新安装WordPress或主题。

修改主题

发生这个问题的一种方法是修改主题,然后更新它。一旦更新主题,所有自定义代码都会丢失。

有两种方法可以解决这个问题:

  1. 用一个孩子的主题。在使用子主题时,仍然需要确保更新父主题。
  2. 保存自定义文件,并在更新主题后将它们粘贴回。

电码

有时我们在代码上会出错。相信我…这很容易做。一些简单的东西,如使用侧边栏的名称,而不是id,就足以破坏布局的正常禅宗状态。有时,这是由代码中的错误导致的,该错误使代码无法进一步执行。它甚至可以是帖子中的代码。当发生这种情况时,您可以在每个页面上看到侧边栏,除了带有该帖子的页面。

毕节网站开发公司在开始对代码进行实验和更改之前,请确保您有最近的备份。相信我,它更糟的是,备份是你最好的朋友。事实上,在更新WordPress、主题、插件或修改代码之前,一定要做备份。如果有任何问题,您可以将其还原到原始版本。

员额内代码

将代码粘贴到POST中可能很棘手。在从其他来源复制代码时,很容易遗漏一个标记,或者意外地从Word处理器(如MicrosoftWord)嵌入随机代码(Word有时会添加自己的格式。我曾经通过粘贴Word中的Amazon附属代码来杀死我的侧边栏)。通常,POST中的随机代码片段会将侧边栏移动到页面底部。

简单得像额外的东西</div>会引起问题。这可以使主题响应就像侧边栏在div元素包装器之外一样。还检查未关闭的div元素。另一个可能的原因是类别跨度太宽,并将侧栏的内容推到底部。看看您在侧边栏和小部件中放置的任何代码。这也可能是由于插件的问题或设置宽度的CSS太高。

Code Within Posts widgets in footer

在本例中,侧栏移动到页脚,注释提交登录移动到侧栏位置。它只在此帖子或包含此帖子的屏幕上执行此操作。若要查找问题,请分别访问每个帖子,直到找到与问题有关的特定帖子为止。接下来,进入该帖子的编辑模式。

Code Within Posts div

为了排除故障,我去了帖子并选择了文本标签。我找到了一段代码,当我从另一个来源复制文本时,没有删除这些代码。结束了</div>但它没有匹配的开口<div>。我删除了代码,侧边栏移回了正确的位置。

W3开发工具

毕节网站开发公司

W3开发工具是一组在线工具,用于验证您的代码。它将测试HTML,CSS,移动兼容性,RSS提要,链接等等。它查找缺少的部分,并将突出显示所有的问题,以便您可以进一步排除它们。如果您有大量代码要解决,或者您无法找到问题,这是一个很好的选择。您可以键入希望它检查的URL,将代码作为文件上载,或将代码粘贴为直接输入。然后它将测试代码并进行分析。

W3 Developer Tools 2

我粘贴了我的URL,它给了我一系列的错误,以排除故障。但是,如果有很多错误不是问题的一部分,这就会变得混乱和费时。

样式表

这个问题可能是由主题样式表中的代码引起的。你可以在下面找到它外观> 编辑。向下滚动并单击样式表在……下面风格.

您应该看到如下代码:

.sidebar

这是二十六号的代码:

.sidebar {
float: left;
margin-left: 75%;
padding: 0;
width: 25%;
}

StyleSheet no sidebar

在这个例子中,当我试图修改二十六个主题时,我犯了一个简单的错误。

.sidebar {
float: right;
margin-left: -100%;
max-width: 413px;
position: relative;
width: 29.4118%;

Float告诉侧边栏它在屏幕上的位置。我发现浮动和保证金头寸已被交换。代码应该如下所示:

.sidebar {>
float: left;
margin-right: -100%;
max-width: 413px;
position: relative;
width: 29.4118%;
}

StyleSheet with sidebar

我的侧边栏回来了。其他可能导致这种情况的问题是使用错误的宽度百分比和像素大小。你可以做实验,看看什么最适合你的主题。

小部件

如果您正在初始化小部件,请确保使用小部件的ID,而不是它的名称。这主要体现在程序员将链接放回公司的免费主题中。下面是代码在二十六个主题中的一个例子。

function twentysixteen_widgets_init() {
register_sidebar( array(
'name'          =&gt; __( 'Sidebar', 'twentysixteen' ),
'id'            =&gt; 'sidebar-1',
'description'   =&gt; __( 'Add widgets here to appear in your sidebar.', 'twentysixteen' ),
'before_widget' =&gt; '&lt;section id="%1$s" class="widget %2$s"&gt;',
'after_widget'  =&gt; '&lt;/section&gt;',
'before_title'  =&gt; '&lt;h2 class="widget-title"&gt;',
'after_title'   =&gt; '&lt;/h2&gt;',
) );

毕节网站开发公司在主题中Functions.php文件搜索寄存器侧栏然后查看小部件的id。

// Adds a class of no-sidebar to sites without active sidebar.
if ( ! is_active_sidebar( 'sidebar-1' ) ) {
$classes[] = 'no-sidebar';
}

现在搜索侧栏的id和name,并确保使用的是id,而不是名称。

Widgets sidebar under content

将这一行从id更改为名称将侧边栏移到内容下面。

Widgets sidebar correct

将其更改为id将侧边栏移回原处。

小部件本身就是问题所在。打开文本小部件,查找丢失或错误放置的代码。额外的标记会在小部件中引起问题,就像它们在POST中一样。如果您不确定是哪个小部件导致了问题,您可以一次一个地删除它们,直到问题消失为止。或者,您可以将它们全部删除,以查看问题是否已修复,当问题解决时,您可以一次将它们添加回一个,直到找到包含错误代码的小部件为止。

注意:它甚至不需要在文本小部件中有代码。一个空文本小部件有时足以阻止您的其他小部件加载。删除所有不必要的小部件;特别是那些没有内容的小部件。

向主题添加边栏

毕节网站开发公司有些主题是在没有侧边栏的情况下设计的。如果您想要添加它们,请查看我们的教程如何管理WordPress边栏.

最后思想

WordPress缺少的侧边栏问题可能是一个麻烦,并使您的网站看起来摇摇欲坠,直到你找到正确的修复。快速查看您的设置和代码将发现大多数可能的问题,并帮助您的网站恢复和正常运行。