説明
Page scroll to id は、href 値に # が含まれるリンクがクリックされたときに、ブラウザの「ジャンプ」動作を スムーズなスクロール アニメーション に置き換える、フル機能のプラグインです。ペライチのサイト、ページ内ナビゲーション、先頭に戻るリンクなどを備えたすべての基本ツールと高度な機能を提供します。次の機能があります:
- 調整可能なスクロール アニメーション 期間とイージング (30 種類以上のイージングタイプ)
- すぐに使える CSS クラスによるリンクとターゲットの強調表示
- 縦方向 かつ / または 横方向 のスクロール
- 異なるページから / ページへのスクロール (ページの読み込み時にターゲット ID までスクロール)
- ピクセル単位でスクロールをオフセット、またはカスタム式で要素セレクターを設定する
- 投稿ビジュアルエディタにリンクとターゲット ID ボタンを挿入する
- リンク固有のオフセット、スクロール期間、ハイライトターゲットなど。
デモ (デフォルトのアニメーションの持続時間 / イージング、リンクのハイライトなど)
プラグインのリソース、リンク、チュートリアル
要件
ページを ID までスクロールするには、WordPress バージョン 3.3 以上 (jQuery バージョン 1.7.0 以上) が必要です。テーマには wp_head()
関数と wp_footer()
関数が 必須 (推奨) です。Microsoft Windows ベースのサーバーでは、一部のプラグインがエラー500になる場合があります (サーバー / PHP 構成によって異なります)。問題を特定するには、wp-config.php
で デバッグを有効化し、wp-content/debug.log
ファイルで関連するエラーを確認してください。
GDPR (一般データ保護規則)
こちらのプラグインは GDPR に準拠しています。ユーザーの情報やデータを一切使用、保存しません。実際にこのプラグインの機能はユーザーデータ (個人情報を含む) とはまったく関係ありません。つまりそういうことです。
簡単な使い方とヒント
- プラグインをインストール
- こちらのプラグインは WordPress メニュー リンクでデフォルトで有効になっているため、カスタムリンクを追加して、スクロール先の ID / ターゲットに URL を設定できます。
- プラグインの「ID ターゲットへのページスクロールを挿入」ボタンやショートコード (プラグイン設定ページのコンテキスト「ヘルプ」メニューを参照) を使用して、投稿のブロックエディターまたは旧エディターでコンテンツ内に ID ターゲットを作成します。「ID ターゲットへのページスクロール」ウィジェットを使用して、ウィジェット領域にターゲットを作成します。
- プラグインの「ID リンクへのページ スクロールの挿入 や編集」ボタンや、投稿のブロックエディターまたは旧エディターのショートコードを使用して、コンテンツ内にリンクを作成します。プラグインで処理する既存のリンクにクラス
ps2id
を追加することもできます。
詳細情報 プラグインの基本チュートリアルを見る
ライセンス
MIT
このプログラムには MIT ライセンスのコピーが付属しているはずです。
付属していない場合は、http://opensource.org/licenses/MIT を参照してください。
寄付
このプラグインが気に入って便利だと思ったら、寄付も考えてみてください
プラグインの以前のバージョン / 他のバージョン
その他 / 外部リソース
- WordPress のブロックエディタでアンカーリンクを作成する方法
- Divi BuilderプラグインでページスクロールIDを使用する
- One Page WordPress Smooth Scrolling Menu –
Page scroll to id の使い方 2017 - Page scroll to id を使用してページセクション間をスムーズにスクロールする
- 動画チュートリアル: ペライチの WordPress サイトを作成する方法
- GeneratePress – Elementor – Page Scroll to ID – One Page Website
- Onepage WordPress – Page scroll to iD プラグイン
スクリーンショット
ブロック
このプラグインは2個のブロックを提供します。
- Ps Id Blocks
- Page scroll to id target
インストール
自動
- WordPress の「プラグイン」メニューの下にある「新規追加」をクリックします。
- 「Page scroll to id」というキーワードで検索し、検索結果でプラグイン名の下の「今すぐインストール」をクリックします。
- インストールが完了したら、「プラグインを有効化」をクリックします。
手動
- プラグインをダウンロードして解凍します。
page-scroll-to-id
フォルダ全体を/wp-content/plugins/
ディレクトリにアップロードしてください。- WordPress の「プラグイン」メニューよりプラグインを有効化。
設定
プラグイン名の下の「設定」をクリックするか、WordPress 管理画面の「設定」メニューかよりプラグインオプションを設定します。
FAQ
最新の情報とガイドについては、プラグインの ナレッジベース – FAQ をご覧ください。
-
GDPR に準拠していますか ?
-
はい。
-
なぜ x 週間 / 数か月間更新されていないのですか ?
-
なぜならこのプラグインは機能し、すでに多くの機能を備えているからです。このプラグインは WordPress の機能にほとんど依存しないため、WordPress が更新されるたびに更新する必要はありません (そのため、3.3などの古いバージョンの WordPress でも動作します)。
評価
貢献者と開発者
変更履歴
1.7.9
- Fixed various PHP 8 warnings.
- Changed plugin shortcodes files to adhere to wp coding standards.
1.7.8
- Added aria-label attribute in plugin shortcodes (requires PHP v5.3 or greater).
- Changed plugin shortcodes markup to remove empty attributes.
- Fixed PHP warning (Array to string conversion) in PHP 8 installations – related issue.
- Fixed issue with text formatting in plugin admin page – related issue.
- Modified various plugin files to comply with the WordPress Coding Standards.
- Fixed an issue with shortcodes not working in WordPress 2022 theme editor.
- Created the special class “ps2id-auto-scroll” to easily auto-scroll to a target id with this specific class on page load.
1.7.7
- Changed a couple of plugin functions in order to comply with the WordPress Coding Standards.
1.7.6
- Fixed various PHP notices and warnings.
- Extended unbind unrelated click events extra/deferred script.
- Patched vulnerability in plugin’s shortcode.
1.7.5
- Fixed various PHP 7.4 and PHP 8 notices and warnings appearing on plugin installation.
- Fixed a minor javascript expression issue.
- Fixed PHP warning with old PHP versions (5.2 and 5.3).
1.7.4
- Added link-specific offset special class (ps2id-offset-NUMBER) for WordPress Menu items. For example adding the class ps2id-offset-150 to a menu item, will give the link an offset of 150.
- Extended plugin’s offset selector expressions with the :sticky selector.
1.7.3
- Fixed issue with target id attribute having special characters (like %, &, # etc.).
- Extended “Prevent other scripts from handling plugin’s links” option with special selector option field.
- Removed jQuery 1.x deprecated functions from plugin script (.bind, .delegate, .unbind etc. are replaced with .on, .off etc.).
- Updated plugin’s contextual help and notices.
1.7.2
- Added an extended “Verify target position and readjust scrolling” option for lazy-load images, iframes, changes in document’s length etc.
- Added “Force scroll type/easing” option for dealing with conflicts with outdated easing libraries added by themes or other plugins.
- Updated plugin’s settings page, contextual help and notices.
1.7.1
- Update plugin’s settings page and notices.
1.7.0
- Removed recommended plugins.
- Updated plugin screenshots.
- Updated readme.txt
1.6.9
- Added warning message in plugin settings when the selector option value lacks quotes (invalid without jquery migrate or with jquery 3.x).
- Fixed Uncaught TypeError of undefined data when actual page is inside an iframe – related issue.
- Added ‘Encode unicode characters on links URL’ option in plugin settings help panel.
- Extended “Prevent other scripts from handling plugin’s links” option function handler.
- Replaced jQuery deprecated ready event in plugin script.
1.6.8
- Fixed PHP notice/warning regarding contextual_help being deprecated (https://wordpress.org/support/topic/deprecated-contextual_help-is-obsolete-since-version-3-3-0/).
- Added new option ‘Encode unicode characters on links URL’. This option can be used when having links with encoded unicode characters (e.g. on internationalized domain names) in their href/URL.
- Added support for dynamic/live selectors for newer jQuery versions (3.x) and the upcoming WordPress 5.6.
1.6.7
- Fixed issue with links having meta characters (e.g. %) in URL.
- Extended the default excluded selectors.
- Fixed issue with TwentyTwenty theme smooth scrolling feature (https://wordpress.org/support/topic/scrolling-not-working-5/)
- New feature for developers: add plugin options manually (via js) to overwrite the ones in plugin settings.
1.6.6
- Fixed dynamic elements would not work automatically (issue in 1.6.5).
- Fixed some links would not get highlighted when using full URLs (issue in 1.6.5).
1.6.5
- Added new option to exclude specific selectors from being handled by the plugin.
- Added new option ‘Auto-generate #ps2id-dummy-offset element’.
- Added ‘Page scroll to id target’ block for Gutenberg block editor.
- Added new feature for Gutenberg block editor:
- Fixed highlight not working in URLs with an apostrophe.
- Fixed this issue regarding plugin’s default selector when using non-WordPress jQuery library.
- Fixed this minor issue.
- Fixed multisite issue where few plugin options would not save/update properly.
- Fixed issue #10
- Updated plugin’s contextual help and documentation.
1.6.4
- Fixed a minor bug affecting the “Prevent other scripts from handling plugin’s links” option.
1.6.3
- Fixed a bug which was breaking page scrolling in some WordPress themes/installations in version 1.6.2.
- Fixed a bug regarding links with URL in non-latin characters (e.g. Greek, Cyrillic etc.).
- Better plugin version control for multisite installations.
- Fixed PHP 7 notices and warnings.
- Plugin is now enabled by default on all links with a non-empty hash value (e.g. #some-id) in their URL.
- Changed default scroll duration from 1000 to 800 milliseconds.
- Added support for anchors inside SVG elements.
- Added new option ‘Verify target position and readjust scrolling if necessary’.
- Added new option ‘Use element custom offset when scrolling from/to different pages’.
- Added new option ‘Remove URL hash when scrolling from/to different pages’.
1.6.2
- Changed default options for scroll duration and easing type. Plugin is now enabled by default on WordPress menu items/links. These changes affect only first-time installations (upgrading won’t change these options).
- Extended plugin’s settings page and renamed few options to less technical terms.
- Added special class/option for creating links with alternative scroll duration/speed.
- Extended plugin buttons on WordPress visual editor (non-shortcode links, custom classes etc.).
- Added new option ‘Append the clicked link’s hash value to browser’s URL/address bar’.
- Added new option ‘Stop page scrolling on mouse-wheel or touch-swipe’.
- Added new option ‘Prevent other scripts from handling plugin’s links’.
- Added new option ‘Normalize anchor-point targets’.
- Relative-root links are now properly highlighted.
- Added
wp-config.php
option for selecting which script files the plugin loads (minified or uncompressed). - Only necessary CDATA values are passed on the front-end script.
- Added compatibility for latest non-WordPress jQuery versions (2.x and 3.x).
- Fixed a bug regarding shortcode’s offset attribute when used with “auto” layout.
- Fixed a php notice when updating plugin from version 1.6.0.
- Added workaround for IE/Edge not starting from the top when scrolling to hash on page load.
- Updated readme.txt, contextual help and documentation.
1.6.1
- Added additional default selectors:
.ps2id > a[href*='#'],a.ps2id[href*='#']
. - Added “Page scroll to id target” widget.
- Added custom buttons in WordPress visual editor for plugin’s shortcodes insertion.
- Added new option ‘Enable on WordPress Menu links’ in plugin settings.
- Fixed browser’s history back button when ‘Scroll to location hash’ option is enabled.
- Updated readme.txt.
- Extended help and documentation.
1.6.0
- Fixed contextual help shortcut links in plugin settings page.
- Added new option ‘Enable for all targets’ for ‘Scroll to location hash’.
- Added new option ‘Delay’ for ‘Scroll to location hash’.
- Fixed an issue regarding invalid selectors with location hash.
- Updated readme.txt.
- Updated help.
1.5.9
- Extended
ps2id
shortcode for creatingdiv
elements (in addition to anchors). - Added
ps2id_wrap
shortcode for creating target wrappers in content editor. - Extended offset selector expressions with
:position
,:height()
and:width()
. - Updated readme.txt.
- Updated help.
1.5.8
- Fixed various PHP notices in debug mode.
- Minor script optimizations.
1.5.7
- Added ‘Highlight by next target’ option. When enabled, highlight elements according to their target and next target position (useful when targets have zero dimensions).
- Extended
ps2id
shortcode for creating targets in content editor.
1.5.6
- Changed the way ‘Force single highlight’ option works. When enabled, it now highlights the first highlighted element instead of last.
- Extended highlight and target classes with additional ones in order to differentiate the first and last elements. You can now use
.mPS2id-highlight-first
,.mPS2id-highlight-last
,.mPS2id-target-first
and.mPS2id-target-last
in order to target the first and last highlighted links and targets in your CSS. - Added ‘Keep highlight until next’ option. When enabled, the plugin will keep the current link/target highlighted until the next one comes into view (one element always stays highlighted).
- Added ‘Disable plugin below screen-size’ option. Set the screen-size (in pixels), below which the plugin will be disabled.
1.5.5
- Fixed contextual help links in plugin settings page.
- Updated Offset field to accept comma separated values for defining different offsets for vertical and horizontal layout (e.g.
100,50
). - Added ‘Scroll to location hash’ option. When enabled, the plugin will scroll to target id (e.g.
<div id="id" />
) based on location hash (e.g.mysite.com/mypage#id
) on page load. - Updated readme.txt.
- Updated help.
1.5.4
- Fixed a minor bug in jquery.malihu.PageScroll2id-init.js.
- Updated screenshots.
- Updated readme.txt.
1.5.3
- Extended Offset option to accept element selectors in addition to fixed pixels values.
- Added
ps2id
shortcode for creating links in content editor. - Added the ability to define link specific offsets via the html data attribute:
data-ps2id-offset
. - Fixed some minor issues for WordPress versions lower than 3.5.
- Updated help and external links.
- Changed plugin license from LGPL to MIT.
1.5.2
- Minor code tweaks.
1.5.1
- Minor code tweaks.
- Minified scripts.
1.5.0
- Dropped jQuery UI dependency (jQuery UI is no longer required for the plugin to work).
- Fixed the bug of non-working links to other pages. The script now checks if href values refer to the parent document, before preventing the default behavior.
- Fixed the bug regarding selectors referencing body class not working.
- Any link handled by the plugin with href value
#top
will now scroll the page to top, if no element with idtop
exists. - Added links highlighting feature. The script adds a class (default:
mPS2id-highlight
) automatically on links whose target elements are considered to be within the viewport. - Plugin adds a class (default:
mPS2id-target
) automatically on targets that are considered to be within the viewport. - Plugin adds a class (default:
mPS2id-clicked
) automatically on the link that has been clicked. - Added
offset
option: Offsets scroll-to position by x amount of pixels (positive or negative). - The plugin script now fully validates href values and ids before scrolling the page.
- Fixed varius minor bugs.
- Code rewritten and optimized for better performance and maintenance.
- For more see Plugin changelog.
1.2.0
- Added support for jQuery version 1.9.
1.1.0
- Removed the hard-coded plugin directory URL in order to fix errors of pointing .js files to a wrong location.
1.0.0
- Launch!