Features
24 Customizable Regions
The Solo theme offers an impressive 24 distinct regions, each with its own unique settings, enabling a high degree of customization and control over your website’s design. These regions are crafted to accommodate a variety of content types and layouts, making it adaptable to different site needs. Whether you require space for main content, additional sidebars, or an organized footer, Solo has the perfect region for it. Each region is dynamically assigned a class based on the width of the content, ensuring a responsive and precise layout on all devices.
Intelligent Design
A standout feature of Solo is its intelligent design. When regions are not in use, their corresponding settings are automatically hidden. This keeps the interface clean, reducing clutter and making it easier for site administrators to focus on the elements that matter. This intelligent approach enhances the overall user experience and simplifies the customization process.
Fully Responsive Design
The Solo theme is built with a mobile-first mindset. Its fully responsive layout adjusts to any screen size, ensuring that your website looks and functions perfectly on desktops, tablets, and smartphones. This functionality greatly enhances the user experience and accessibility, offering seamless browsing across different devices.
Five Configurable Breakpoints
Solo provides five configurable breakpoints for both the site and the menu, allowing you to present the most optimized layout to users on various devices. This flexibility helps in creating an adaptive experience, enhancing the overall usability and visual appeal of the site.
Three-Level Main Menu with Mega Menu Support
Solo includes a three-level main menu, which is perfect for websites with complex navigation needs. The mega menu support allows for large content structures to be presented in an organized and accessible way. The menus are both hoverable and clickable, offering more interaction options for users.
Sidebar Main Menu
In addition to the primary three-level menu, Solo also features a sidebar menu that provides an alternative navigation structure. This sidebar menu offers a user-friendly option for sites with deep content hierarchies, ensuring users can easily navigate through the website.
15 Customizable Color Fields Per Region
Solo empowers users with extensive color customization options. Each region can be tailored with 15 different color fields, allowing site owners to align the design with their brand identity effortlessly. Whether you’re adjusting background colors, text, or buttons, the Solo theme makes it easy to create a visually cohesive website.
Flexible Layout Options
Solo provides a wide variety of layout customization options. With seven styles for two-column layouts, three styles for three-column layouts, and four styles for four-column layouts, you have the flexibility to structure content in a way that best suits your website’s needs.
Conclusion
In conclusion, Solo is the ideal theme for those who want extensive design control without sacrificing simplicity. Whether you’re building a personal blog or a corporate website, the Solo theme offers the tools you need to create a stunning and professional online presence. Its 24 customizable regions, intelligent design, and responsive layout make it a versatile solution for a wide range of websites.
Solo Regions
The Solo theme organizes its regions into two main categories: Single Regions and Grouped Regions. Single regions exist independently, with no adjacent regions in the same wrapper. In contrast, grouped regions consist of three or four areas that share the same horizontal space, evenly distributed. The top, main, bottom, and footer sections are examples of grouped regions.
Single Regions
Solo includes a number of individual regions designed for flexibility and standalone content display. These are perfect for static elements or elements that don’t require grouping with other sections.
- Popup Login Block
- Fixed Search Block
- Header
- Primary Sidebar Menu
- Primary Menu
- Welcome Text
- Highlighted Content
- System Messages
- Page Title
- Breadcrumb
- Footer Menu
All single regions are visible across all site pages, with the exception of the 'Page Title' and 'Welcome Text'. The 'Page Title' is hidden on the home page, while the 'Welcome Text' only appears on the home page.
Grouped Regions
Solo also includes grouped regions, which allow related content to be wrapped together for better organization and layout consistency. This approach ensures content is displayed uniformly and helps maintain design cohesion.
- Top: Contains three containers for top content
- Main: Left Sidebar, Main Content, Right Sidebar
- Bottom: Contains four containers for bottom content
- Footer: Contains three containers for footer content
Theme Architecture
The theme architecture of Solo revolves around the page-wrapper element, which contains 24 distinct regions. Both the page-wrapper and the individual regions allow for up to 15 different color inputs, offering robust design flexibility. The color options include:
- General
- Background color
- Text color
- Border color
- HTML heading color (h1, h2, h3)
- Form Input Field Background color
- Links
- Text link color
- Text link hover color
- Menus
- Text menu link color
- Text menu link hover color
- Background menu link color
- Background menu link hover color
- Buttons
- Button text color
- Button text hover color
- Button background color
- Button background hover color
Color Application: First, global colors are applied to the page wrapper. Then, specific colors for each region are set, overriding the global settings where applicable.
Theme Settings
Blueprint
The blueprint of the Solo theme outlines how regions are structured on a webpage. Each region has specific purposes, from navigation to content display. Here’s a quick description of the purpose of each region and how they can be used effectively:
highlighted: For key or prominent content.popup_login_block: A login popup for users.fixed_search_block: A fixed search bar for easy access.header: The top section, usually containing the logo and navigation links.primary_sidebar_menu: The main sidebar menu, often on the left or right of the page.primary_menu: The primary navigation menu, typically located in the header.welcome_text: A block welcoming visitors to the site.top_first,top_second,top_third: Three containers at the top of the page.system_messages: Displays system messages for users.page_title: Shows the title of the current page.breadcrumb: Displays the navigation breadcrumb trail.sidebar_first(Left Sidebar),sidebar_second(Right Sidebar): The left and right sidebars of the page.content: The main content area of the page.bottom_first,bottom_second,bottom_third,bottom_fourth: Containers located at the bottom of the page.footer_first,footer_second,footer_third: Footer containers for additional content and navigation.footer_menu: The footer navigation menu.
Global Site Settings
Global settings in Solo allow you to make site-wide adjustments with a single click, ensuring consistency and control. This includes layout, typography, and spacing modifications.
- Adjust the entire site’s width with options ranging from 800px to 2560px or 100% full width.
- Customize the width for individual content types, offering the same range of options for each.
- Apply different width settings to individual nodes, providing the flexibility to customize individual pages.
- Five breakpoint options to fine-tune the responsiveness of the site: 576px, 768px, 992px, 1200px, 1400px.
- Adjust the collapse order of layouts. When enabled, it reorganizes grouped regions into a responsive grid for improved viewing on smaller screens.
- Similar breakpoint options are available for menus, ensuring that navigation adapts perfectly to various devices.
- Adjust the spacing between regions with five available size options for consistent layouts across the site.
- Modify the global font size with three different options to enhance readability.
- Solo supports three date formats: Short, Medium, and Long.
- Import and apply your own Google font across the website for a personalized touch.
- Add custom CSS directly to the header for quick tweaks without the need for a sub-theme.
- Solo allows customization of login, registration, and password reset pages with the option to disable sidebars and center the form.
- Rearrange the order of the header and main menu for a more customized appearance.
- Apply a scroll-triggered animation to blocks, creating an elegant opacity effect as users navigate the page.
- Adjust the layout for fields with multiple values, arranging them on the same line and separated by space.
- Enable reading mode for specific content types, setting the maximum content width to 600px for better readability.
Libraries and Fonts Settings
Solo provides advanced font and library settings, allowing you to use different font libraries and ensure consistent typography across your site. This helps you create a more professional and branded appearance for your website.
- Upload and locally manage the W3.CSS library for better control over styling.
- Choose from Font Awesome libraries (version 4, 5, or 6) for icons.
- Select from 50 Google fonts for the entire website, ensuring typography aligns with your brand.
- Apply specific Google fonts to headers (h1, h2, h3), with 26 fonts to choose from.
- Solo includes 25 special Google fonts that can be applied to any HTML tag.
Page Wrapper Settings
The page-wrapper controls the overall site layout, and the settings here allow for customization with predefined CSS classes and color schemes. This enhances the overall design and makes it easier to maintain a consistent look across the website.
- A text field is provided to input predefined CSS classes for the
page-wrapperor any third-party library. - 15 color input fields are available for global use, applied across the site for a consistent design.
Search Results Settings
- Disable Advanced Search Filters: Configure which advanced search filters to disable—keywords, types, or language. When all filters are disabled, the "Advanced" section will be hidden. By default, all filters are enabled.
- Use Teaser Mode for Search Results: Display search results using the teaser view mode for a simplified layout.
- Content Types for Search Results: Choose which content types are included in search results. This setting applies to both the search form and Drupal Core Search Blocks.
Predefined Color Scheme Settings
The predefined color schemes in Solo enable you to quickly apply a professional look to your site. With 50 themes to choose from, you can ensure your site looks polished without needing to customize colors manually.
- A dropdown list provides 50 predefined color schemes, allowing for quick and easy site-wide color changes.
Social Media Links Settings
Social media integration is essential for modern websites, and Solo makes it easy to customize and manage social media icons. This ensures your site visitors can easily access your social profiles, boosting engagement.
- Choose from three sizes for social media icons: Small, Medium, or Large.
- Customize the icon colors using a color input field.
- Enable or disable social icons with a checkbox toggle.
- Solo supports up to 15 social media platforms, including Facebook, Twitter (X), Pinterest, LinkedIn, Instagram, YouTube, Mastodon, Snapchat, Reddit, TikTok, WhatsApp, Threads, and RSS.
Single Regions
Highlighted Settings
Highlighted regions allow you to control visibility across different pages, ensuring that your most important content stands out where it matters most.
- Adjust visibility for specific pages: all pages, home page only, or all pages except the home page.
- Apply predefined CSS classes or upload third-party CSS libraries.
- 15 color input fields for complete customization of this region.
Popup Login Block Settings
Popup login blocks enhance user experience by allowing quick login access without navigating away from the current page. This is ideal for sites with member areas or restricted content.
- Customize the login experience by allowing users to log in via a popup.
- Modify the display text for the login prompt.
- Utilize 15 color fields to align the popup’s appearance with the site’s design.
Fixed Search Block Settings
A fixed search block ensures that users can search your site’s content without scrolling or navigating to another page, improving accessibility and user experience.
- Add predefined CSS classes or use external libraries for styling the search block.
- 15 customizable color input fields.
Header Settings
The header is a critical part of any website, and Solo offers several customization options for aligning and styling your site’s header elements. This helps create a professional and user-friendly first impression.
- Center the site's logo, name, and slogan with several alignment options.
- Control logo and menu placement based on breakpoints.
- Apply up to 15 color fields for complete customization of the header region.
Primary Sidebar Menu Settings
The primary sidebar menu provides an alternative navigation option for sites with extensive content, helping users explore deeper pages without getting lost.
- Add predefined CSS classes to the sidebar menu for advanced customization.
- Enable hover-based dropdowns for the sidebar menu on large screens.
- Apply borders to menu items and choose to display the logo at the bottom.
- 15 color fields are available for detailed customization.
Primary Menu Settings
Solo's primary menu settings give you control over the site’s main navigation, with mega menu support and various layout options. This is perfect for sites with large or complex structures.
- Customize dropdown behavior with hover or click options.
- Enable mega menu functionality with up to 14 different layout options for organizing content.
- Choose from 15 color fields to align the menu with your brand’s design.
Welcome Settings
The welcome block provides a warm introduction to new visitors and can be styled to match the overall design of the site.
- Add CSS classes and apply 15 color fields for customization of the welcome text block.
System Message Settings
System messages provide feedback to users, and Solo allows you to style them to align with your branding.
- Personalize system message backgrounds and apply up to 15 custom colors to match your branding.
Page Title Settings
Customize the appearance of the page title for consistency across devices. You can apply animations to draw attention to the title without detracting from the content.
- Customize the page title with predefined CSS classes and 15 color options.
- Select from 6 different font sizes for both small and large screens.
- Apply one of 24 CSS text animations to bring the title to life.
Breadcrumb Settings
Breadcrumbs improve navigation and user experience by providing clear indicators of where users are on the site. Solo allows you to style breadcrumbs for better visual consistency.
- Apply predefined CSS classes and customize the breadcrumb with 15 color fields.
- Optionally hide the page title from the breadcrumb trail.
Footer Menu Settings
The footer menu provides additional navigation options for visitors, and Solo allows extensive customization to ensure it fits within the site’s design.
- Apply CSS animations to the footer menu links for enhanced engagement.
- Customize with 15 color options to match the footer’s overall design.
Copyright and Credit Settings
Footer credits can be customized to align with your brand, and Solo provides flexible options to include dynamic content like the copyright year.
- Add CSS classes and apply 15 color fields for a personalized footer credit area.
- Enable or disable the credit display.
Grouped Regions
Grouped regions offer a way to collectively wrap content for uniformity and design consistency. Each region within a group has its own settings, which can override the group settings if needed. This structure is ideal for maintaining consistent design elements across multiple sections of the site.
Region Wrapper Settings
The region wrapper allows multiple columns to be adjusted and styled. This ensures the grouped content is aligned properly for a clean, professional design.
- Two-column layouts: 50%-50%, 67%-33%, 75%-25%, etc.
- Three-column layouts: 33.3%-33.3%-33.3%, 25%-50%-25%, etc.
- Four-column layouts: 25%-25%-25%-25%, etc.
- Change the visibility for grouped regions: visible on all pages, only on the home page, or all pages except the home page.
- Apply animations, borders, and round corners to individual regions within the wrapper.
- Add CSS classes and choose from 15 color fields to style the wrapper and its regions.
Individual Region Settings
Each individual region within a group can be customized independently of the wrapper, ensuring you have complete control over its appearance. This allows for greater design flexibility within grouped content areas.
- Add predefined CSS classes to individual regions for custom styling.
- 15 color input fields for complete control over the design of each region.
