JustNews主题显示友链图标教程

如果你用了justnews的可视化编辑首页，将links.php中对应代码替换为以下代码；如果你用默认的首页，修改index.php对应代码：请注意修改代码中的png图片，是默认的网站图标。

<div class="sec-panel-body">
<ul class="list list-links">
<!--?php foreach($bookmarks as $link){ if($link--->link_visible=='Y'){ ?>
<li class="links"><img alt="<?php echo $link->link_name?>" src="<?php%20echo%20$link->link_image?>" onerror="javascript:this.src='https://oss.iymark.com/2021/03/2021030215074746.png'"><a <?php="" if($link-="">link_target){?>target="<!--?php echo $link--->link_target;?>" <!--?php } ?--><!--?php if($link--->link_description){?>title="<!--?php echo esc_attr($link--->link_description);?>" <!--?php } ?-->href="<!--?php%20echo%20$link--->link_url?>"<!--?php if($link--->link_rel){?> rel="<!--?php echo $link--->link_rel;?>"<!--?php } ?-->><!--?php echo $link--->link_name?></a></li>
<!--?php }} ?-->
</ul>
</div>

然后，添加如下自定义css代码：

.list-links img {
    width: 20px;
    margin-right: 5px;
}
.list-links .links {
    float: left;
    padding: 5px 5px 0 5px;
    text-align: justify;
    width: 9.5%;
    border: 4px solid #f1f1f1;
    margin: 2px;
	background:#f1f1f1;
}
@media (max-width: 1240px){
	.list-links .links {
    width: 32.2%;
}
}
@media (max-width: 991px){
	.list-links .links {
    width: 46%;
}
}
.list-links {
    display: inline-block;
}
.list-links a {
    width: 70%;
    white-space: nowrap;
    word-wrap: normal;
    text-overflow: ellipsis;
    overflow: hidden;
	line-height: inherit;
	margin:0;
}

最终的效果，可以在本站首页页脚查看