Варианты дизайна виджета

Тема: default

Код для вставки:

https://mm-v3.vercel.app/widget?theme=default

HTML код:

<iframe 
  src="https://mm-v3.vercel.app/widget?theme=default" 
  width="100%" 
  height="200" 
  frameborder="0"
  scrolling="no"
></iframe>

Тема: blue

Код для вставки:

https://mm-v3.vercel.app/widget?theme=blue

HTML код:

<iframe 
  src="https://mm-v3.vercel.app/widget?theme=blue" 
  width="100%" 
  height="200" 
  frameborder="0"
  scrolling="no"
></iframe>

Тема: purple

Код для вставки:

https://mm-v3.vercel.app/widget?theme=purple

HTML код:

<iframe 
  src="https://mm-v3.vercel.app/widget?theme=purple" 
  width="100%" 
  height="200" 
  frameborder="0"
  scrolling="no"
></iframe>

Тема: orange

Код для вставки:

https://mm-v3.vercel.app/widget?theme=orange

HTML код:

<iframe 
  src="https://mm-v3.vercel.app/widget?theme=orange" 
  width="100%" 
  height="200" 
  frameborder="0"
  scrolling="no"
></iframe>

Тема: red

Код для вставки:

https://mm-v3.vercel.app/widget?theme=red

HTML код:

<iframe 
  src="https://mm-v3.vercel.app/widget?theme=red" 
  width="100%" 
  height="200" 
  frameborder="0"
  scrolling="no"
></iframe>

Как использовать разные темы

Доступные темы:

  • default - Зеленая тема (по умолчанию)
  • blue - Синяя тема
  • purple - Фиолетовая тема
  • orange - Оранжевая тема
  • red - Красная тема

Использование:

Добавьте параметр ?theme=название_темы к URL виджета. Например: https://mm-v3.vercel.app/widget?theme=blue

JavaScript код для динамической загрузки:

// Создание iframe с выбранной темой
function createWidget(theme = 'default') {
  const iframe = document.createElement('iframe');
  iframe.src = `https://mm-v3.vercel.app/widget?theme=${theme}`;
  iframe.width = '100%';
  iframe.height = '200';
  iframe.frameBorder = '0';
  iframe.scrolling = 'no';
  
  // Добавляем в контейнер
  document.getElementById('widget-container').appendChild(iframe);
}

// Пример использования
createWidget('blue'); // Синяя тема
createWidget('purple'); // Фиолетовая тема