Avada

Avada Theme Configuration

Theme Type

Classic theme (NOT Full Site Editing). Configuration is split between three storage mechanisms:

1. Theme options (fusion_options in wp_options): All visual styling — colors, typography, header, footer, layout, blog, portfolio, search, social media, WooCommerce, lightbox, forms, performance, privacy, maintenance, and more. Read/write via mcm/get-theme-options and mcm/set-theme-options.
2. Theme mods (theme_mods_Avada in wp_options): custom_logo (attachment ID), navigation menu locations. Read/write via mcm/get-theme-mod and mcm/set-theme-mod.
3. Page-level overrides (post meta): Per-page settings with pyre_ prefix. Read/write via mcm/update-content.

Does NOT use Global Styles or theme.json.

When to use

• The user wants to change colors, fonts, header, footer, or layout of Avada
• The user wants to configure blog, portfolio, search, or social media settings
• The user wants to set up WooCommerce shop styling
• The user wants to adjust page title bar, breadcrumbs, or sliding bar
• The user wants to configure sidebars and widget areas
• The user wants to set up logo, favicons, and branding
• The user wants to configure lightbox, forms, or privacy settings
• The user wants to adjust responsive breakpoints or performance settings
• The user wants to set up maintenance mode or custom auth pages
• The user wants to set up the site identity
• The user wants to inject custom CSS or tracking code
• The user wants to configure page-level overrides

Inputs required

• What aspect to configure (specific area, or "all" for full setup)
• The desired values (specific colors, font choices, sizes, etc.)

5-Phase Configuration Flow

When configuring Avada, guide the user through progressive phases. Each phase groups related options. Always explain what each option controls so the user can make informed decisions. Use the three-tier system:

• Essential (~35 options): Always ask — site identity, logo, primary colors, header layout, footer basics, body font
• Recommended (~120 options): Ask during full setup — all color details, typography, blog, WooCommerce, responsive, page title bar, sidebars, social media
• Advanced (~300 options): Only ask when the user requests fine-tuning — breadcrumb colors, sliding bar, search settings, portfolio archive details, lightbox, forms, performance, code injection, post type toggles, maintenance, privacy bar, elastic slider

Phase 1: FOUNDATION (Always run this phase)

1.1 Site Identity

Ask the user:

"Let's set up the basics. What is the site name and tagline for your website? Also, do you have a static homepage and a blog page already created? If so, I'll set them as your front page and posts page."

mcm/set-option {"name": "blogname", "value": "Site Name"}
mcm/set-option {"name": "blogdescription", "value": "Site Tagline"}
mcm/set-option {"name": "show_on_front", "value": "page"}
mcm/set-option {"name": "page_on_front", "value": <homepage_id>}
mcm/set-option {"name": "page_for_posts", "value": <blog_page_id>}

1.2 Logo (CRITICAL — TWO places)

Ask the user:

"Do you have a logo ready? I'll need the image URL. Avada uses logos in multiple places — main logo, retina (high-resolution) version, mobile logo, and sticky header logo. At minimum I need the main logo. Do you also have retina and mobile versions?"

Avada stores logos as URLs in fusion_options AND as attachment ID in custom_logo theme mod. Always set BOTH:

// Step 1: Upload
mcm/upload-media {"url": "https://example.com/logo.png", "title": "Site Logo"}
// → Returns: attachment_id and url

// Step 2: Set in Avada options (URL format)
mcm/set-theme-options {"values": {"logo": {"url": "<uploaded_url>"}}}

// Step 3: Set WordPress theme mod (attachment ID)
mcm/set-theme-mod {"key": "custom_logo", "value": <attachment_id>}

// Step 4: Set retina/mobile/sticky if provided
mcm/set-theme-options {"values": {
  "logo_retina": {"url": "<retina_url>"},
  "mobile_logo": {"url": "<mobile_url>"},
  "sticky_header_logo": {"url": "<sticky_url>"}
}}

1.3 Favicon

Ask the user:

"Do you have a favicon (the small icon that appears in browser tabs)? I need a square image, ideally 512x512 pixels."

