it-swarm.com.de

Wie verwendet man Div-IDs in der URL, um zu einem bestimmten Beitrag zu springen?

Einige Links auf meiner Website führen den Benutzer zu einem bestimmten Beitrag im Kontext einer Kategorieseite .

Auf Websites, die nicht zu WP gehören, können Sie dies leicht erreichen, indem Sie #example-div-id wie folgt in die URL einfügen:

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

Aber in einer WP Umgebung funktioniert diese URL nicht :

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

Dadurch wird das Browserfenster (fälschlicherweise) an das Ende der Seite gesprungen.

Aber das funktioniert ... manuelles Entfernen des abschließenden Schrägstrichs nach dem Laden der Seite und Neuladen der Seite. Das Browserfenster springt zum entsprechenden Div oder Post.

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

Weiß jemand warum das so ist? Oder wie kommt man zu WP, um den abschließenden Schrägstrich zu beseitigen? Ist es sicher, den abschließenden Schrägstrich zu beseitigen?

Aktualisieren

Ich habe versucht, die unten stehende EAMann-Lösung zu verwenden und hübsche Permalinks zu implementieren, um den Ankersprung zu erleichtern. Die erzielten Ergebnisse brechen meine Post-Order und meinen Ausschluss von Kinderkategorien völlig. Meine Navigation basiert auf Kategorien. Ich benutze keine Seiten, sondern Kategorienamen in der Navigation. Jede "Seite" ist wirklich ein Kategoriearchiv, das Beiträge aus der Kategorie anzeigt. Was ich über Permalinks gelesen habe, die mit% category% beginnen, führt dazu, dass ich Permalinks insgesamt vermeide. Ich möchte den Permalink auf keinen Fall mit dem Jahr oder der Beitrags-ID beginnen. Auf meiner Seite ergibt das keinen Sinn.

http://www.example.com/category/my-category sieht professioneller und "normaler" aus als http://www.example.com/2009/my-category, wenn die beabsichtigte Illusion ist, dass die Kategorienamen wirklich Seiten auf dieser Geschäftswebsite sind.

Also ich würde mich über weitere Erklärungen freuen, warum das Ankerspringen nicht funktioniert.

Update Nr. 2

(als Antwort auf EAManns Kommentar direkt im OP) Meine Website ist eine Geschäftswebsite, die größtenteils statischen Inhalt enthält. In einigen Bereichen wurden Portfolioarbeiten vorgestellt und es gibt einen Blog-Bereich. Die Site verwendet eine kategoriebasierte Navigation. Der gesamte Inhalt der Website wird als Posts geschrieben. Jeder Beitrag ist einer Kategorie zugeordnet, die festlegt, wo der Beitrag angezeigt wird. Das Site-Navigationsmenü wird mit wp_list_categories() erstellt. Durch Klicken auf eine Kategorie wird ein Kategoriearchiv geöffnet, in dem alle Beiträge der Kategorie angezeigt werden.

Ich verwende derzeit die Standard-Permalink-Struktur.
http://www.example.com/?cat=15 zeigt eine Kategorieseite.

Update Nr. 3

Nach weiteren Untersuchungen scheint das jQuery-Plugin "innerfade", mit dem ich eine Diashow oben auf der Seite anzeige, der Schuldige zu sein. Es hat nichts mit dem abschließenden Schrägstrich zu tun. Es tut mir leid, den falschen Weg eingeschlagen zu haben.

Wenn ich das PHP auskommentiere, das die Plugin-JS-Datei enthält, und der Ankersprung funktioniert einwandfrei. Ich würde vermuten, dass eine JavaScript-Manipulation des Seiteninhalts den Sprung vermasselt. Ich habe das Problem mit $(window).scrollTo(); umgangen.

Ich schätze die Zeit aller.

1
kevtrout

Wie ich in den Updates zu meiner Frage angegeben habe ... widerspricht anderes Javascript, das an der Seite arbeitet, dem Ankersprung. Ich habe more js implimentiert, um den Konflikt zu umgehen. Die URL sieht fast so aus wie zuvor, aber mit einem vor dem Pfund-Symbol eingefügten Parameternamen.

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

aber ich benutze das 'Plugin' von jQuery-Howto, um URL-Parameter zu erhalten.

$.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];
        }
});

Ich rufe die Post-Nummer ab, die dem URL-Parameter 'hi' zugewiesen ist, und scrolle mit derselben ID zu 20px über dem Post.

 //'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); 

der JQuery-Plugin-Code und mein benutzerdefinierter Code oben befinden sich in meiner Javascript-Datei, die in der Datei header.php enthalten ist

0
kevtrout

Zunächst würde ich empfehlen, " pretty permalinks " über die Standardstruktur für Abfragezeichenfolgen zu verwenden. Dadurch werden die meisten Ihrer Probleme aus dem getgo entfernt. Dadurch werden Ihre http://www.example.com/?cat=15#post-170-URLs zu http://www.example.com/category/category-slug/#post-170 und der Browser bewegt sich korrekt an die Position des Posts auf der Seite.

Das heißt ... Ja, Sie können den abschließenden Schrägstrich entfernen. Der Trick besteht darin, Ihrer .htaccess -Datei eine Regel hinzuzufügen:

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

(Dies stammt aus einem Drupal-Tutorial das macht das Gleiche ...)

2
EAMann