Drupal 11 – Integrate Existing Custom Header into Martex Theme (Top Bar and Navigation)
Budget: $15 – $25 USD
Project Overview
I am using the Martex Drupal theme and I have already built a custom header using HTML and CSS. The header is fully functional when placed inside a Drupal Custom Block (Full HTML). I now need a developer to properly integrate this existing header into the theme structure so it behaves like a native part of the site.
This is not a design task. The design and layout are already completed. The work required is integration, cleanup, and alignment with Drupal best practices.
What Is Already Done
The following elements are already created and working:
Custom header built with HTML and CSS
Top bar including Contact, Sign up, and Sign in
Main navigation layout styled to match reference
Domain search banner (hero section)
Tested successfully inside a Drupal Custom Block
The current issue is that the implementation is not properly integrated into the theme. It is not connected to the theme’s header system, paragraph structure, or Drupal menu system.
Scope of Work
Integration into Martex Theme
Integrate the existing header into the theme by replacing or overriding the default header and hero banner. The result should behave like a native theme component, not a pasted HTML block. This may involve working with Twig templates, theme regions, or paragraph types.
Top Header Bar
Ensure the top bar appears at the very top of the site across all pages. It should be full width, stable, and not affected by other theme elements. It should not duplicate or break due to layout conflicts.
Navigation Menu Integration
Replace static menu items in the HTML with dynamic Drupal menu output. The menu must be manageable from the Drupal admin panel.
Clean Structure
Refactor the current implementation into a clean and maintainable structure. Use proper Drupal practices including Twig templates, blocks, and regions. Avoid hacks or temporary fixes.
Remove Unwanted Theme Effects
Disable or remove any animations or dynamic effects from the Martex header. The final header should be static and clean.
Responsiveness
Ensure the header displays correctly on desktop, tablet, and mobile devices.
Reference
I will provide a screenshot of the desired layout (similar to Namecheap) and the existing HTML code that is already working.
Deliverables
Fully integrated header within the Martex theme
Top bar and navigation working correctly across all pages
Menu connected to Drupal menu system
Clean and organized code (Twig and CSS)
Clear instructions on how to edit menu items and header content
Timeline
Estimated completion time is 1 to 2 days.
Requirements
The developer must have experience with Drupal 10 or 11, including:
Twig template customization
Drupal blocks and regions
Menu system integration
Important Notes
Do not rebuild the header from scratch.
Do not use page builders.
Do not break theme update compatibility.
Focus on clean and proper integration into the existing system.
Summary
The header is already built. The task is to integrate it properly into the Drupal Martex theme so it functions as a native, maintainable component.
I am using the Martex Drupal theme and I have already built a custom header using HTML and CSS. The header is fully functional when placed inside a Drupal Custom Block (Full HTML). I now need a developer to properly integrate this existing header into the theme structure so it behaves like a native part of the site.
This is not a design task. The design and layout are already completed. The work required is integration, cleanup, and alignment with Drupal best practices.
What Is Already Done
The following elements are already created and working:
Custom header built with HTML and CSS
Top bar including Contact, Sign up, and Sign in
Main navigation layout styled to match reference
Domain search banner (hero section)
Tested successfully inside a Drupal Custom Block
The current issue is that the implementation is not properly integrated into the theme. It is not connected to the theme’s header system, paragraph structure, or Drupal menu system.
Scope of Work
Integration into Martex Theme
Integrate the existing header into the theme by replacing or overriding the default header and hero banner. The result should behave like a native theme component, not a pasted HTML block. This may involve working with Twig templates, theme regions, or paragraph types.
Top Header Bar
Ensure the top bar appears at the very top of the site across all pages. It should be full width, stable, and not affected by other theme elements. It should not duplicate or break due to layout conflicts.
Navigation Menu Integration
Replace static menu items in the HTML with dynamic Drupal menu output. The menu must be manageable from the Drupal admin panel.
Clean Structure
Refactor the current implementation into a clean and maintainable structure. Use proper Drupal practices including Twig templates, blocks, and regions. Avoid hacks or temporary fixes.
Remove Unwanted Theme Effects
Disable or remove any animations or dynamic effects from the Martex header. The final header should be static and clean.
Responsiveness
Ensure the header displays correctly on desktop, tablet, and mobile devices.
Reference
I will provide a screenshot of the desired layout (similar to Namecheap) and the existing HTML code that is already working.
Deliverables
Fully integrated header within the Martex theme
Top bar and navigation working correctly across all pages
Menu connected to Drupal menu system
Clean and organized code (Twig and CSS)
Clear instructions on how to edit menu items and header content
Timeline
Estimated completion time is 1 to 2 days.
Requirements
The developer must have experience with Drupal 10 or 11, including:
Twig template customization
Drupal blocks and regions
Menu system integration
Important Notes
Do not rebuild the header from scratch.
Do not use page builders.
Do not break theme update compatibility.
Focus on clean and proper integration into the existing system.
Summary
The header is already built. The task is to integrate it properly into the Drupal Martex theme so it functions as a native, maintainable component.