Pixel is a free news and magazine Blogger template (Blogspot theme) designed for online newspapers, content-rich magazine sites, and multi-author blogs. It ships with a drag-and-drop featured post grid, multi-level dropdown and mega menu navigation, three built-in AdSense ad slots, and a tabbed sidebar - all running on 100% vanilla JavaScript with zero render-blocking assets.
Created and maintained by Colorlib, Pixel is a fast, AdSense-ready news and magazine theme with a mega menu, featured post grid, and tabbed sidebar — free for personal and commercial use.
Live Demo | Download ZIP | Documentation | Changelog
- Featured post grid - an eye-catching homepage hero with secondary story tiles, loaded from any post label you choose and optimized for Largest Contentful Paint
- Mega menu navigation - turn any menu item into a paged, image-rich mega menu by pointing it at a post label; pages are prefetched so the arrows flip instantly
- AdSense-ready - three built-in advertisement slots (full-width home banner, post top, post bottom) plus a sidebar ad widget
- Tabbed sidebar - Recent, Popular, and Comments tabs with accessible keyboard-friendly switching
- Custom list and gallery widgets - magazine-style homepage sections fed by post labels, including a touch-friendly Swiper gallery with YouTube video support
- Mobile-first responsive design - 7 CSS breakpoints from 1200px down to 300px
- SEO-optimized markup — exactly one
h1per page, JSON-LD structured data (WebSite,SearchAction,BlogPosting), Open Graph and Twitter card meta tags, semantic landmarks - Fast page load — zero jQuery, zero CSS frameworks, no render-blocking external assets, preconnect hints, native lazy loading, and right-sized images served by Blogger's CDN
- Accessible — skip-to-content link, labeled controls, ARIA tab roles, keyboard-friendly navigation, and no user-zoom blocking
- Easy color customization — change the color scheme from Blogger's theme editor, no code required
- Font Awesome 7 icons and Google Fonts, loaded without blocking the first paint
- Self-updating copyright year in the footer
- Download the ZIP or clone this repository
- Sign in to Blogger at blogger.com and pick your blog
- Open the theme editor — Theme → Customize dropdown → Edit HTML
- Replace the code — select everything, delete it, and paste the full contents of
Pixel-Blogger-Template.xml - Save - if Blogger warns that the FollowByEmail (Newsletter) widget will be deleted, confirm it; that widget posted to FeedBurner email subscriptions, which Google shut down in 2021
- Set mobile to Desktop — in Theme, click the gear icon under the Mobile preview and choose Desktop; the template is fully responsive and this removes Blogger's legacy
?m=1mobile wrapper (and its extra redirect) for mobile visitors
To preview the template with sample posts before publishing your own:
- Go to Settings > Manage blog > Import content
- Upload
Pixel Demo Content.xmlfrom this repository
- Colors — Theme → Customize → Advanced exposes the template's color variables (accent color, backgrounds, text) with live preview
- Menus — edit the navigation LinkList widgets in Layout; prefix an item with
_for a dropdown level, or set a link to[Mega Menu]-style label syntax where supported - Homepage sections — the label-driven widgets are configured from Layout by editing each widget's content (the label name and post count)
- Ads — paste your AdSense (or any) ad code into the advertisement widgets in Layout
| Library | Version | Loading |
|---|---|---|
| Swiper | 11 (pinned) | On demand, only when a slider/carousel exists on the page |
| Font Awesome | 7 | Non-blocking, pinned via jsDelivr |
| Google Fonts | — | display=swap, non-blocking |
Everything else is hand-written CSS and vanilla JavaScript inside the single template file — no jQuery, no Bootstrap, no build step. Feeds load over same-origin fetch() with alt=json.
Is Pixel really free? Yes — free for personal and commercial use under GPL v3. Attribution to Colorlib is appreciated but not required.
Does it work with AdSense? Yes. The layout includes dedicated ad widgets, and you can add more ad units through Blogger's Layout editor.
Will it slow down my blog? No — the template loads zero render-blocking external assets and removed all legacy frameworks (jQuery, Bootstrap, Owl Carousel) in version 2.0. See the changelog for the full performance work.
Can I use it on multiple blogs? Yes, on as many blogs as you like.
Pixel is one of nine free, open-source Blogger templates we maintain on GitHub - every one modernized with vanilla JavaScript, structured data, and an accessibility pass. Pick the design that fits your blog:
 Minimal Clean & Minimal Blog Blogger template |  Simplify Minimal Personal Blog Blogger template |  Ember Magazine Blogger template |
 Kaplan Magazine Blogger template |  Plasma Travel & News Magazine Blogger template |  PhotoMag Photography Blogger template |
 FutureMag News & Magazine Blogger template |  Shutter Photography Portfolio Blogger template |
Looking for even more? Browse the full collection of free Blogger templates on Colorlib, or explore our free WordPress themes and free HTML website templates.
Pixel is released under the GPL v3 license. You are free to use, modify, and redistribute it for personal and commercial projects.
Made with care by Colorlib — free website templates and WordPress themes since 2013.