档案日期2014的19

2014年5月12日 - 2014年5月18日

CDN bootstrap glyphicons图标IE下无法显示

百度,新浪等站点提供了CDN JavaScript公用库,包含了前端开发常用的JavaScript库文件与CSS样式表,开发者可以很方便地从这些CDN引用所需的样式文件,还可以保证不错的响应速度。

bootcss中文站、百度的bootstrap库引用方式如下所示:

<link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">
<script src="https://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js" type="text/javascript"></script>
<script src="https://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<link href="https://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" />

然而,在使用百度和新浪CDN的bootstrap 3.0.3时,笔者发现在IE下部分glyphicons图标无法正常显示,而在chrome浏览器下可以显示。

例如https://bookshadow.com/weblog/2014/05/13/bootstrap-carousel-js/中的轮播组件,在chrome下可以看到carousel左右两侧的三角形glyphicons图标,如下图所示:

bootstrap-carousel-glyphicons-chrome

而在IE浏览器下却无法显示,效果见下图。

bootstrap-carousel-glyphicons-ie

查阅stackoverflow上的相关问答,发现此贴中也提到了相同的问题:http://stackoverflow.com/questions/19026479/only-some-glyphicons-showing-in-ie

用户olahell的回答比较妥当:

I have found the solution. It was quite simple. Unfortunately I won't be able ...

继续阅读

bootstrap轮播插件使用方法

Bootstrap Carousel是一款实用的轮播组件,示例如下:

代码如下:


<div id="carousel-example" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
 <li data-target="#carousel-example" data-slide-to="0" class="active"></li>
 <li data-target="#carousel-example" data-slide-to="1"></li>
 <li data-target="#carousel-example" data-slide-to="2"></li>
 </ol><!-- Wrapper for slides -->
 <div class="carousel-inner">
 <div class="item active"> ...

继续阅读

Django Admin添加自定义模块

Django Admin是Django框架自带的管理模块,功能十分强大,只需简单的配置即可将数据库表中的数据添加至Django Admin进行管理,包含了常用的增删改查功能。

新增自定义管理模块配置的具体操作步骤如下:

0. 首先需要启用Django Admin模块,过程从略

1. 执行manage.py inspectdb > models.py (根据数据库表结构逆向生成models)

2. 将models.py移动至mysite目录下(模块目录)

3. 在mysite目录下新增admin.py,添加内容:


from mysite.models import Student
from django.contrib import admin
# Create your models here.
class StudentAdmin(admin.ModelAdmin):
	list_display = ['id','name','class']
	search_fields = ['id','name','class']

admin.site.register(Student, StudentAdmin) ...

继续阅读

使用插件更换WordPress Admin URL

一般情况下,WordPress生成一个缺省的admin URL http://www.yoursite.com/wp-login.php。由于这个链接众所周知,如果你泄露了密码或者在不止一处使用了同一个密码,未获授权的陌生人很容易就可以访问你的WordPress管理面板,这对你的站点是有害的并且使得你的站点容易被入侵。

管理面板的安全性是WordPress安全性的重要组成部分。为了确保管理面板的安全,我们可以更换缺省URL并创建一个自定义的URL来登录,登出,管理和注册我们的站点。

显然,最佳并且最容易的修改URL的方式是使用插件。在下面,我们只介绍几个最佳的URL自定义管理插件,然后我们以Lockdown WP Admin为例来展示更换WordPress 管理URL的详细步骤。

更换WordPress管理URL的最佳插件

在大多数情况下,使用一个合适的插件是自定义WordPress站点最简单的方式,尤其是对技术知识不多的用户来说。我们也可以使用一个简单的插件很容易地变更缺省的WordPress管理URL。这里是修改URL排名前3的插件,你可以在管理面板中进行试用。

  • Lockdown WP Admin: 这是一个有用的WordPress插件可以对入侵者隐藏管理模块和登录屏幕。如果一个没有登录你的站点的用户想要访问管理面板(/wp-admin/),此插件将URL隐藏并转向一个404页面。此外,它也允许用户直接在WordPress管理模块中添加HTTP认证以及自定义的用户名和密码。
  • HC Custom WP-Admin URL: 这是一个小巧而简单的安全插件,设计用来减少你的站点被入侵的可能性。使用它,你可以根据自定义的选择来更改wp-admin和wp-login.php,使得入侵者无法访问管理模块。
  • Better WP Security:  这是最好的WordPress安全插件之一,并且有数以百万计的下载量。它提供了一个简单而有效的方式来保卫WordPress网站。通过允许用户变更WordPress仪表板的URL,包括登陆,管理等等,此插件让修改管理面板的URL变得十分容易。

使用Lockdown插件变更WordPress的管理URL

选择一款合适的插件以后,我们马上可以开始变更URL。首先,在你的网站安装并激活插件。登陆你的仪表板,选择Plugins -> Add New,然后搜索Lockdown WP Admin,或者你可以从WordPress.org中直接下载并上传。然后,安装插件并激活。

当插件安装成功后,你可以在菜单条中看到Lockdown WP,单机即可打开。然后,你可以开始做定制。选择复选框,你可以隐藏WordPress的管理面板。例如,访问http://yourdomain.com/wp-admin/的未登录用户会看到一个404错误页,而不是跳转到登陆页。

你也可以把WordPress的登录URL换成你喜欢的地址。如果留空,它将被禁用。

另外,你可以配置HTTP认证为禁用HTTP认证,WordPress登录认证,甚至设置私人用户名/密码。最后,保存设置。通过所有这些设置,你可以极大地提高网站的安全性。

每日归档

上周

下周

归档