Solo How To

Last updated on

10 June 2026

Each region in your site has its own settings. If a region doesn't have any content, it won't appear on the settings page at `your-site-domain/admin/appearance/settings/solo`

Upgrading from W3CSS Theme to Solo Theme

Watch video on Youtube Part One

Watch video on Youtube Part Two

Moving from W3CSS Theme (or a W3CSS sub-theme) to Solo is straightforward. Here's how to transfer your blocks and settings to your new Solo sub-theme:

First, download the Solo theme and go to your-site/admin/appearance. Click the "Install" button next to Solo.

To make the transition easier, download and install the "solo_copy_blocks" module. You'll find detailed installation instructions on the Solo theme page. Once installed, visit your-site/admin/structure/block to compare the blocks that were copied from your old theme.

After completing these steps, you'll be ready to customize your colors and finalize your new theme.

Installing Solo Theme

Getting Solo up and running takes just a few minutes:

Download the theme and place it in your `your-drupal-site-name/themes/` folder.
Open your web browser and navigate to `your-site-domain/admin/appearance`.
Scroll down the page until you see 'Solo Theme'.
Click the 'Install and set as default' button.
Click 'Save' to complete the installation.

Changing Your Logo

Make Solo truly yours by adding your own logo. Navigate to `your-drupal-site-name/admin/appearance/settings/solo` and uncheck the box that says "Use the logo supplied by the theme". You can now upload your own logo image.

After uploading, enter the location of your logo in the "Path to custom logo" field and click save. Keep in mind that Solo doesn't restrict your logo size, so upload an image that's already sized the way you want it to appear on your site.

If you're using a sub-theme, you'll need to disable the logo in the Solo theme first before you can upload a logo in your sub-theme.

Changing Your Favicon

The favicon is the small icon that appears in browser tabs. To use your own, go to `your-drupal-site-name/admin/appearance/settings/solo` and uncheck "Use the favicon supplied by the theme". Upload your custom icon, enter its path in the "Path to custom icon" field, and save your changes.

Displaying Your Site Slogan

Want to show a tagline under your site name? Navigate to `your-drupal-site-name/admin/structure/block`. In the header region, you'll see two blocks: `User account menu` and `Site branding`. Click `configure` next to `Site branding` and check the box for `Site Slogan`.

Customizing Copyright and Credit Information

Navigate to `your-drupal-site-name/admin/appearance/settings/solo` to customize the footer text.

Solo provides four text fields at the bottom of your site, each pre-filled with sample text:

Copyright Text: Enter something like "Copyright © %year% Your Company Name | All rights reserved". The %year% token automatically updates every year, so you'll never have outdated copyright dates.
Footer Link, Footer Label, and Footer Link Text: These work together to create a professional credit line. For example:
- Footer Label: "Developed & Designed by"
- Footer Link Text: "Your Company Name"
- Footer Link: "https://yourcompany.com"

Removing Copyright and Credit Information

If you prefer a cleaner footer without copyright text, navigate to `your-drupal-site-name/admin/appearance/settings/solo`, expand the `Copyright & Credit` section, and simply clear the text fields.

Creating Your Own Sub-Theme

A sub-theme lets you customize Solo while keeping the original theme intact for updates. Think of it as making your own personalized version. In this example, we'll create a sub-theme called "fun".

Step 1: Copy and Rename the Theme Folder

Locate the Template Folder: Find the folder named solo_subtheme inside ../web/themes/contrib/.
Make a Copy: Copy the entire solo_subtheme folder.
Paste and Rename: Paste it into ../web/themes/custom/ and rename the folder to fun.

Step 2: Rename Configuration Files

Open Your New Folder: Navigate into your newly created fun folder.
Rename Three Key Files: You'll need to rename these files so they match your new theme name:
- Rename solo_subtheme.info.yml to fun.info.yml
- Rename solo_subtheme.libraries.yml to fun.libraries.yml
- Rename solo_subtheme.theme to fun.theme

Step 3: Update the Theme Information

Open the Information File: Open fun.info.yml in a text editor.
Update Two Fields:
- Change the name to fun.
- Write a brief description that explains what your theme is for.
Update the Library Reference:
- Find the line that reads - solo_subtheme/solo-subtheme-global.
- Change it to fun/fun-global.

Step 4: Update the Libraries Configuration

Open the Libraries File: Open fun.libraries.yml in your text editor.
Update the Reference Name:
- Find solo-subtheme-global: and change it to fun-global:.

Step 5: Update Optional Files (if needed)

Rename Style Files: If you want to rename solo-subtheme-style.css and solo-subtheme-style.js to match your theme name, you'll need to update them in their respective folders:
- For the CSS file, go to ../web/themes/custom/fun/css and rename it there.
- For the JS file, go to ../web/themes/custom/fun/js and rename it there.

Step 6: Update the Settings File

Locate and Rename Settings:
- Navigate to ../web/themes/custom/fun/config/install/.
- Find solo_subtheme.settings.yml.
- Rename it to fun.settings.yml.

Step 7: Update the Schema File

Locate and Update Schema:
- Go to ../web/themes/custom/fun/config/schema/.
- Find solo_subtheme.schema.yml and rename it to fun.schema.yml.
- Open fun.schema.yml and change:
```
solo_subtheme.settings:
  type: mapping
  label: 'Solo sub-theme settings'
  mapping:
```
  to:
```
fun.settings:
  type: mapping
  label: 'Fun sub-theme settings'
  mapping:
```

Step 8: Update the Theme File

Edit the Theme File:
- Open fun.theme in your text editor.
- Find solo_subtheme_theme_suggestions_block_alter and change it to fun_theme_suggestions_block_alter
- Find the line $suggestion = str_replace('solo_', 'solo_subtheme_', $suggestion);.
- Replace it with $suggestion = str_replace('your_old_theme_machine_name_', 'fun_', $suggestion);.

Congratulations! You've successfully created your own custom sub-theme. Your new "fun" theme is now ready to install and customize.

Drupal menus come with default designs that work well for standard horizontal navigation with multiple levels. However, different areas of your site may need different menu styles. Solo gives you several templates to choose from based on where your menu appears and how you want it to behave.

Here's where you'll find the templates for different regions:

Left Sidebar menus: ../solo/templates/navigation/menu--sidebar-first.html.twig
Right Sidebar menus: ../solo/templates/navigation/menu--sidebar-second.html.twig
Footer menus: ../solo/templates/navigation/menu--footer-menu.html.twig
Primary Menu region: ../solo/templates/navigation/menu--primary-menu.html.twig
Primary Sidebar Menu region: ../solo/templates/navigation/menu--primary-sidebar-menu.html.twig
User Account menu: ../solo/templates/navigation/menu--account.html.twig

For simple, single-level menus (like those commonly used in footers), use the sidebar template at ../solo/templates/navigation/menu--sidebar-first.html.twig.

For more advanced menus with dropdown submenus that adapt to different screen sizes, Solo offers several specialized templates:

Horizontal menu with hover dropdowns: ../solo/templates/navigation/menu--responsive-menu-template-hover.html.twig
Horizontal menu with click dropdowns: ../solo/templates/navigation/menu--responsive-menu-template-click.html.twig
Vertical sidebar menu with hover dropdowns: ../solo/templates/navigation/menu--primary-sidebar-menu-template-hover.html.twig
Vertical sidebar menu with click dropdowns: ../solo/templates/navigation/menu--primary-sidebar-menu-template-click.html.twig

Help improve this page

Page status: No known problems

You can:

On this page