mcm/upload-media {"url": "https://example.com/favicon.png", "title": "Favicon"}
mcm/set-theme-options {"values": {"fav_icon": {"url": "<uploaded_url>"}}}
mcm/set-option {"name": "site_icon", "value": <attachment_id>}

1.4 Color Palette

Ask the user:

"Now let's define your color palette. Avada uses 8 global colors that are referenced across the entire site:

1. Color 1 — Light/white color (used for backgrounds, light text)
2. Color 2 — Secondary light color (subtle backgrounds, alternate areas)
3. Color 3 — Light gray (borders, dividers, subtle backgrounds)
4. Color 4 — Medium/accent color (highlights, active states, accents)
5. Color 5 — Primary accent (main brand color, buttons, links on hover)
6. Color 6 — Dark accent (secondary dark elements)
7. Color 7 — Dark background (footer background, dark sections)
8. Color 8 — Dark text (body text, headings)

What are your brand colors? At minimum I need your primary brand color (Color 5) and your dark text color (Color 8). I can suggest sensible defaults for the rest."

Read the current palette first:

mcm/get-theme-options {"keys": ["color_palette"]}

Then set individual colors:

mcm/set-theme-options {"values": {
  "primary_color": "#E94560",
  "bg_color": "#FFFFFF",
  "content_bg_color": "#FFFFFF",
  "header_bg_color": "#FFFFFF",
  "footer_bg_color": "#1B1B1B"
}}

1.5 Typography

Ask the user:

"What fonts would you like to use? Avada supports Google Fonts, Adobe Fonts, and custom uploads. I need:

• Body font — The main text font used for paragraphs and general content (e.g., Open Sans, Roboto, Lato)
• Heading font — Used for all headings H1-H6 (e.g., Montserrat, Playfair Display, Poppins)

What size should the body text be? (Default is 16px, which is recommended for readability.) Do you also want specific link colors?"

Typography fields MUST be arrays with ALL properties:

mcm/set-theme-options {"values": {
  "body_typography": {
    "font-family": "Open Sans",
    "font-size": "16px",
    "font-weight": "400",
    "line-height": "1.6",
    "letter-spacing": "0",
    "font-style": "normal",
    "text-transform": "none",
    "color": "#333333"
  },
  "h1_typography": {
    "font-family": "Montserrat",
    "font-size": "48px",
    "font-weight": "700",
    "line-height": "1.2",
    "letter-spacing": "0",
    "font-style": "normal",
    "text-transform": "none",
    "color": "#252525"
  },
  "link_color": "#333333",
  "link_hover_color": "#E94560"
}}

To set all headings H2-H6, repeat the typography array structure for h2_typography through h6_typography.

1.6 Layout

Ask the user:

"What layout style do you prefer?

• Wide (default) — Content stretches to the full browser width with a maximum width
• Boxed — Content is centered in a box with visible margins on the sides

What should the maximum site width be? (Default is 1200px. Common values: 1100px, 1200px, 1400px.)"

mcm/set-theme-options {"values": {
  "layout": "wide",
  "site_width": "1200px",
  "main_padding": {"top": "60px", "bottom": "60px"}
}}

Phase 2: STRUCTURAL (Ask before proceeding)

"The foundation is set. Would you like to configure the header, page structure, footer, sidebars, and sliding bar? These control the overall structure and appearance of your site."

2.1 Header

Ask the user:

"Avada offers 7 header layout versions:

• v1 — Logo on the left, navigation on the right (most common)
• v2 — Logo on the left, navigation and search on the right
• v3 — Logo centered between navigation items
• v4 — Logo on the left with search bar and tagline on the right
• v5 — Logo centered above the navigation menu
• v6 — Logo on the left, navigation in a bar below
• v7 — Top bar above the header with a full-width menu

Which layout would you prefer? Also:

• Should the header be at the top, left side, or right side of the page?
• Do you want a sticky header that stays visible when scrolling?
• Should the sticky header shrink when you scroll down?
• Do you want contact info (phone/email) displayed in the header?"

mcm/set-theme-options {"values": {
  "header_position": "top",
  "header_layout": "v1",
  "header_bg_color": "#FFFFFF",
  "header_border_color": "transparent",
  "header_shadow": "0",
  "header_100_width": "0",
  "header_sticky": "1",
  "header_sticky_shrinkage": "1",
  "header_sticky_bg_color": "#FFFFFF",
  "header_sticky_shadow": "1",
  "header_number": "",
  "header_email": ""
}}

