// ==UserScript== // @name Titan Painting Hero Conversion Optimizer // @description Redesigns hero section for maximum conversions with clean layout, high readability, and clear CTAs // @version 2.0.1 // @match https://*.dtestapp.com/* // ==/UserScript== (function() { 'use strict'; console.log('Titan Painting Hero Conversion Optimizer: Starting...'); function optimizeHero() { console.log('Optimizing hero section...'); // ============================================ // STEP 1: DECLUTTER - Remove/Hide Elements // ============================================ // Hide the Google and Yelp icons container from hero (will move to trust bar below) const iconsContainer = document.querySelector('[data-id="2a61df4"]'); if (iconsContainer) { iconsContainer.style.display = 'none'; console.log('Hidden icons container for decluttering'); } // Hide the second headline (redundant) const secondHeadline = document.querySelector('[data-id="578eb31"]'); if (secondHeadline) { secondHeadline.style.display = 'none'; console.log('Hidden redundant second headline'); } // Hide "Our Services" button (secondary CTA not needed in hero) const servicesButton = document.querySelector('[data-id="a9a0775"]'); if (servicesButton) { servicesButton.style.display = 'none'; console.log('Hidden secondary CTA button'); } // ============================================ // STEP 2: ENHANCE BACKGROUND OVERLAY // ============================================ const heroSection = document.querySelector('[data-id="88c8d8b"]'); const overlay = heroSection?.querySelector('.elementor-background-overlay'); if (overlay) { // Create stronger gradient overlay for better text readability overlay.style.background = 'linear-gradient(135deg, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.5) 50%, rgba(0, 0, 0, 0.3) 100%)'; overlay.style.opacity = '1'; console.log('Enhanced background overlay for readability'); } // ============================================ // STEP 3: OPTIMIZE LEFT COLUMN - CONTENT // ============================================ const leftColumn = document.querySelector('[data-id="bfcc52c"]'); if (leftColumn) { leftColumn.style.paddingRight = '40px'; leftColumn.style.paddingTop = '60px'; leftColumn.style.paddingBottom = '60px'; } // Main Headline - Make it conversion-focused const mainHeadline = document.querySelector('[data-id="616f0aa"] .elementor-heading-title'); if (mainHeadline) { mainHeadline.textContent = 'Transform Your Space With Expert Painting'; mainHeadline.style.fontSize = '52px'; mainHeadline.style.fontWeight = '700'; mainHeadline.style.lineHeight = '1.2'; mainHeadline.style.color = '#ffffff'; mainHeadline.style.textShadow = '2px 2px 4px rgba(0,0,0,0.3)'; mainHeadline.style.marginBottom = '20px'; console.log('Optimized main headline'); } // Supporting line (slogan) const supportingLine = document.querySelector('[data-id="bdb4dd1"] .elementor-heading-title'); if (supportingLine) { supportingLine.textContent = 'From ordinary walls to extraordinary statements, we can bring your vision to life.'; supportingLine.style.fontSize = '20px'; supportingLine.style.fontWeight = '400'; supportingLine.style.lineHeight = '1.5'; supportingLine.style.color = '#ffffff'; supportingLine.style.textShadow = '1px 1px 3px rgba(0,0,0,0.4)'; supportingLine.style.marginBottom = '30px'; supportingLine.style.maxWidth = '90%'; console.log('Optimized supporting line'); } // Optimize bullets - Keep only 3 const bulletList = document.querySelector('[data-id="8ccb76c"]'); if (bulletList) { const bulletItems = bulletList.querySelectorAll('.elementor-icon-list-item'); // Keep only first 3 bullets bulletItems.forEach((item, index) => { if (index >= 3) { item.style.display = 'none'; } else { // Style visible bullets const text = item.querySelector('.elementor-icon-list-text'); if (text) { text.style.fontSize = '18px'; text.style.fontWeight = '500'; text.style.color = '#ffffff'; text.style.textShadow = '1px 1px 2px rgba(0,0,0,0.3)'; } const icon = item.querySelector('i'); if (icon) { icon.style.color = '#FFD700'; icon.style.fontSize = '20px'; } } }); bulletList.style.marginBottom = '35px'; console.log('Optimized bullet list'); } // Primary CTA Button const primaryCTA = document.querySelector('[data-id="c8482a4"]'); if (primaryCTA) { const button = primaryCTA.querySelector('.elementor-button'); if (button) { button.textContent = 'Schedule A Free Estimate'; button.style.backgroundColor = '#FF6B35'; button.style.color = '#ffffff'; button.style.fontSize = '18px'; button.style.fontWeight = '700'; button.style.padding = '18px 40px'; button.style.borderRadius = '8px'; button.style.border = 'none'; button.style.boxShadow = '0 4px 12px rgba(255, 107, 53, 0.4)'; button.style.transition = 'all 0.3s ease'; button.style.cursor = 'pointer'; // Hover effect button.addEventListener('mouseenter', function() { this.style.backgroundColor = '#E55A2B'; this.style.transform = 'translateY(-2px)'; this.style.boxShadow = '0 6px 16px rgba(255, 107, 53, 0.5)'; }); button.addEventListener('mouseleave', function() { this.style.backgroundColor = '#FF6B35'; this.style.transform = 'translateY(0)'; this.style.boxShadow = '0 4px 12px rgba(255, 107, 53, 0.4)'; }); } primaryCTA.style.marginBottom = '25px'; console.log('Optimized primary CTA button'); } // Add phone number below CTA const ctaContainer = document.querySelector('[data-id="11289e4"]'); if (ctaContainer) { // Check if phone already exists let phoneElement = ctaContainer.querySelector('.hero-phone-cta'); if (!phoneElement) { phoneElement = document.createElement('div'); phoneElement.className = 'hero-phone-cta'; phoneElement.innerHTML = ` Call: (630) 555-1234 `; ctaContainer.appendChild(phoneElement); console.log('Added phone number CTA'); } } // ============================================ // STEP 4: OPTIMIZE RIGHT COLUMN - FORM CARD // ============================================ const rightColumn = document.querySelector('[data-id="756f582"]'); if (rightColumn) { rightColumn.style.paddingLeft = '20px'; rightColumn.style.paddingTop = '40px'; rightColumn.style.paddingBottom = '40px'; } // Form Card Container const formWidget = document.querySelector('[data-id="dc543a0"]'); const formContainer = formWidget?.closest('.elementor-widget-wrap'); if (formContainer) { formContainer.style.backgroundColor = '#ffffff'; formContainer.style.borderRadius = '16px'; formContainer.style.padding = '32px'; formContainer.style.boxShadow = '0 10px 40px rgba(0, 0, 0, 0.25)'; console.log('Styled form card container'); } // Form Title const formTitle = document.querySelector('[data-id="30bbfa1"] .elementor-heading-title'); if (formTitle) { formTitle.textContent = 'Get Your Free Estimate'; formTitle.style.fontSize = '32px'; formTitle.style.fontWeight = '700'; formTitle.style.color = '#1a1a1a'; formTitle.style.marginBottom = '8px'; formTitle.style.textAlign = 'center'; console.log('Optimized form title'); } // Add subtitle to form const formTitleWidget = document.querySelector('[data-id="30bbfa1"]'); if (formTitleWidget) { let subtitle = formTitleWidget.querySelector('.form-subtitle'); if (!subtitle) { subtitle = document.createElement('p'); subtitle.className = 'form-subtitle'; subtitle.textContent = 'Fast response. No pressure.'; subtitle.style.fontSize = '16px'; subtitle.style.fontWeight = '400'; subtitle.style.color = '#666666'; subtitle.style.textAlign = 'center'; subtitle.style.marginTop = '0'; subtitle.style.marginBottom = '24px'; formTitleWidget.querySelector('.elementor-widget-container').appendChild(subtitle); console.log('Added form subtitle'); } } // Form Fields Styling const form = document.querySelector('[data-id="dc543a0"] form'); if (form) { // Style all labels const labels = form.querySelectorAll('.elementor-field-label'); labels.forEach(label => { label.style.fontSize = '14px'; label.style.fontWeight = '600'; label.style.color = '#333333'; label.style.marginBottom = '8px'; }); // Style all input fields const inputs = form.querySelectorAll('input, select, textarea'); inputs.forEach(input => { input.style.backgroundColor = '#f8f9fa'; input.style.border = '2px solid #e0e0e0'; input.style.borderRadius = '8px'; input.style.padding = '14px 16px'; input.style.fontSize = '15px'; input.style.color = '#1a1a1a'; input.style.transition = 'all 0.3s ease'; // Focus state input.addEventListener('focus', function() { this.style.backgroundColor = '#ffffff'; this.style.borderColor = '#FF6B35'; this.style.outline = 'none'; this.style.boxShadow = '0 0 0 3px rgba(255, 107, 53, 0.1)'; }); input.addEventListener('blur', function() { this.style.backgroundColor = '#f8f9fa'; this.style.borderColor = '#e0e0e0'; this.style.boxShadow = 'none'; }); }); // Style submit button const submitButton = form.querySelector('button[type="submit"]'); if (submitButton) { submitButton.textContent = 'Get My Free Estimate'; submitButton.style.backgroundColor = '#FF6B35'; submitButton.style.color = '#ffffff'; submitButton.style.fontSize = '18px'; submitButton.style.fontWeight = '700'; submitButton.style.padding = '16px 32px'; submitButton.style.borderRadius = '8px'; submitButton.style.border = 'none'; submitButton.style.width = '100%'; submitButton.style.cursor = 'pointer'; submitButton.style.transition = 'all 0.3s ease'; submitButton.style.boxShadow = '0 4px 12px rgba(255, 107, 53, 0.3)'; submitButton.addEventListener('mouseenter', function() { this.style.backgroundColor = '#E55A2B'; this.style.transform = 'translateY(-2px)'; this.style.boxShadow = '0 6px 16px rgba(255, 107, 53, 0.4)'; }); submitButton.addEventListener('mouseleave', function() { this.style.backgroundColor = '#FF6B35'; this.style.transform = 'translateY(0)'; this.style.boxShadow = '0 4px 12px rgba(255, 107, 53, 0.3)'; }); } console.log('Optimized form fields and submit button'); } // ============================================ // STEP 5: CREATE TRUST BAR BELOW HERO // ============================================ // Check if trust bar already exists let trustBar = document.querySelector('.hero-trust-bar'); if (!trustBar && heroSection) { trustBar = document.createElement('div'); trustBar.className = 'hero-trust-bar'; trustBar.style.cssText = ` background: #f8f9fa; padding: 20px 0; border-top: 1px solid #e0e0e0; margin-top: 0; `; trustBar.innerHTML = `

