织梦友情链接为何只显示一行？

修改CSS样式（最推荐，最简单）

这是最直接、最安全的方法，不会影响DedeCMS的核心文件，升级系统时你的修改也不会丢失。

核心思想： 让友情链接的容器（div或ul）能够自动换行。

1. 找到CSS文件 你的网站CSS文件通常位于 /templets/你的模板名称/style/ 目录下，文件名可能是 style.css、main.css 或 default.css，请根据你的模板实际情况查找。

2. 添加或修改CSS代码 在CSS文件中，找到控制友情链接的样式类，常见的类名有：

   • .flink
   • .friendlink
   • .linkbox

   找到对应的样式块后,在里面添加或修改以下属性：

   
   （图片来源网络，侵删）

   .flink { /* 假设你的友情链接容器类是 .flink */
       width: 100%; /* 确保容器宽度占满，或者设置一个固定宽度 */
       word-wrap: break-word; /* 允许长单词或URL地址换行 */
       white-space: normal;   /* 取消默认的 pre-wrap 或其他不允许换行的设置 */
   }
   .flink a { /* 控制每个链接的样式 */
       display: inline-block; /* 让链接可以设置宽高，并随内容换行 */
       margin-right: 10px;    /* 设置链接之间的间距 */
       margin-bottom: 10px;   /* 设置行与行之间的间距，这是换行的关键 */
   }

   代码解释：

   • white-space: normal;: 这是关键，默认情况下，织梦的友情链接可能设置了 white-space: nowrap;，这会导致所有链接都在一行内显示，将其改为 normal 就允许内容自动换行。
   • display: inline-block;: 让每个链接既能像行内元素一样排列，又能设置宽高和内外边距，方便布局。
   • margin-bottom: 10px;: 为每个链接添加下边距，这样当一行排满后，下一个链接就会自动换到下一行，并且与上一行保持一定距离。

3. 保存并刷新网站 保存CSS文件后，刷新你的网站页面，友情链接就会自动换行了。

修改模板文件（如果CSS方法无效）

如果修改CSS后没有效果,可能是模板的HTML结构或织梦的标签属性有问题，这时可以尝试修改模板文件。

核心思想： 检查模板中调用友情链接的代码，确保其没有被固定宽度的容器限制。

1. 找到模板文件 友情链接通常在网站的页脚（footer）或者侧边栏（sidebar）中，对应的模板文件是 /templets/你的模板名称/footer.htm 或 /templets/你的模板名称/index.htm 等。

2. 检查并修改调用代码 在模板文件中找到调用友情链接的织梦标签，它通常是这样的：

   {dede:flink type='text' row='24'/}

   或者

   {dede:flink type='image' row='24'/}

   检查点 1：移除 type='all' 或其他可能限制显示的属性 有时 type 属性可能会影响显示，你可以尝试移除它，或者明确指定 type='text' 或 type='image'。

   检查点 2：检查父容器的宽度（最常见的原因） 友情链接标签本身可能没有问题，但它被包裹在一个固定宽度的 div 里了。

   <div style="width: 300px;">
       {dede:flink type='text' row='24'/}
   </div>

   这个 div 的宽度被设置为 300px，而你的友情链接如果总宽度超过300px，自然就会被挤压成一行，你需要修改这个 div 的宽度，或者去掉宽度限制。

   修改示例： 将固定宽度改为100%或者直接去掉宽度限制。

   <!-- 修改前 -->
   <div class="footer-links" style="width: 500px; overflow: hidden;">
       {dede:flink type='text'/}
   </div>
   <!-- 修改后 -->
   <div class="footer-links">
       {dede:flink type='text'/}
   </div>

   然后回到 方法一，为这个 .footer-links 类添加CSS样式来控制换行。

总结与排查步骤

当遇到“友情链接只有一行”的问题时，请按以下步骤排查：

1. 首选方法：修改CSS。

   • 找到你的模板CSS文件。
   • 为友情链接的容器（如 .flink）添加 white-space: normal;。
   • 为友情链接的每个链接（如 .flink a）添加 display: inline-block; 和 margin-bottom: 10px;。
   • 刷新页面查看效果。

2. 如果CSS无效，检查模板HTML。

   • 找到调用友情链接的模板文件（如 footer.htm）。
   • 检查 {dede:flink/} 标签的父级 div 是否有固定的 width 或 overflow: hidden; 等样式，如果有，移除或修改它们。
   • 确保 white-space: nowrap; 没有在父级样式中出现。

3. 检查缓存。 有时修改文件后，由于浏览器或DedeCMS缓存了旧页面，导致看不到效果，请务必清除浏览器缓存和DedeCMS后台的“生成” -> “更新缓存”。

通过以上两种方法,99%的“友情链接只有一行”的问题都能得到解决，通常情况下，方法一就足够了。