2.2 Menu / Navigation

Ask the user:

"For the navigation menu:

• What height should the menu bar be? (Default: 94px. Smaller values make the header more compact.)
• What highlight style do you want for the active menu item?
  • Bar — A colored bar appears above/below the active item
  • Arrow — An arrow indicator points to the active item
  • Background — The active item gets a colored background
• Do you want a search icon in the menu? (Default: no)
• Dropdown menus: What width should dropdown sub-menus be? (Default: 200px) Should dropdown items show a small arrow indicator?
• Mega menu: If you have mega menus, what max width should they use? (Default: site width)
• Mobile menu: What design on mobile?
  • Modern — Slide-in panel with smooth animation (default)
  • Classic — Collapsible accordion below the header
  • Flyout — Full-screen overlay with large menu items
• What color should the mobile hamburger icon be?"

mcm/set-theme-options {"values": {
  "nav_height": "84",
  "menu_highlight_style": "bar",
  "nav_padding": "48",
  "main_nav_search_icon": "0",
  "menu_display_dropdown_indicator": "1",
  "dropdown_menu_width": "200px",
  "mobile_menu_design": "modern",
  "mobile_menu_toggle_color": "var(--awb-color8)"
}}

2.3 Page Title Bar

Ask the user:

"The page title bar appears at the top of each page, below the header. It typically shows the page title and optionally breadcrumbs or a search box. Options:

• Display mode: Show the title bar with content, content only (no background bar), or hide completely
• Below the title: Nothing, breadcrumbs navigation, or a search box
• Background: Color, image (with optional parallax), or a fading effect on scroll
• Alignment: Left, center, or right

Would you like to enable the page title bar? What style do you prefer?"

mcm/set-theme-options {"values": {
  "page_title_bar": "bar_and_content",
  "page_title_bar_bs": "breadcrumbs",
  "page_title_bg_color": "#F5F5F5",
  "page_title_color": "#333333",
  "page_title_font_size": "36px",
  "page_title_alignment": "left"
}}

2.4 Breadcrumbs

If breadcrumbs are enabled in the page title bar:

"For the breadcrumbs (the navigation path like Home > Blog > Post Name):

• Do you want a prefix text before the breadcrumbs? (e.g., 'You are here:')
• What separator between items? (Default: /)
• Should breadcrumbs show on mobile devices?
• Show the current page name at the end?
• Show post categories in the path?"

mcm/set-theme-options {"values": {
  "breadcrumb_mobile": "0",
  "breacrumb_prefix": "",
  "breadcrumb_separator": "/",
  "breadcrumbs_font_size": "14px",
  "breadcrumbs_text_color": "var(--awb-color8)",
  "breadcrumb_show_categories": "1",
  "breadcrumb_show_leaf": "1"
}}

2.5 Footer

Ask the user:

"For the footer area:

• Do you want footer widgets? (Columns of content like contact info, recent posts, links)
• How many columns? (1-6, default: 4)
• Do you want a copyright bar at the very bottom?
• What should the copyright text say?
• What background color for the footer?
• Any special effects? (Parallax scrolling, sticky footer, etc.)"

mcm/set-theme-options {"values": {
  "footer_widgets": "1",
  "footer_widgets_columns": "4",
  "footer_bg_color": "#1B1B1B",
  "footer_copyright": "1",
  "footer_text": "Copyright 2026 Your Company. All rights reserved.",
  "footer_text_color": "#AAAAAA",
  "footer_link_color": "#CCCCCC",
  "copyright_bg_color": "#111111",
  "copyright_font_size": "13px"
}}

2.6 Sidebars

Ask the user:

"Do you want sidebars on any pages? Avada lets you assign sidebars per content type:

• Pages — Standard WordPress pages
• Blog posts — Individual blog post pages
• Blog archive — Blog listing pages
• Portfolio — Portfolio items (if using portfolio)
• Search results — Search results page
• WooCommerce — Shop and product pages (if using WooCommerce)

