jQuery Stocks Plugin
Create your Stocks plugin
Why People Love Elfsight
Wouldn’t it be nice if your website could show up-to-the-minute market numbers without building an API integration from scratch? That’s exactly what our widget does. Think fresh prices, day change, and a neat mini chart – right inside your content, header, or sidebar.
Here’s the kicker – setup feels like snapping a LEGO piece into place. Paste one snippet, drop a container, publish. A boutique finance blog told us they parked a slim ticker above their “Morning Brief” and readers started checking prices before scrolling. A tiny tweak with a big impact.
Did you know that, according to Statista, more than 150 million people in the U.S. track investment and stock data online?
Give it a try today – in just a couple of clicks you’ll add real value to every market-focused post.
Key Features of the Stocks Widget
- Real-time prices – Numbers refresh automatically, so visitors always see what’s moving right now.
- Multiple tickers – Build a compact watchlist of companies or indices without crowding your layout.
- Display modes – Choose a slim ticker for headlines or a detailed card with price, change, and a mini chart for deeper context.
- Easy customization – Tune colors, fonts, corners, and spacing to match your brand from day one.
- Works even if you’re not technical – Copy, paste, done. Updating symbols later takes seconds.
- Fast and responsive – Asynchronous loading keeps pages snappy; the layout adapts beautifully on mobile.
Open the live demo and build your jQuery-ready version
How to Add the Stocks Widget to jQuery
Whether you want it inline inside content or floating across the whole website, you’ll be done in a few simple steps.
- Create your widget in the Elfsight Editor.
Pick companies or indices, choose layout (ticker or detailed), adjust style, and preview. - Copy your installation code.
We’ll generate a tiny snippet – that’s your entire setup. - Inline placement.
Add a container where you want the widget to appear (for example, a<div id="market-block">). Paste the Elfsight code before</body>or in your bundle. The widget renders automatically when the page loads. - Floating ticker (optional).
Wrap the container in a simple fixed-position element (top or bottom). This creates a persistent ticker visible while users scroll. - Publish and check.
Refresh the page – you’ll see live prices immediately. If you use document-ready handlers, no extra jQuery configuration is required.
If you need help at any point, our Help Center has step-by-step guides. You can also connect with others in our Community Forum, share ideas in the Wishlist, and follow updates in the Changelog.
FAQ
Can I display several tickers at once?
Absolutely. Create a concise watchlist – for example, a couple of tech names plus a broad index – inside a single block.
Do I have to write jQuery code to use it?
No. The widget renders itself once the page loads. If you’re comfortable with jQuery, you can still control the container or position it with your existing scripts.
Will it slow down my pages?
No. It loads asynchronously, so your content appears quickly while market data updates in the background.
Can I match it to my brand?
Yes. Adjust palette, typography, spacing, and corners so it looks native to your theme rather than bolted on.
Is it mobile-friendly?
Definitely. The layout adapts to smaller screens, keeping prices and changes readable on phones and tablets.
Where can I get help or request a feature?
Browse tutorials in our Help Center, chat with peers in the Community Forum, add ideas in the Wishlist, and see what’s new in the Changelog.