Как использовать div-идентификаторы в URL-адресе для перехода к определенному сообщению…Является ли трейлинг Слэш виновником?


Некоторые ссылки на моем сайте приводят пользователя к определенному сообщению в контексте на странице категории .

На сайтах, не относящихся к WP, это легко достигается путем включения #example-div-id в URL-адрес следующим образом:

http://www.example.com#example-div-id

Но в среде WP этот URL-адрес не работает:

http://www.example.com/?cat=15#post-170

Это (неправильно) переводит окно браузера в конец страницы.

Но это действительно работает...вручную удаляя завершающая косая черта после загрузки страницы и перезагрузки страницы. Окно браузера переходит к соответствующему div или сообщению.

http://www.example.com?cat=15#post-170.

Кто-нибудь знает, почему это так? Или как заставить WP устранить косую черту в конце? Безопасно ли устранять завершающую косую черту?

Обновление

Я попытался использовать решение EAMann ниже, реализовав довольно постоянные ссылки для облегчения перехода на якорь. Достигнутые результаты полностью нарушают мой почтовый порядок и исключают категории детей. Мой навигация основана на категориях. Я не использую страницы, но использую названия категорий в навигации. Каждая "страница" на самом деле представляет собой архив категорий, показывающий сообщения из категории. То, что я читал о постоянных ссылках, начинающихся с % категории%, заставляет меня избегать постоянных ссылок все вместе. Я, конечно, тоже не хочу начинать постоянную ссылку с идентификатора года или публикации. Это не имеет смысла на моем сайте.

http://www.example.com/category/my-category выглядит более профессионально и "нормально", чем http://www.example.com/2009/my-category, когда предполагаемая иллюзия состоит в том, что названия категорий на самом деле являются страницами этого бизнес-сайта.

Поэтому я был бы признателен за любые другие объяснения, почему прыжок с якоря не работает.

Обновление #2

(в ответ на комментарий ЭМАнна непосредственно к ОП) Мой сайт - это бизнес-сайт, который по большей части отображает статический контент. В нескольких областях представлены работы с портфолио, и есть раздел блога. Сайт использует навигацию на основе категорий. Весь контент сайта написан в виде постов. Каждый пост является связан с категорией, которая определяет, где отображается запись. Меню навигации по сайту создается с помощью wp_list_categories(). При нажатии на категорию открывается архив категорий, в котором представлены все записи из этой категории.

В настоящее время я использую структуру постоянных ссылок по умолчанию.
http://www.example.com/?cat=15 показывает страницу категории.

Обновление #3

После дополнительного исследования выясняется, что плагин jQuery "innerfade", который я использую для отображения слайд-шоу в верхней части страницы, является преступник. Это не имеет никакого отношения к задней косой черте. Извините, что пошел по неверному пути.

Если я закомментирую php, который включает js-файл плагина, и переход по якорю будет работать просто отлично. Я бы предположил, что некоторые манипуляции javascript с содержимым страницы портят переход. Я решил проблему, используя $(window).scrollTo();.

Я ценю время каждого.

Author: kevtrout, 2010-09-14

2 answers

Во-первых, я бы рекомендовал использовать "довольно постоянные ссылки" поверх структуры строки запроса по умолчанию. Это устранит большинство ваших проблем с самого начала. Это превратит ваши URL-адреса http://www.example.com/?cat=15#post-170 в http://www.example.com/category/category-slug/#post-170, и браузер правильно переместится на позицию сообщения на странице.

Тем не менее... Да, вы можете удалить завершающую косую черту. Хитрость заключается в том, чтобы добавить правило в ваш файл .htaccess:

#remove trailing slashes
RewriteCond %{HTTP_HOST} ^(www.)?yourdomain\.com$ [NC]
RewriteRule ^(.+)/$ http://%{HTTP_HOST}/$1 [R=301,L]

(Это взято из учебника по Drupal, который делает то же самое...)

 2
Author: EAMann, 2010-09-14 16:47:50

Как я уже говорил в обновлениях к моему вопросу... другой javascript, работающий на странице, конфликтует с переходом на якорь. Я подразумевал больше js, чтобы обойти конфликт. URL-адрес выглядит почти так же, как и раньше, но с именем параметра, вставленным перед символом фунта,

http://www.example.com/?cat=15&hi=#post-170

Но я использую "плагин" jQuery-Howto для получения параметров URL.

$.extend({
    getUrlVars: function(){
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');

    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }

    return vars;
},
getUrlVar: function(name){
            return $.getUrlVars()[name];
        }
});

Я извлекаю номер записи, присвоенный параметру URL "привет", и прокручиваю до 20 пикселей над сообщение с тем же идентификатором.

 //'hi' var used to jump to anchor          
    var hi = $.getUrlVar('hi');

    if  ( hi ) {
        //scroll to link or search results if url var 'hi' is present
        $(window).scrollTop($(hi).position().top-20); 

Код плагина jquery и мой пользовательский код выше находятся в моем файле javascript, который включен в header.php

 0
Author: kevtrout, 2011-01-21 12:31:58