For each, you can choose: no sidebar, left sidebar, right sidebar, or dual sidebars. Which pages should have sidebars?"

mcm/set-theme-options {"values": {
  "pages_sidebar": "None",
  "posts_sidebar": "Blog Sidebar",
  "blog_sidebar_position": "right",
  "blog_archive_sidebar": "Blog Sidebar",
  "blog_archive_sidebar_position": "right",
  "sidebar_bg_color": "transparent",
  "sidebar_heading_color": "var(--awb-color8)"
}}

2.7 Sliding Bar (Optional)

Ask the user:

"Do you want a sliding bar? This is a hidden panel that visitors can toggle open, usually from the top or side of the page. It's useful for extra content like contact info, widgets, or promotions. It can slide from the top, right, bottom, or left side.

Would you like to enable the sliding bar?"

If yes:

mcm/set-theme-options {"values": {
  "slidingbar_widgets": "1",
  "slidingbar_position": "top",
  "slidingbar_widgets_columns": "3",
  "slidingbar_toggle_style": "triangle",
  "slidingbar_bg_color": "#333333",
  "slidingbar_text_color": "#CCCCCC"
}}

Phase 3: CONTENT (Ask before proceeding)

"Now let's configure how your content is displayed — blog posts, portfolio projects, search results, and social sharing."

3.1 Blog

Ask the user:

"For the blog:

• What layout do you prefer?
  • Large — Full-width posts with large featured images
  • Medium — Image on the left, excerpt on the right
  • Grid — Posts in a grid/card layout
  • Masonry — Pinterest-style grid with varying heights
  • Timeline — Posts arranged on a timeline
  • Large/Medium Alternate — Alternating between large and medium layouts
• How many columns for grid layout? (Default: 3)
• Pagination style: Standard numbered pages, infinite scroll, or a 'Load More' button?
• What post meta to show? (Author, date, categories, comments count, tags, read more link)
• Show a social sharing box on each post?
• Show related posts at the bottom of each post?
• Show the author info box?"

mcm/set-theme-options {"values": {
  "blog_layout": "grid",
  "blog_archive_layout": "grid",
  "blog_archive_grid_columns": "3",
  "blog_pagination_type": "pagination",
  "content_length": "excerpt",
  "excerpt_length_blog": "20",
  "featured_images": "1",
  "social_sharing_box": "1",
  "author_info": "1",
  "related_posts": "1",
  "blog_comments": "1",
  "post_meta": "1",
  "post_meta_author": "1",
  "post_meta_date": "1",
  "post_meta_cats": "1",
  "post_meta_comments": "1",
  "post_meta_tags": "0"
}}

3.2 Portfolio (if portfolio post type is enabled)

Ask the user:

"For the portfolio:

• What archive layout? (1-6 columns)
• Text display: Show title on rollover, title below image, or no text?
• Show pagination, infinite scroll, or load more?
• For single portfolio items: Show project details, author info, social sharing, related projects, comments?
• What should the URL slug be? (Default: 'portfolio-items')"

mcm/set-theme-options {"values": {
  "portfolio_archive_layout": "portfolio-three",
  "portfolio_archive_columns": "3",
  "portfolio_archive_items": "12",
  "portfolio_archive_pagination_type": "pagination",
  "portfolio_archive_title_display": "all",
  "portfolio_pn_nav": "1",
  "portfolio_social_sharing_box": "1",
  "portfolio_related_posts": "1",
  "portfolio_slug": "portfolio-items"
}}

3.3 Search

Ask the user:

"For the search functionality:

• Should search results include all content types or specific ones only?
• Enable live search (results appear as you type)?
• What layout for the search results page? (Large, Medium, Grid, Masonry, Timeline)
• How many results per page?"

mcm/set-theme-options {"values": {
  "search_layout": "grid",
  "search_results_per_page": "12",
  "search_grid_columns": "3",
  "live_search": "1",
  "live_search_min_char_count": "3",
  "search_featured_images": "1"
}}

3.4 Social Media

Ask the user:

"Do you have social media profiles to display? Avada can show social icons in the header, footer, and on individual posts. Which networks do you use? (Facebook, Twitter/X, Instagram, LinkedIn, YouTube, Pinterest, TikTok, etc.)

