Ultimate Fix Prompt — To Make Your Homepage Fully Aligned & Full Width (Elementor + WoodMart)

✅ Ultimate Fix Prompt — To Make Your Homepage Fully Aligned & Full Width (Elementor + WoodMart)

Copy and apply this as your step-by-step fixing prompt inside Elementor:

🎯 GOAL: Fix full-width issue, center content, and remove theme spacing

1. 👉 Go to Page > Edit with Elementor
2. 🌐 Page Settings (Bottom-left gear icon):

• Page Layout: ❗ Set to “Elementor Full Width”
• Disable Title (if shown)

1. 🔧 Edit the Hero Section (click the six dots at the top of section)

• Layout:
  • Content Width: Full Width
  • Stretch Section: ✅ Yes
• Columns Gap: No Gap or Default
• HTML Tag: section
• Vertical Align: Middle or Center
• Z-index: 1 or auto

1. 🎨 Style Tab:

• Background: Use blue gradient OR background image with overlay
• Overlay: Add dark blue (rgba(0, 38, 84, 0.7)) if text isn’t readable

1. 🧱 Advanced Tab:

• Margin: 0 (Top, Bottom, Left, Right)
• Padding: Top: 120px, Bottom: 120px (adjust for mobile)
• Responsive: Make sure nothing is hidden on any device

1. 🪜 Columns Inside:

• Center the content: Right-click → Edit Column → Layout
  • Horizontal Align: Center
  • Vertical Align: Middle
  • Remove any width % or offsets

1. 💬 Typography:

• Edit heading → Style:
  • Text Color: White
  • Font Size: 58–64px desktop, 38px mobile
  • Weight: 700 (bold)
• Subheading: 20–24px, white, regular weight

1. 🟨 Buttons:

• Use Flexbox → Add buttons in Inner Section or Flex Container
• Set alignment: Center horizontally
• Add button spacing using Margin (Right: 15px)

1. 🛠️ Trust Badges Row:

• Use Icon Boxes or Button Widgets styled as:
  • Border Radius: 50px
  • Background: #0e4daf or semi-transparent white
  • Padding: 10px 24px
  • Icon Left, Text Right
• Center the row using column alignment

1. 📱 Responsive Check:

• Switch to Mobile View → Adjust font sizes & padding
• Make sure buttons are stacked vertically with spacing on mobile
• Trust badges center-aligned

🎯 EXTRA FIX (If Still Not Working):

➡️ Go to: WP Dashboard → Appearance → Customize → Layout / Container / General

• Set Container Width to 100%
• Disable “Boxed Layout” or set layout to “Full Width” globally (if WoodMart allows)

OR

➡️ Add Custom CSS (as last resort):

“`css
body.elementor-page {
max-width: 100% !important;
overflow-x: hidden;
}
.elementor-section {
width: 100% !important;
margin: 0 auto !important;
}

✅ Result You’ll Get:

• Full-width layout without white space borders
• All elements perfectly centered
• Better text readability and balanced design
• Mobile-friendly & responsive layout

Let me know if you’d like me to:

• Review your final design
• Export you a fixed Elementor JSON template
• Guide you in building it block-by-block

You’re almost there — this will polish it up completely!