特定の投稿にジャンプするためにURLでDiv -Idsを使用する方法…後続の原因は犯人を削減していますか？

wordpress.stackexchange https://wordpress.stackexchange.com/questions/1810

  •  16-10-2019
  •  | 
  •  

質問

私のサイトのいくつかのリンクは、ユーザーを特定の投稿に連れて行きます カテゴリページのコンテキストで.

非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のソリューションを使用して、Anchorジャンプを容易にするためにかなりのパーマリンクを実装してみました。結果は、私の事後注文と子のカテゴリの除外を完全に破りました。私のナビゲーションはカテゴリベースです。私はページを使用しませんが、ナビゲーションでカテゴリ名を使用します。各「ページ」は、カテゴリからの投稿を示すカテゴリアーカイブです。 ％カテゴリ％で始まるパーマリンクについて読んだことは、パーマリンクをすべて避けることにつながります。私は確かに、年や投稿IDでパーマリンクを開始したくありません。私のサイトでは意味がありません。

http://www.example.com/category/my-category よりプロフェッショナルで「普通」に見えます http://www.example.com/2009/my-category 意図された幻想が、カテゴリ名が実際にこのビジネスサイトのページであるということです。

ですから、アンカージャンプが機能していない理由をお勧めします。

更新＃2

（OPに関するEamannのコメントに応じて）私のサイトは、ほとんどの場合静的なコンテンツを表示するビジネスウェブサイトです。いくつかの領域がポートフォリオの作業を特徴としており、ブログセクションがあります。このサイトは、カテゴリベースのナビゲーションを使用します。すべてのサイトコンテンツは投稿として記述されます。各投稿は、投稿が表示される場所を決定するカテゴリに関連付けられています。サイトナビゲーションメニューは作成されます wp_list_categories(). 。カテゴリをクリックすると、カテゴリのすべての投稿を提示するカテゴリアーカイブが開きます。

現在、デフォルトのパーマリンク構造を使用しています。
http://www.example.com/?cat=15 カテゴリページを表示します。

更新＃3

さらに調査した後、ページの上部にスライドショーを表示するために使用しているjQueryプラグイン「innerfade」が犯人であると思われます。それは後続のスラッシュとは何の関係もありません。間違った道を進んで申し訳ありません。

プラグインJSファイルを含むPHPにコメントし、アンカージャンプが正常に機能する場合。ページコンテンツのJavaScript操作がジャンプを台無しにしていると思います。私は使用して問題を回避しました $(window).scrollTo();.

みんなの時間に感謝します。

役に立ちましたか？

解決 2

私の質問の更新で述べたように...ページに取り組んでいる他のJavaScriptは、アンカージャンプと競合します。私は暗示しました もっと 紛争を回避するJS。 URLは以前とほぼ同じように見えますが、ポンドシンボルの前にパラメーター名が挿入されているように見えます。

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

しかし、私はjquery-howto'sを使用しています 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];
        }
});

「HI」URLパラメーターに割り当てられた投稿番号を取得し、同じIDでポストの上の20pxまでスクロールします。

 //'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プラグインコードと上記のカスタムコードは、header.phpに含まれているJavaScriptファイルに移動します

他のヒント

まず、使用することをお勧めします。かなりパーマリンク「デフォルトのクエリストリング構造で。これにより、GetGoからの問題のほとんどが排除されます。 http://www.example.com/?cat=15#post-170 urls to 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チュートリアル それは同じことをします...）

ライセンス： CC-BY-SA と 帰属
所属していません wordpress.stackexchange
scroll top