For each network, I'll need the URL to your profile page."

Social icons use a repeater field:

mcm/set-theme-options {"values": {
  "social_media_icons": [
    {"icon": "facebook", "url": "https://facebook.com/yourpage"},
    {"icon": "twitter", "url": "https://twitter.com/yourhandle"},
    {"icon": "instagram", "url": "https://instagram.com/yourhandle"},
    {"icon": "linkedin", "url": "https://linkedin.com/in/yourprofile"}
  ],
  "icons_footer": "1",
  "header_social_links_font_size": "16px",
  "footer_social_links_font_size": "16px"
}}

Social sharing box on posts:

mcm/set-theme-options {"values": {
  "sharing_social_tagline": "Share This Story, Choose Your Platform!",
  "social_bg_color": "#F5F5F5"
}}

Phase 4: INTEGRATIONS (Conditional — ask only if plugins are active)

4.1 WooCommerce (if WooCommerce is active)

Ask the user:

"I see WooCommerce is active. Let me configure the shop:

• How many products per page? (Default: 12)
• How many columns on the shop page? (Default: 4)
• Product image layout: Avada's custom layout or WooCommerce default?
• Enable image zoom on hover?
• Enable quick view popup on products?
• Show variation swatches on the shop page?
• Show a cart icon in the navigation menu?"

mcm/set-theme-options {"values": {
  "woo_items": "12",
  "woocommerce_shop_page_columns": "4",
  "woocommerce_related_columns": "4",
  "woocommerce_product_images_layout": "avada",
  "woocommerce_product_images_zoom": "1",
  "woocommerce_enable_quick_view": "0",
  "woocommerce_variations": "1",
  "woocommerce_cart_link_main_nav": "1",
  "woocommerce_cart_counter": "1"
}}

4.2 Events Calendar (if The Events Calendar is active)

Ask the user:

"I see The Events Calendar is active. Would you like to customize the events styling?

• Filter bar colors (background and text)
• Calendar colors (heading, day cells, borders)
• Single event layout (meta data in sidebar or below content?)
• Show social sharing on events?"

mcm/set-theme-options {"values": {
  "ec_bar_bg_color": "var(--awb-color2)",
  "ec_bar_text_color": "var(--awb-color8)",
  "ec_border_color": "var(--awb-color3)",
  "ec_tooltip_bg_color": "var(--awb-color1)",
  "ec_meta_layout": "sidebar",
  "events_social_sharing_box": "1"
}}

4.3 bbPress (if bbPress is active)

Ask the user:

"I see bbPress is active. Would you like to customize the forum styling?

• Base font size for forum text (Default: 12px)
• Header background and font color for forum section headers
• Border color for forum borders"

mcm/set-theme-options {"values": {
  "bbp_forum_base_font_size": "14px",
  "bbp_forum_header_bg": "#ebeaea",
  "bbp_forum_header_font_color": "#747474",
  "bbp_forum_border_color": "#ebeaea"
}}

Phase 5: ADVANCED (Ask before proceeding)

"Everything is looking great. Do you want to fine-tune any advanced settings? These include performance optimization, lightbox, forms, maintenance mode, privacy/cookie consent, scroll-to-top button, image rollover effects, custom CSS, and more."

5.1 Lightbox

"The lightbox is the popup that appears when clicking on images. Options:

• Skin: Light, dark, metro-white (clean), metro-black, mac, parade, or smooth
• Thumbnails: Show a strip of thumbnails below the lightbox (vertical or horizontal)
• Navigation: Show arrows, enable looping
• Autoplay: Auto-advance through galleries
• Social: Show share buttons in the lightbox"

mcm/set-theme-options {"values": {
  "status_lightbox": "1",
  "lightbox_skin": "metro-white",
  "lightbox_path": "horizontal",
  "lightbox_arrows": "1",
  "lightbox_gallery": "1",
  "lightbox_social": "1",
  "lightbox_title": "1"
}}

5.2 Forms Styling

"For form inputs across the site:

• Input height: Height of text inputs (Default: 33px)
• Border: Width, color, radius
• Focus color: Border color when clicking into a field
• Background/text colors

