站长百科 | 数字化技能提升教程 数字化时代生存宝典
首页
数字化百科
电子书
▼
建站程序
开发
服务器
办公软件
开发教程
▼
服务器教程
软件使用教程
运营教程
热门电子书
▼
CSS教程
WordPress教程
导航
程序频道
推广频道
网赚频道
人物频道
网站程序
网页制作
云计算
服务器
CMS
论坛
网店
虚拟主机
cPanel
网址导航
WIKI使用导航
WIKI首页
热点词条
最新资讯
网站程序
站长人物
页面分类
使用帮助
编辑测试
创建条目
网站地图
站长百科导航
站长百科
主机侦探
IDCtalk云说
跨境电商导航
WordPress啦
站长专题
网站推广
网站程序
网站赚钱
虚拟主机
cPanel
网址导航专题
云计算
微博营销
虚拟主机管理系统
开放平台
WIKI程序与应用
美国十大主机
编辑“
WordPress:Creating Admin Themes
”(章节)
人物百科
|
营销百科
|
网赚百科
|
站长工具
|
网站程序
|
域名主机
|
互联网公司
|
分类索引
跳转至:
导航
、
搜索
警告:
您没有登录。如果您做出任意编辑,您的IP地址将会公开可见。如果您
登录
或
创建
一个账户,您的编辑将归属于您的用户名,且将享受其他好处。
反垃圾检查。
不要
加入这个!
== 更改登录网页的样式 == If you would like to change your Log-In page's style with your <tt>wp-admin.css</tt> file you must be use the <tt>wp_admin_css</tt> function. Create a plugin that contains these lines: 如果你想要使用<tt>wp-admin.css</tt>文件,更改登录网页的样式,你必须使用<tt>wp_admin_css</tt>函数。创建包含这些命令行的插件: <pre> function my_wp_admin_css() { echo '<link rel="stylesheet" href="/wp-content/plugins/blue-steel/wp-admin.css" type="text/css" />'; } add_action('wp_admin_css','my_wp_admin_css'); </pre> <pre> function my_wp_admin_css() { echo '<link rel="stylesheet" href="/wp-content/plugins/blue-steel/wp-admin.css" type="text/css" />'; } add_action('wp_admin_css','my_wp_admin_css'); </pre> This plugin overrides the original function, and displays only your stylesheet in the admin page's header. You use the <tt>.login</tt> and the <tt>#login</tt> element in the CSS file to change the page's style. 插件覆盖了原始的函数,而且在管理网友的标头上只显示你的样式表。你可以在CSS文件中使用<tt>.login</tt>和<tt>#login</tt>,更改网页的样式。 If you use this plugin you don't need to use the <tt>admin_head</tt> function that you read before! 如果你使用这个插件,你不需要使用先前阅读的<tt>admin_head</tt>函数。 Alternatively, if you don't want to override the default wp-admin.css stylesheet for the overall admin screen, you can use the <tt>login_head</tt> function to add a style sheet solely to your log-in page. To get this working, copy the login.css file from <tt>/wp-admin/css/</tt> you can append the following to the original plug-in you've created. 此外,如果你不想要覆盖整体管理界面的默认wp-admin.css样式表,你可以使用<tt>login_head</tt>函数,只将样式表添加到你的登录网页。使得这个样式表运行,将<tt>/wp-admin/css/</tt>中的login.css文件复制,你可以下面的内容添加到你最初创建的插件中: <pre> function wp_blue_steel_login() { echo '<link rel="stylesheet" type="text/css" href="' . get_settings('siteurl') . '/wp-content/plugins/blue-steel/login.css" />'."\n"; } add_action('login_head', 'wp_admin_login_css'); </pre> <pre> function wp_blue_steel_login() { echo '<link rel="stylesheet" type="text/css" href="' . get_settings('siteurl') . '/wp-content/plugins/blue-steel/login.css" />'."\n"; } add_action('login_head', 'wp_admin_login_css'); </pre> The <tt>wp_admin_css</tt> function also displays some other CSS file so you should add some other lines to this plugin. You can find these stylesheet files in the <tt>wp-admin</tt> folder, and the <tt>/wp-admin/css/</tt> maps (For example: <tt>upload.css</tt>). <tt>wp_admin_css</tt>函数也显示一些其它的CSS文件,这样你应该向这个插件添加一些其它的命令行。你可以在<tt>wp-admin</tt>文件夹和中<tt>/wp-admin/css/</tt> maps(例如:<tt>upload.css</tt>)找到这些样式表文件。 If you would like to use the original style: 如果你想要使用最初的样式: <pre> echo '<link rel="stylesheet" href="/wp-admin/css/upload.css" type="text/css" />'; </pre> <pre> echo '<link rel="stylesheet" href="/wp-admin/css/upload.css" type="text/css" />'; </pre> If you would like to use your style: 如果你想要使用自己的样式: <pre> echo '<link rel="stylesheet" href="/wp-content/plugins/blue-steel/upload.css" type="text/css" />'; </pre> In the end: <pre> <?php /* Plugin Name: Blue Steel Theme Plugin URI: http://example.com/blue-steel-admin-theme Description: Blue Steel WordPress Admin Theme - Upload and Activate. Author: Mr. WordPress Version: 1.0 Author URI: http://example.com */ function my_wp_admin_css() { echo ' // use the "blue-steel" style <link rel="stylesheet" href="/wp-content/plugins/blue-steel/wp-admin.css" type="text/css" /> // use the original style <link rel="stylesheet" href="/wp-admin/css/upload.css" type="text/css" /> '; } add_action('wp_admin_css','my_wp_admin_css'); ?> </pre> <pre> echo '<link rel="stylesheet" href="/wp-content/plugins/blue-steel/upload.css" type="text/css" />'; </pre> 最后: <pre> <?php /* 插件名: Blue Steel主题 插件URI: http://example.com/blue-steel-admin-theme 描述: Blue Steel WordPress 管理主题 – 上传和激活。 作者: Mr. WordPress 版本: 1.0 作者 URI: http://example.com */ function my_wp_admin_css() { echo ' // use the "blue-steel" style <link rel="stylesheet" href="/wp-content/plugins/blue-steel/wp-admin.css" type="text/css" /> // use the original style <link rel="stylesheet" href="/wp-admin/css/upload.css" type="text/css" /> '; } add_action('wp_admin_css','my_wp_admin_css'); ?> </pre> These plugins don't work with the <tt>install.css</tt> file and the <tt>"rtl"</tt> files. If you would like to use the <tt>rtl</tt> files, please look at how the <tt>wp_admin_css</tt> function works in the <tt>wp_include/general-template.php</tt> file. 这些插件不能与<tt>install.css</tt>文件和 <tt>"rtl"</tt>文件一起运行。如果你想要使用<tt>rtl</tt>文件,请看看<tt>wp_admin_css</tt>函数是怎样在<tt>wp_include/general-template.php</tt>文件中运行的。 === Advanced CSS Styles === === 高级的 CSS 样式 === [[WordPress:Image:admin-rounded-corners.png|right|thumbnail|Rounded Corners]] [[WordPress:Image:admin-rounded-corners.png|right|thumbnail|Rounded Corners]] Sometimes there are places where CSS just cannot achieve the look you want without making modifications to the HTML of the Administration Panels. 有时候,在不更改管理面板HTML的情况下,CSS不能获得你想要的外观。 A popular CSS style is to create rounded corners on "boxes" of content. The technique involves adding divisions or ''wrappers'' to the HTML architecture in order to achieve the effect. Since we really do not want to get into the core Administration Panels to make these changes, which will disappear with the next upgrade, you can use the DOM (Document Object Model). The DOM is a way of dynamically accessing and updating content, structure, and style of documents. 一种受欢迎的CSS样式是要在内容"框"周围创建圆形的角。这种技术包括向HTML结构添加部分或者''wrappers'',以取得效果。因为我们真的不想进入核心的管理面板,做出更改,这样的更改在下一次更新后就会消失,你可以使用DOM(Document Object Model)。DOM是一种方式,用来动态地使用和更新内容,结构以及文档的样式。 In this example, using the [http://www.456bereastreet.com/archive/200609/transparent_custom_corners_and_borders_version_2/ Transparent Rounded Corners] effect from 456 Berea Street, you can add the Javascript provided on the site to your Admin Theme Plugin, without editing the WordPress source. 在这个例子中,使用来自456 Berea Street的[http://www.456bereastreet.com/archive/200609/transparent_custom_corners_and_borders_version_2/ Transparent Rounded Corners],你可以将站点上提供的Javascript添加到你的管理主题插件上,不用编辑WordPress源码。 Download the script and save it to your <tt>blue-steel</tt> folder as <tt>javascript.js</tt>. Change the <tt>mr_blue_steel()</tt> function to: 下载脚本,并且将脚本保存到你的<tt>blue-steel</tt> 文件夹作为<tt>javascript.js</tt>。将<tt>mr_blue_steel()</tt>函数更改为: <pre> function mr_blue_steel() { $url = get_settings('siteurl'); $dir = $url . '/wp-content/plugins/blue-steel/'; echo '<link rel="stylesheet" type="text/css" href="' . $dir . 'wp-admin.css" />'; echo '<script type="text/javascript" href="' . $dir .'javascript.js"></script>'; } </pre> <pre> function mr_blue_steel() { $url = get_settings('siteurl'); $dir = $url . '/wp-content/plugins/blue-steel/'; echo '<link rel="stylesheet" type="text/css" href="' . $dir . 'wp-admin.css" />'; echo '<script type="text/javascript" href="' . $dir .'javascript.js"></script>'; } </pre> This script uses a single "hook" (<tt>cbb</tt>) to create many divisions around the container. For this to work, open the Javascript file and change all references of <tt>cbb</tt> to <tt>wrap</tt> to match the <tt>wp-admin.css</tt> standard style references. 这个脚本使用单一的"hook" (<tt>cbb</tt>)在container周围创建许多divisions。要使得这些能够运行,打开Javascript文件并且将所有的<tt>cbb</tt>references更改为<tt>wrap</tt>,以匹配<tt>wp-admin.css</tt>标准样式references。
摘要:
请注意,您对站长百科的所有贡献都可能被其他贡献者编辑,修改或删除。如果您不希望您的文字被任意修改和再散布,请不要提交。
您同时也要向我们保证您所提交的内容是您自己所作,或得自一个不受版权保护或相似自由的来源(参阅
Wordpress-mediawiki:版权
的细节)。
未经许可,请勿提交受版权保护的作品!
取消
编辑帮助
(在新窗口中打开)