5.0 Rating

Top Rated

35+ Years Experience

`; // Insert trust bar after hero section heroSection.parentNode.insertBefore(trustBar, heroSection.nextSibling); console.log('Created trust bar below hero'); } // ============================================ // STEP 6: MOBILE RESPONSIVENESS // ============================================ const style = document.createElement('style'); style.textContent = ` @media (max-width: 768px) { [data-id="bfcc52c"] { padding: 40px 20px !important; } [data-id="756f582"] { padding: 20px !important; } [data-id="616f0aa"] .elementor-heading-title { font-size: 36px !important; } [data-id="bdb4dd1"] .elementor-heading-title { font-size: 18px !important; } [data-id="8ccb76c"] .elementor-icon-list-text { font-size: 16px !important; } .hero-phone-cta a { font-size: 18px !important; } [data-id="30bbfa1"] .elementor-heading-title { font-size: 26px !important; } .hero-trust-bar > div { gap: 20px !important; } .hero-trust-bar img { height: 32px !important; } .hero-trust-bar span { font-size: 14px !important; } } @media (max-width: 480px) { [data-id="616f0aa"] .elementor-heading-title { font-size: 28px !important; } [data-id="bdb4dd1"] .elementor-heading-title { font-size: 16px !important; } [data-id="30bbfa1"] .elementor-heading-title { font-size: 24px !important; } } `; document.head.appendChild(style); console.log('Added mobile responsive styles'); console.log('✅ Hero optimization complete!'); } // Run optimization function init() { if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', optimizeHero); } else { optimizeHero(); } // Re-run on dynamic content changes const observer = new MutationObserver(function() { const heroSection = document.querySelector('[data-id="88c8d8b"]'); if (heroSection && !heroSection.classList.contains('hero-optimized')) { heroSection.classList.add('hero-optimized'); optimizeHero(); } }); if (document.body) { observer.observe(document.body, { childList: true, subtree: true }); } } init(); })();

Titan Painting Hero Conversion Optimizer

About