Do you also use reCAPTCHA or Cloudflare Turnstile for spam protection? I'll need your API keys."

mcm/set-theme-options {"values": {
  "form_input_height": "40px",
  "form_text_size": "14px",
  "form_border_width": "1",
  "form_border_color": "var(--awb-color3)",
  "form_focus_border_color": "var(--awb-color4)",
  "form_border_radius": "4"
}}

5.3 Performance

"Performance settings can significantly affect page load speed:

• Lazy loading: Load images/iframes only when they scroll into view (Avada method, WordPress native, or off)
• Font loading: Block (clean render, slower) or Swap (faster, may flash)
• Disable emojis script: If you don't use emojis, saves a request
• CSS compiling: File (recommended), database, or disabled
• JS compiler: Combine JavaScript files (recommended: on)
• Image format: Convert uploads to WebP or AVIF for smaller files
• JPEG quality: 1-100 (default: 82)

Would you like to optimize these settings?"

mcm/set-theme-options {"values": {
  "lazy_load": "avada",
  "lazy_load_iframes": "avada",
  "font_face_display": "swap",
  "emojis_disabled": "disabled",
  "css_cache_method": "file",
  "js_compiler": "1",
  "upload_image_format": "webp",
  "pw_jpeg_quality": "82"
}}

5.4 Privacy / Cookie Consent

"Do you need a privacy/cookie consent bar? This is important for GDPR compliance. Options:

• Google Fonts mode: 'Local' downloads fonts to your server (GDPR-friendly) or 'CDN' uses Google's servers
• Privacy bar: A bar at the bottom asking visitors for cookie/embed consent
• Bar text, button text, colors, and styling"

mcm/set-theme-options {"values": {
  "gfonts_load_method": "local",
  "privacy_embeds": "1",
  "privacy_expiry": "30",
  "privacy_bar": "1",
  "privacy_bar_text": "This website uses cookies and third party services.",
  "privacy_bar_button_text": "Accept",
  "privacy_bar_bg_color": "var(--awb-color8)",
  "privacy_bar_color": "var(--awb-color1)"
}}

5.5 Maintenance Mode

"Do you want to enable maintenance mode? This shows a maintenance page or coming-soon page to all visitors except admins.

• Maintenance mode returns a 503 status (site is down for maintenance)
• Coming Soon mode returns a 200 status (site is launching soon)
• You can select any published page as the template"

mcm/set-theme-options {"values": {
  "maintenance_mode": "maintenance",
  "maintenance_template": "<page_id>",
  "maintenance_page_title": "Under Maintenance",
  "maintenance_robots_meta": "noindex"
}}

5.6 Extra Settings

"Additional settings you may want to configure:

• Scroll to top button: Show a button to scroll back to the top (position, colors, border radius)
• Image rollover: The hover effect on images in grids (direction, icons, gradient colors)
• Related posts: Layout, number of items, columns, carousel behavior
• Pagination: Sizing, font size, border radius
• Custom scrollbar: Enable a styled scrollbar (colors)
• Avatar shape: Square or round for user avatars"

mcm/set-theme-options {"values": {
  "status_totop": "1",
  "totop_position": "right",
  "totop_background": "var(--awb-color4)",
  "image_rollover": "1",
  "related_posts_layout": "title_on_rollover",
  "number_related_posts": "4",
  "related_posts_columns": "4",
  "custom_scrollbar": "1"
}}

5.7 Advanced Features / APIs

"Advanced theme features:

• Font Awesome: Which subsets to load (brands, regular, solid, light)
• YouTube/Vimeo/Google Maps: Enable or disable these scripts
• Open Graph: Enable/disable Open Graph meta tags for social sharing
• Rich snippets: Enable/disable structured data for title, author, date, FAQ
• Post types: Enable/disable Avada Slider, Elastic Slider, Forms, Off Canvas, Portfolio, FAQs"

mcm/set-theme-options {"values": {
  "status_fontawesome": ["fab", "far", "fas"],
  "status_opengraph": "1",
  "status_fusion_portfolio": "1",
  "status_fusion_faqs": "1"
}}

5.8 Code Injection

"Do you have any tracking codes or custom scripts to add?

