我创建了一个静态frontpage,在其中加载所有页面的内容。现在我有了一个普通的自定义菜单,但链接指的是页面,例如:http://example.com/about
现在我想让链接指向页面本身http://example.com/#about.
我有一个使用的自定义助行器,我尝试了以下代码:
$attributes .= ! empty( $item->url ) ? \' href="\' . esc_attr( get_bloginfo(\'url\').\'#\'.$item->title ) .\'"\' : \'\';
现在,除了主链接本身,一切正常。主页链接到
http://example.com/#home, 但那只需要链接到
http://example.com/#有什么不同的东西我可以用吗$item->title
添加。
--
如果您想知道我用来创建单个页面的方法:
Creating the modern 'single page' html5 css3 layout in wordpress
更新
我只是想告诉你们我做了什么,也许这对别人有帮助。
页面的结构如下:
Home (public) -> cutom menu item -> [link:#][label:home]
portfolio (private) -> cutom menu item -> [link:#portfolio][label:portfolio]
contact (private) -> cutom menu item -> [link:#contact][label:contact]
blog (public) -> page menu item -> [link:blog][label:blog]
主页和博客将被索引并可见。公文包和联系人加载在首页。php。
请注意,我使用的是相对链接,而不是绝对链接,html输出将是href=“#contact”。
现在这样会在博客页面上发生冲突,链接会变成http://example.com/blog/#contact
<我们不想那样,我们只想http://example.com/#contact
在我的默认walker中,我将在绝对路径中编辑edit。我在这里这样做只是为了使模板更具动态性。
if($item->object == \'custom\'){
$attributes .= ! empty( $item->url ) ? \' href="\' .
esc_attr(get_bloginfo(\'url\').\'/\'.$item->url ) .\'"\' : \'\';
}else{
$attributes .= ! empty( $item->url ) ? \' href="\' .
esc_attr( $item->url ) .\'"\' : \'\';
}
完整walker的来源如下:
Menu items description? Custom Walker for wp_nav_menu()现在,下一件事是:
- 在frontpage上单击链接时要有一个很好的滚动效果(jquery scrollto)
- 在单击博客链接时重定向到博客当在博客页面上单击哈希链接时重定向回右侧部分
jQuery脚本(滚动到锚定):
$(document).ready(function() {
$(\'.menu-item-object-custom a\').bind(\'click\', function(e) {
e.preventDefault();
var parts = ($(this).attr("href")).split("#");
var target = \'#\' + parts[1];
if($(\'body.home\').length){
var moveto = $(target).length ? $(target).offset().top : 0;
$(\'html, body\').stop().animate({ scrollTop: moveto }, 1500, function() {
location.hash = target;
});
return false;
}else{
window.location = $(this).attr("href");
}
});
});
请注意,浏览器中的URL也会更改,因此“后退”按钮也可以使用,并且可以轻松地添加书签。
感谢下面所有的建议和灵感!!我希望有人能用这个。