杨泽业:给你的mipmcs网站默认模板添加网站logo详细教程

  • 时间:
  • 浏览:277
  • 来源:网站服务商官网

网站服务商杨泽业:给你的mipmcs网站默认模板添加网站logo详细教程


今天我在我的另一个新的网站上面,感觉还是必须添加logo才更加有意义,但是默认的模板是显示文字的,于是我今天就开始研究怎么把默认的mipcms网站添加logo,而且在电脑和手机上面都能完美的展示。经过我在测试的网站什么操作,已经完美的解决了问题,于是就把研究的成果分享给大家,希望对想添加logo的人有用。


一、关于logo的高度,宽度,格式。


1.1、logo的高度。在默认的网站导航栏里面,默认的高度是60px的,所以我们做的logo的最大高度不应该超过60px,超过的话,就会拉高了默认模板的高度,感觉很难看。logo的高度建议在50-60px之间,网站服务商网设计的宽度是60px。


1.2、logo的宽度。宽度我觉得是不限制的。根据自己的实际需求来做。如果logo上面的字或者图像多的话,就会宽一点,字少就会窄一点,所以说,logo的宽度,每个网站都不应该是一样的,各自设计自己的logo的宽度就行了。网站服务商网设计的宽度是120px。

1.3、logo的格式。我的建议是设计透明背景的png格式的logo,那样可以与网站底色一致,不会感觉看起来怪怪的。

1.4、ftp上传logo。我们把做好的logo.png图片,上传到网站的指定位置,我是建议和网站服务商一样上传到网站的根目录里面即可。


二、修改网站代码

2.1、替换原理。理论上只要把显示文字地方{$mipInfo['siteName']}改成显示图片<mip-img src=""></mip-img>就行了,实际上呢?这样做是不行的,电脑看起来还好,到了手机上面那就把logo全屏显示了。logo缩放得超大,太难看了,所以我们还要添加一个样式表才行。


2.2、图片代码替换文字代码。我们打开头部模板文件,路径/template/default/main/header.html里面的把logo图片加一个样式就行了代码是{$mipInfo['siteName']}改成<div class="logo"><mip-img src="{$domain}/logo.png"></mip-img></div>。


2.3、从第4行起,代码是:

<div class="logo-text">

<a data-type="mip" href="{$domain}" data-title="{$mipInfo['siteName']}">

<div class="logo"><mip-img src="{$domain}/logo.png"></mip-img></div></a>

</div>


2.4、修改好的代码上传到网站里面,替换原来的内容。我们这里的代码是没有指定logo的宽度和高度的,也不需要指定大小,因为每个人是不一样的。


三。修改网站的  css样式表文件。

我们在样式表mipcms.css的文件,路径/public/assets/default/css/mipcms.css最后一行添加下面的代码即可:

.logo img {

  vertical-align: middle;

  width: auto;

  min-width: auto;

  height: auto;

}

上面的 css样式代码也是没有指定宽度和高度的,自动大小就行,设计多大就是多大,最大也是不会超过原来的大小的,这样的话,就不会全屏缩放了,在电脑和手机都能完美展示了。大家可以看看本站网站服务商的效果哦!

猜你喜欢

最新mjpjz5.0模板全新为你服务,功能更强体验更佳

mipcms源码升级为全新的mipjz,新的源码,有着新的改变,让网站功能更佳强大,用户体验也更加友好。网站服务商杨泽业一直致力于mipjz的模板的改进与优化,同步推出了使用于

2019-02-18  分类:本站公告  浏览:11次

全新mipcm5.0的模板上线,现在预订只要30元

由于团长在2019年元旦放出了mipcms5.0的最新源码,MIPCMSv5.0是基于MIPCMSv3.6基础上重构版本,新增标签分类模板功能,新增标签推送功能,新增搜索功能等

2019-01-09  分类:本站公告  浏览:127次

永久虚拟主机即将下架,目前特价预定中,一旦错过就再也没有了!

永久虚拟主机即将下架,目前特价预定中,一旦错过就再也没有了!由网站服务商杨泽业代理的永久美国虚拟主机和永久的香港虚拟主机12月31日下架,元旦以后再也买不到了。因此,未来想做多

2018-12-30  分类:本站公告  浏览:156次

杨泽业:给你的mipcms网站添加自定义缩略图的功能

网站服务商杨泽业:给你的mipcms网站添加自定义缩略图我们在最新版本的mipcms3.6中的,默认的文章里面,在添加文章的时候,是没有自定义缩略图的功能,而在我们实际发布文章

2018-12-30  分类:mipcms  浏览:149次

杨泽业:修改mipcms网站后台地址的方法

在mipcms的网站系统里面,默认的网站后台地址是/admin或者/?s=/admin因为每个人都知道这个网站后台地址,所以就容易引起别人的暴力破解,我们修改了网站后台的登陆地

2018-12-25  分类:mipcms  浏览:240次