Drupal-10-theme Tailwind Templates

Drupal 10 Theme

🎨 A custom Drupal 10 theme styled with Tailwind CSS, designed for a modern tourism website. Includes responsive layout, navigation, sidebar, animated header, and sample travel content to showcase destinations and tour packages.

MyTheme - Drupal 10 Custom Theme with Tailwind CSS

MyTheme is a lightweight and responsive Drupal 10 custom theme built using Tailwind CSS. It is designed for tourism-based websites, focusing on clean design, ease of customization, and enhanced user experience.


🌐 Project Overview

MyTheme is ideal for showcasing destinations, travel packages, and tourism services. It supports custom regions like Top Banner, Logo, Navigation Menu, Sidebar, Content, and Footer. The theme uses modern frontend practices and integrates seamlessly with Drupal’s block and content management system.


🧰 Features

  • Built with Tailwind CSS for modern utility-first styling
  • Responsive layout optimized for all devices
  • Custom regions: Top Banner, Logo, Navigation Menu, Sidebar, Content, Footer
  • Placeholder content and test buttons for development
  • Easily extendable and customizable structure
  • Works without requiring a base theme like Classy or Stable

πŸ—ΊοΈ Demo Content for Tourism

Explore Hidden Gems Across India
From the majestic Himalayas in the north to the serene backwaters of Kerala in the south, India is full of breathtaking destinations waiting to be discovered. Our travel guides and curated itineraries help you experience these wonders like never before.

Plan Your Perfect Getaway
Whether you're a solo traveler, a couple, or a family, we help design personalized trips that suit your pace and style. Choose from adventure tours, heritage walks, or wellness retreats β€” all at your fingertips.

Trusted by Thousands of Travelers
With years of experience in the tourism industry, we’ve built a reputation for excellence and care. Read testimonials from real travelers who’ve explored the world with our expert guidance.

Seamless Booking and 24/7 Support
Our platform ensures a smooth and secure travel experience. From ticket booking to local assistance, our team is available round the clock to help you travel with confidence and ease.


πŸ“ Directory Structure

```bash
mytheme/
β”œβ”€β”€ css/
β”‚   └── style.css
β”œβ”€β”€ js/
β”‚   └── script.js
β”œβ”€β”€ templates/
β”‚   └── page.html.twig
β”œβ”€β”€ mytheme.info.yml
β”œβ”€β”€ mytheme.libraries.yml
└── README.md

πŸ”§ Step-by-Step Setup Guide

βœ… Step 1: Clone or Download Repository

Clone the repository or download and unzip it in your local machine.

βœ… Step 2: Move Theme Folder

Move the theme directory to your Drupal custom themes folder:

/htdocs/drupal/themes/custom/mytheme

βœ… Step 3: Enable Theme

  1. Go to Drupal Admin β†’ Appearance
  2. Find MyTheme
  3. Click Install and Set as Default

πŸš€ Front Page Setup

  1. Navigate to:
    /admin/content β†’ Add content β†’ Basic page

  2. Title: Home Page
    Body: Add some dummy content (e.g., β€œWelcome to the Tourism Website!”)
    Click Save

  3. Go to:
    /admin/config/system/site-information

  4. Set Default front page to /home-page (or your newly created page's path)


πŸ› οΈ Customizations

  • Framework: Tailwind CSS for utility-first styling

  • No base theme like Classy or Stable required

  • Custom Regions:

    • Top Banner
    • Logo
    • Navigation Menu
    • Sidebar
    • Content
    • Footer
  • Features:

    • Responsive layout
    • Animations and hover effects
    • Clean structure for easy customization

βœ… Compatibility

  • Drupal: 10.x
  • Environment: XAMPP (PHP 8.x, MySQL 5.7+)
  • Browsers: Cross-browser compatible

πŸ“Œ Submission Info

  • Developer: Kareena Chinchkar
  • GitHub ID: KareenaChinchkar25
  • Access Provided To: akshay9085
  • Submitted Under: FOSSEE Drupal Theme Submission

Top categories

Loading Svelte Themes