Halloween Sale 15% off Ends in See the plans

Snippet Library

Frontend & Design snippets for WordPress

Snippets that change how your site looks and behaves for visitors: a back-to-top button, announcement bars, custom fonts and styles, smooth scrolling and small layout fixes. For designers and site owners polishing the front of the site.

1–12 of 12 snippets “cli”

  • HTML Frontend & Design

    "You Are Offline" Notice

    Shows a small notice at the bottom of the screen when the visitor loses their internet connection and hides it when the connection returns, so failed clicks make sense.

  • CSS Frontend & Design

    Clear Keyboard Focus Outlines

    Shows a strong, visible outline around links, buttons and form fields when visitors navigate with the keyboard, which many themes hide. Mouse clicks are not affected.

  • PHP Frontend & Design

    Click-to-Call Bar on Mobile

    Shows a full-width "Call us now" bar fixed to the bottom of the screen on phones, so mobile visitors can call your business with one tap.

  • PHP Frontend & Design

    Full-Screen Search Overlay

    Opens a full-screen search box when visitors click any link to #search (for example a menu item) and closes with Escape, giving small headers a roomy, focused search.

  • HTML Frontend & Design

    Lightweight Image Lightbox

    Opens linked images in post content in a full-screen overlay instead of a new page, with keyboard and click-to-close support and no external library.

  • CSS Frontend & Design

    Make Whole Cards Clickable

    Makes an entire Group, Column or Query Loop card with the class "wpide-card-link" clickable, using the link in its heading, so visitors don't have to hit the small title link.

  • HTML Frontend & Design

    Play YouTube Links in a Lightbox

    Opens links to YouTube videos (with the class "wpide-video-lightbox" or around a thumbnail image) in a large on-page video player, and only contacts YouTube after the click.

  • JavaScript Frontend & Design

    Prevent Double Form Submissions

    Disables a form's submit button and shows "Sending…" right after it is clicked, so impatient visitors cannot send comments, enquiries or orders twice.

  • HTML Frontend & Design

    Turn Headings Into an Accordion

    Turns every H3 inside a block with the class "wpide-accordion" into a clickable question that shows or hides the content below it, for FAQs written as plain headings and paragraphs.

Have a snippet worth sharing?

Publish it to the library from WPIDE or right here. Sign in with any WordPress site that runs WPIDE, free or Pro. Public snippets are reviewed by the WPIDE team before they appear.