• Analytics/Tag Manager code
• Code before </head>
• Code after <body>
• Code before </body>"

mcm/set-theme-options {"values": {
  "google_analytics": "<tracking_code>",
  "space_head": "",
  "space_body_open": "",
  "space_body": ""
}}

5.9 Custom CSS

mcm/set-theme-options {"values": {
  "custom_css": "/* Your custom CSS here */"
}}

5.10 Custom Auth Pages

"Would you like to use custom login, registration, and password reset pages instead of the default WordPress ones? You'll need to create pages with Avada Forms first."

mcm/set-theme-options {"values": {
  "auth_pages_login_page": "<page_id>",
  "auth_pages_registration_page": "<page_id>",
  "auth_pages_custom_redirect": "auth_pages"
}}

5.11 Slideshows & Elastic Slider

"Configure the slideshow behavior for blog/portfolio featured image slideshows:

• Autoplay, speed, smooth height

And the Elastic Slider (if enabled):

• Dimensions, animation type (sides or center), autoplay, speed"

mcm/set-theme-options {"values": {
  "slideshow_autoplay": "1",
  "slideshow_speed": "7000",
  "tfes_dimensions": {"width": "100%", "height": "400px"},
  "tfes_animation": "sides",
  "tfes_autoplay": "1"
}}

5.12 Contact Template

Only relevant if using the Contact page template:

"If you're using the Contact page template: What email address should the form submissions go to? Do you want a Google Map on the page? If so, I'll need a Google Maps API key."

mcm/set-theme-options {"values": {
  "email_address": "contact@example.com",
  "gmap_api": "<api_key>",
  "gmap_address": "Your Address",
  "map_zoom_level": "14"
}}

5.13 Responsive

"Responsive settings control how the site adapts to different screen sizes:

• Main breakpoint: Below this width, the site switches to mobile layout (Default: 1000px)
• Side header breakpoint: When side headers switch to top (Default: 800px)
• Content/Sidebar breakpoints: When sidebars stack below content (Default: 800px)
• Mobile zoom: Allow pinch-to-zoom on mobile? (Default: yes)
• Responsive typography: Automatically scale font sizes on smaller screens? (Sensitivity 0 = off, higher = more scaling)

The defaults work well for most sites. Would you like to adjust any breakpoints?"

mcm/set-theme-options {"values": {
  "responsive": "1",
  "grid_main_break_point": "1000",
  "side_header_break_point": "800",
  "content_break_point": "800",
  "sidebar_break_point": "800",
  "mobile_zoom": "1",
  "typography_sensitivity": "0",
  "typography_factor": "1.5"
}}

5.14 Background

"Would you like to set a background image or pattern for the body or content area? This is most visible in boxed layout mode where the body background shows on the sides."

mcm/set-theme-options {"values": {
  "bg_image": {"url": ""},
  "bg_full": "0",
  "bg_repeat": "repeat",
  "bg_pattern_option": "0",
  "content_bg_image": {"url": ""},
  "content_bg_full": "0",
  "content_bg_repeat": "repeat"
}}

5.15 Page-Level Overrides

"Avada allows per-page overrides for many settings. For example, you can hide the header on a specific landing page, change the page title bar color, or set a different sidebar. These use post meta with the pyre_ prefix."

mcm/update-content {"id": <page_id>, "meta": {
  "pyre_display_header": "no",
  "pyre_display_footer": "no",
  "pyre_page_title_bar": "hide"
}}

Procedure (Quick Reference)

0) Verify the active theme

Call mcm/theme-config-guide — auto-detects the active theme and confirms it is Avada (classic theme).

1) Read current configuration

mcm/get-theme-options {}
mcm/get-theme-options {"keys": ["primary_color", "header_layout", "layout"]}
mcm/get-theme-mod {}

2) Apply changes

Use mcm/set-theme-options, mcm/set-theme-mod, mcm/set-option, and mcm/update-content as shown in each phase above.

3) Cache clearing

The mcm/set-theme-options ability automatically clears Avada's dynamic CSS cache after updating. No manual cache clearing is needed.

Important: Avada Color System

