ABC

ABC is a colorful, versatile and responsive Drupal theme developed by Dr. Radut. Designed for creative freedom, ABC combines distinctive visual elements with extensive customization options, allowing site builders to create attractive, personalized websites without unnecessary complexity.

Whether you are building a personal blog, corporate website, creative portfolio, community portal or multilingual project, ABC offers the flexibility to shape your website's appearance around your content, branding and individual preferences.

Version 2.x introduces a significantly modernized implementation for Drupal 11.4+ and Drupal 12, with updated theme architecture, refined responsive layouts, expanded content presentation options and improved configuration controls.

Key features

• Colorful and customizable design: Independently configurable backgrounds, site names, titles, blocks, menus and interface colors, with predefined choices and custom color pickers.
• Responsive design: Flexible layouts that adapt to desktop, tablet and mobile screens.
• Flexible page structure: One-, two- and three-column layouts, configurable page width, adjustable sidebars and numerous block regions, including a dedicated Full-width content region.
• 135 optional letter logos: A collection of Latin alphabet and ABC logos in five colors, complementing the standard SVG logo and support for your own branding.
• Decorative backgrounds: Five coordinated background styles with optional matching artwork, static or fixed positioning, and custom color controls.
• Customizable typography: Five font families and three font-size options.
• Content presentation: Standard, Zebra rows and Cards layouts for compatible Views displays, with configurable columns, spacing and width options.
• Responsive navigation: Drop-down menus, configurable menu positioning, separately styled menu items and convenient header Search.
• Built-in slideshow: Up to seven slides, with Half-page, Content-width and Full-page image presentations, configurable text, links and maximum height.
• Multilingual and RTL support: Right-to-left layouts, language-specific logos and language-aware slideshow links.
• Visual enhancements: Themed blocks, block icons, SVG page icons, optional rounded corners and individually configurable menu colors.
• Social media integration: A dedicated, administrator-managed Social media links menu with SVG icons for popular networks.
• Author and date controls: Configure the display of authors, publication dates, update dates and their labels for individual content types.
• Update-safe customization: Load your own local CSS file from outside the contributed theme directory.

Make ABC your own

ABC is designed to offer more than a collection of predefined color schemes. Instead of applying a single palette to the entire website, you can configure individual elements and combine colors to create your preferred visual identity.

Available customization options include:

• Backgrounds: Choose Pink, Green, Yellow, Blue or Black & White, with optional matching decorative artwork. Background positioning can be static or fixed, and custom background colors are also supported.
• Site name and node titles: Select colors independently from predefined choices or use custom color pickers.
• Block titles: Choose individual colors or the distinctive Multicolor option.
• Main navigation: Configure the first, middle and last menu items separately, along with rollover colors.
• Top links: Apply a separate color scheme to the compact top navigation.
• Content rows: Customize alternating Zebra backgrounds, including their opacity.
• Social and page icons: Configure normal and hover/focus colors.

These options can be combined without editing the theme's source files, making ABC particularly suitable for websites with specific branding requirements.

Letter logos and distinctive backgrounds

One of ABC's most recognizable features is its collection of 135 optional PNG logos, including individual Latin alphabet letters and ABC designs in five coordinated colors: Blue, Green, Grey, Orange and Pink.

Select a logo through Drupal's standard logo settings, use the included neutral SVG logo or provide your own image. Different logos can also be assigned to different interface languages.

ABC also includes decorative background artwork that complements its predefined background colors. Enable or disable the artwork, choose static or fixed positioning, or create an entirely different appearance through custom CSS.

Lightweight foundation with PureCSS

ABC uses PureCSS, a compact, modular CSS framework providing responsive grids and essential interface components.

PureCSS is bundled locally with the theme, eliminating the need for an external CSS service. ABC requires no separate base theme and uses modern JavaScript for its interactive features.

Layouts and content presentation

ABC provides flexible page widths, independently adjustable sidebars and numerous block regions for organizing content, navigation and supplementary information.

A dedicated Full-width content region provides additional flexibility for layouts that extend beyond the normal content columns.

For compatible Views displays, choose between three presentation styles:

• Standard: A clean, traditional content listing that preserves the normal page layout.
• Zebra rows: Alternating colored backgrounds, with configurable boxed or full-width presentation and shared color controls.
• Cards: Responsive card layouts with two, three or four columns and configurable spacing. Cards can retain sidebars or use a full-width page layout where supported.

Layout choices can be applied to individual compatible Views page and block displays without rebuilding the underlying Views. The built-in Aggregator latest-items page also supports configurable content presentation when the Aggregator module is enabled.

Typography, navigation and visual customization

Choose from five font families: Sans-serif, Montserrat, Merriweather, Open Sans and Roboto. Three font-size settings help you adjust readability and the overall appearance of your website.

The main and secondary menus can be positioned to the left, center or right. ABC also offers independently styled main menu items, compact Top links, responsive navigation and an expandable header Search interface.

Additional settings include themed blocks, decorative block elements, SVG icons, rounded corners, breadcrumb visibility and configurable Search submit buttons outside the header.

A comprehensive example stylesheet is included, with optional customization examples for layouts, content elements and additional interface styling.

Slideshow and multilingual websites

ABC includes an integrated responsive slideshow supporting up to seven configurable slides. Each slide can have its own image, headline, description, alternative text and link.

Three slideshow presentation styles are available:

• Half-page image: A compact presentation suited to smaller visual areas.
• Content-width image: A slideshow contained within the normal page width.
• Full-page image: A wider visual presentation for prominent imagery.

Slideshow visibility can be configured for the front page, all pages or other supported page combinations. An optional maximum image height provides further control over presentation.

ABC supports multilingual websites, right-to-left languages and language-specific logos. Slideshow text can be translated, while internal slideshow links respect the current interface language.

Looking for suitable slideshow images? Explore the free collection of Optimized Slider Images for PureCSS Drupal Themes.

Modernized for Drupal 11 and 12

The 2.x series brings significant improvements to the underlying theme architecture, including modern Drupal hooks, updated Twig templates, refined forms and navigation, locally bundled PureCSS, SVG-based icons and improved responsive behavior.

ABC 2.x also introduces enhanced content layouts, independent custom color controls, updated logo handling, modernized slideshow functionality and improved multilingual support.

Version 2.0.1 includes additional security hardening, improved multilingual URL handling, refined styling and compatibility fixes.

Compatibility: Drupal 11.4+ and Drupal 12.

Upgrading from 1.x: After upgrading, rebuild Drupal caches and re-save the theme settings. Review any existing customizations and migrated settings.

Live examples and demonstration

See ABC in action:

• Dr. Radut Web Solutions - A real-world implementation showcasing the theme's visual customization capabilities.
• Drupal themes demonstration website - Explore additional examples and theme-related resources.

Related projects

Discover other Drupal themes developed by Dr. Radut:

• Zero Point - A clean, versatile theme with a bright, professional appearance.
• Black Hole - A distinctive dark theme with astronomy-inspired colors and visual accents.
• ESUNT - A clean, responsive theme with customizable colors, flexible layouts and accessible navigation.

ABC is developed and maintained by Dr. Florian Radut.