內容簡介
OXP Mobile First Toolkit 是一款專為行動裝置優化的 WordPress 外掛，旨在解決響應式佈景主題在手機上常見的顯示問題，提供多種模組以改善使用者體驗。
【主要功能】
• 修復固定背景效果
• 啟用滾動中的懸停效果
• 偵測橫向滾動元素
• 調整全高區段顯示
• 停止 iOS 輸入框縮放
• 提供即時預覽功能
外掛標籤
開發者團隊
原文外掛簡介
Your theme is responsive. Your site still has problems on a phone that no responsive grid solves: fixed backgrounds render as a stretched mess, every hover effect you designed is dead because there is no cursor, one stray element makes the page scroll sideways and you cannot find which, full-height sections overflow the screen and jump when the browser bar collapses, Safari zooms in when someone taps a form field, and a decorative background video quietly spends several megabytes of a visitor’s data plan.
Four more modules add what a phone screen has no room for: a sticky bar that keeps your main buttons within thumb reach, a back-to-top button, a soft fade at the top and bottom of the screen instead of a hard cut, and a visible acknowledgement wherever a finger lands.
OXP Mobile First Toolkit is one panel of switches for exactly those. It is not a caching plugin, not a mobile theme, and it does not touch your desktop layout.
Every module arrives switched off. Activating the plugin changes nothing about your site until you turn something on, and one button puts everything back the way it came.
Nothing is loaded on a desktop. Not the scripts, not the stylesheets. Whether a visitor is on a touch device is a question only the browser can answer, and a page cache would freeze any answer PHP tried to give, so the decision is made in the browser. A desktop visitor gets a few hundred bytes of inline script that stops on its third line and requests nothing.
The single exception is the horizontal-overflow report, which is a tool for you rather than a fix for your visitor: it also runs on a desktop, because narrowing a browser window is how anyone actually hunts that bug. Its files are only ever loaded for a logged-in administrator, so a visitor still gets nothing.
You pick the vocabulary. One bar at the top of the settings page decides how the whole screen talks: plain, where everything is described by what it does and there is no jargon anywhere; technical, where things are called by their real names and nothing is explained; or hybrid, the plain wording with the technical term in brackets, which is the one to leave on if you would rather pick the words up as you go. It changes the words and nothing else. Your settings do not move and your site does not change.
Every module carries a live preview. Click the eye on a module and a simulated phone appears beside the form, with a switch between “without” and “with”, and it follows your own settings as you change them: move the dead-zone sliders and the bands in the phone move, pick a colour for the sticky bar and the bar changes, choose a tap effect and tapping inside the phone plays it.
Features
Fixed backgrounds. Repairs background-attachment: fixed, which iOS paints against the element instead of the viewport, turning a tall section into a zoomed-in blur. The image really stays put while the page moves past it, which is what the CSS meant in the first place.
Hover on scroll. Activates your hover effects as elements pass through the middle of the screen. Your existing CSS is reused as it is: the plugin finds your :hover rules, mirrors them, and works out which elements they belong to, so it does something useful with nothing configured at all. Name your own selector to narrow it down, and choose whether an element stays lit once it has been seen.
Sideways scrolling (horizontal overflow). Finds the element that makes your page scroll sideways and names it, in a panel only you can see. Reports the deepest offender rather than the twelve ancestors it drags out with it, ignores anything a container already clips, highlights the culprit on the page when you tap its name, and lets you dismiss the ones you have already dealt with.
Full-height sections (100vh). Rewrites 100vh heights to a unit that measures the screen the visitor can actually see, so a hero neither overflows nor jumps when the browser bar appears.
Zoom when tapping a field (iOS input zoom). Stops Safari zooming the page in when a visitor taps a form field, without taking pinch-zoom away from them.
Background videos. Leaves the poster image in place instead of streaming a decorative loop over mobile data. It shows the poster your video already has; it cannot invent one, so a video without a poster is left showing nothing.
Vertical fade. Fades the top and the bottom of the screen into a colour you choose, so a paragraph or a photograph runs out of view instead of being sliced in half by the edge of the phone. Either band on its own or both, in any colour, and no request at all: it is a few hundred bytes of CSS printed in the page.
Always-on-screen buttons (sticky CTA bar). A sticky bar carrying your main button, with its own label, icon, link, colour and style (filled, outlined or a gradient), that stays reachable however far the visitor has scrolled. Along the bottom of the screen or along the top. The icons are drawn by the plugin, so they cost no extra request, and the label colour is worked out from the button colour unless you would rather choose it.
Back to top. Appears once the visitor is far enough down to want it, in the corner and in the colour you pick, and you decide how far down that is. If the sticky bar is on, the button rests just above it rather than on top of it, which is the collision this pair of features otherwise makes on every site that has both. It is the one module you can also switch on for desktop, because a long page is long on a laptop too.
Tap effects. Draws a short animation exactly where a finger lands on a link or a button, because the finger is covering the thing it just pressed. A pulse or a ripple, in your colour, at your size, duration and opacity, on every tap or only on buttons and links, with an optional short vibration on Android. It stands down entirely for a visitor who has asked their phone for less motion.
Premium
Everything above is the plugin you are downloading. It is complete, it has no trial, no usage limit and no key to enter, and it does not stop working or start asking for anything after any amount of time.
There is a separate paid build of the same plugin, sold on our own site, that adds controls this one settles for you. It is not distributed here and none of its code is in this download. What it adds, module by module:
Fixed backgrounds: turn the repaired background into a real parallax, at a speed and in a direction you choose.
Hover on scroll: leave a region alone (a header or a menu), ignore anything narrower than a width you set, move the band the effects play in, and activate only the element nearest the centre instead of all of them.
Sideways scrolling: a guard that holds the page still while you fix what the report found.
Vertical fade: set how tall the bands are.
Sticky CTA bar: a second button with its own label, icon, link and look; the bar’s own background, opacity and typeface; the button shape; and the pages the bar stays away from.
Back to top: the button’s size, shape and paint style, and how far it sits from the corner.
Tap effects: five more effects, from a soft glow to fireworks.
Each module’s own card in the settings screen says what the paid build adds to that module, next to the controls it belongs with.
Privacy
The plugin makes no external requests while anyone is looking at your site, and stores nothing about your visitors.
The one time it contacts another server is when you save the sticky bar with a Google font selected: the font files are downloaded once, at that moment, and stored in your own uploads directory. Your visitors’ browsers then load the font from your domain and never contact Google at all, which is what keeps this side of the plugin clean under the GDPR.
There is one more request and it is worth naming, because it is the only one this plugin makes from a browser rather than from your server. While you are choosing a typeface on the settings screen, and only until you save, that screen loads the family you have highlighted straight from Google so the preview shows the real face rather than a generic fallback. It happens in your own browser, on your own admin screen, for a font you just clicked; no visitor is involved and nothing about them is sent anywhere. Save, and the local copy takes over and the request stops.
Freemius. The plugin includes the Freemius SDK (freemius.com), which handles the upgrade link and, if you ever buy the paid version, licensing. On activation it asks you once whether to connect, and that screen carries a Skip link: skipping sends nothing anywhere and every module behaves exactly the same, now and always. If you do connect, Freemius receives your site’s address, your WordPress and PHP versions, your administrator name and email address, and the list of plugins and themes installed, so support and compatibility can be handled; you can disconnect again from the plugin’s own menu. Freemius is a third-party service: their terms are at https://freemius.com/terms/ and their privacy policy at https://freemius.com/privacy/.
