重庆分公司,新征程启航

为企业提供网站建设、域名注册、服务器等服务

wordpress页面美化教程 wordpress怎么自定义页面

wordpress的网站导航栏的背景色怎么添加美化

你好,我也是wordpress爱好者,希望能一起交流。

公司主营业务:成都网站建设、成都网站制作、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。创新互联建站是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联建站推出泉山免费做网站回馈大家。

关于你的问题。仅仅需要改动wordpress主题目录下的style.css文件样式,为菜单写css样式即可。主题文件位于 wordpress/wp-content/themes/你当前选择的主题目录下。

如果有不太清楚的可以私信我。一起交流。

css书写规则:

.menu {

background-color: #ccc;

line-height: 38px;

height: 38px;

}

.menu ul li {

width: 160px;

padding: 0 15px;

}

以上是css的基本书写,你可以参考下。将menu换成你菜单的css类。然后在重写css。最后保存style.css文件,并刷新浏览器查看效果。

WordPress菜单如何美化

你用的是什么浏览器,如果是遨游那么你右键人家任意位置-选择审查元素-然后在下面有个放大镜,点击一下放大镜-将鼠标移动到导航的位置,在浏览器的下面就能够看到对应的代码,记住代码然后再去style.css

里面找到代码就可以修改背景颜色了

如何让每个 WordPress 页面有不同的风格或者样式

如果使用 page.php 来处理所有页面的外观的话,答案肯定是不行的,但是如果使用不同的 WordPress 页面模板,就可以自定义每个页面的外观了。

比如你博客的所有的页面除了“关于”这个页面之外都有侧边栏,在“关于”页面,你想内容的宽度能够扩展到这个页面的宽度。下面就是详细的实现步骤:

在当前使用的主题文件夹中创建一个新模板,将它命名为 about.php。

完成之后,到 about.php 的最上面插入以下代码:

以下内容以本博使用的Wordpress Version 2.9.1为例

1、不同分类使用不同模版 :

以建立promotion和tournament两个分类为例:

假设它们的分类ID–category id分别为2、3,

wordpress存放路径为 htdocs\wordpress\

那么在文件夹wordpress\wp-content\themes\your-theme下

复制两个category.php模板文件,重命名为category-2.php和category-3.php

这样分别修改两个模版文件,即可定制出你需要的、独特的分类页面

2、 不同页面使用不同模版

再来定制不同pages的模板,以about页面为例:

复制文件夹wordpress\wp-content\themes\yourtheme下page.php模版文件

重命名为about.php, 注意在此文件最顶端加上如下代码,否则在后台管理面板读不到:

!--p /*Template Name: about */--

然后在管理后台-Pages-Edit 编辑about页面,

在Template模板下拉菜单中选择about,

保存即可

3 、不同日志使用不同模版

例如为日志应用特别的模板:

复制文件夹wordpress\wp-content\themes\yourtheme下single.php模版文件

重命名为single-4.php,按需求进行单独修改

打开single.php模版文件

将其中的所有代码以如下代码包裹,形如

!--p $current_cat= get_the_category();$current_single_file= TEMPLATEPATH .'/single-'.$current_cat[0--cat_ID.'.php';if(is_file($current_single_file)){include($current_single_file);}else{ ? 此处为原来single.php中的所有代码 !--p }--

如何通过代码美化自定义WordPress后台登陆界面,半透明效果登陆框

要通过代码自定义wordpress后台登录页面,这个看起来简单,但做起来还是有点小复杂。

据了解,高时银博客就是通过以下2步来实现的:

1、在当前主题文件夹下创建一个login.css 文件,

html{

background: transparent;

}

body.login{

background: #000 url("images/login_bg.jpg") no-repeat center top;

}

body.login div#login h1 a {

display: none;

}

body.login div#login h1{

display: block;

height: 70px;

}

.login form,.login form .input, .login input[type="text"],.wp-core-ui .button-

primary,.wp-core-ui .button-primary:hover{

-webkit-box-shadow:none;

box-shadow:none;

-webkit-border-radius: 0;

border-radius: 0;

}

.login form{

background: rgba(10,35,35,.4);

border: none;

}

.login form .input, .login input[type="text"]{

background: transparent;

border-color: #444;

color: #eee;

}

.login form .input:focus{

border-color: #666;

}

.login label{

color: #999;

line-height: 35px;

}

.wp-core-ui .button.button-primary{

background: rgba(187,64,48,.7);

border: none;

line-height: 12px;

padding: 10px 30px;

}

.wp-core-ui .button-primary:hover{

background: rgba(0,0,0,.4);

-webkit-transition: background 0.5s ease-out 0s;

-moz-transition: background 0.5s ease-out 0s;

-ms-transition: background 0.5s ease-out 0s;

-o-transition: background 0.5s ease-out 0s;

transition: background 0.5s ease-out 0s;

}

.wp-core-ui .button.button-primary,

.login label,

.login form .input{

font-family: 'Microsoft YaHei';

}

#nav,#backtoblog{

display: none;

}

2、然后在主题的functions.php文件中添加调用这个CSS文件的代码:

//登录界面

function diy_login_page() {

echo 'link rel="stylesheet" href="' . get_bloginfo( 'template_directory' ) .

'/login.css" type="text/css" media="all" /' . "\n";

}

add_action( 'login_enqueue_scripts', 'diy_login_page' );

希望我的回答帮到了我哦。


文章名称:wordpress页面美化教程 wordpress怎么自定义页面
文章位置:http://cqcxhl.cn/article/ddsjise.html

其他资讯

在线咨询
服务热线
服务热线:028-86922220
TOP