Avada 7.x+ uses a Global Color Palette (AWB Colors). Individual color options reference palette variables var(--awb-color1) through var(--awb-color8):

Important: Avada Typography Format

Typography fields MUST be arrays with ALL properties:

{
  "font-family": "Arial, sans-serif",
  "font-size": "16px",
  "font-weight": "400",
  "line-height": "1.6",
  "letter-spacing": "0",
  "font-style": "normal",
  "text-transform": "none",
  "color": "#333333"
}

Important: Avada Logo System

Both logo in fusion_options AND custom_logo theme mod must be set for maximum compatibility.

Minimum Configuration Checklist

When setting up Avada from scratch, at minimum set ALL of these:

Required (theme mods via mcm/set-theme-mod):

• custom_logo — Site logo (attachment ID)

Required (WP options via mcm/set-option):

• blogname — Site name
• blogdescription — Tagline
• site_icon — Favicon (attachment ID)
• show_on_front — page for static homepage
• page_on_front — Homepage page ID
• page_for_posts — Blog page ID

Required (theme options via mcm/set-theme-options):

• logo — Main logo ({"url": "..."})
• primary_color — Primary accent color
• bg_color — Body background
• content_bg_color — Content area background
• header_layout — Header layout (v1-v7)
• header_bg_color — Header background
• body_typography — Body font (array)
• h1_typography — H1 heading (array)
• footer_widgets — Enable footer widgets (1)
• footer_widgets_columns — Footer columns
• footer_bg_color — Footer background
• footer_copyright — Enable copyright (1)
• footer_text — Copyright text

Recommended:

• logo_retina — Retina logo
• mobile_logo — Mobile logo
• fav_icon — Favicon ({"url": "..."})
• layout — Site layout (wide or boxed)
• site_width — Site width (e.g., 1200px)
• link_color / link_hover_color — Link colors
• nav_height — Navigation height
• page_title_bar — Page title bar display mode
• gfonts_load_method — local for GDPR compliance

Verification Checklist

After configuring, verify each area:

• Logo displays in the header (desktop, mobile, and sticky)
• Colors display correctly on the frontend
• Header layout and styling are correct
• Page title bar and breadcrumbs display correctly
• Footer widgets and copyright display correctly
• Typography (body, headings) renders correctly
• Blog layout and meta display settings work
• Portfolio archive/single display correctly (if applicable)
• Search results page renders correctly
• Social media icons display in header and footer
• WooCommerce shop page and products display correctly (if applicable)
• Sidebars appear on the correct pages
• Responsive breakpoints trigger correctly
• Lightbox opens correctly when clicking images
• Privacy bar appears if enabled
• Dynamic CSS has been regenerated (automatic)

Failure Modes / Debugging

• Logo not showing: Check BOTH logo in fusion_options (URL format {"url": "..."}) AND custom_logo theme mod (attachment ID). Both must be set.
• Changes not visible: The MCP ability auto-clears Avada's compiled CSS cache. Clear browser cache if needed.
• Option not saving: mcm/set-theme-options reads the full array and merges only specified keys — never replaces the entire array.
• Page-level override not working: Page meta keys use pyre_ prefix (e.g., pyre_header_bg_color).
• Multilingual sites: Option key may be language-suffixed (e.g., fusion_options_es).
• Color variables: Avada 7.x uses var(--awb-colorN) references — set actual hex values or update the global palette.
• Typography not applying: Must be an array with ALL properties (font-family, font-size, font-weight, line-height, letter-spacing, font-style, text-transform, color). A simple string like "16px" will NOT work.
• Social icons not showing: Check that social_media_icons is a properly formatted repeater array with icon and url fields.
• Sidebar not appearing: Verify the sidebar name exists (check via mcm/get-theme-options {"keys": ["pages_sidebar"]}) and position is set correctly.
• Breadcrumbs overridden: If Yoast SEO or RankMath is active, their breadcrumbs override Avada's.
• Portfolio/FAQ slugs changed: After changing portfolio_slug or faq_slug, flush permalinks.

Reference files

• theme-options.md — Complete list of all 600+ option IDs with types, defaults, descriptions, and valid choices
• ../global-styles-api.md — Shared reference (see Section 0 for Classic vs FSE differences)