Blok Siatka (Orion Shop)
Blok "Siatka" (Orion Shop)


Wywołanie bloku na stronach sklepu internetowego ID — grid

Przed użyciem kodu przeczytaj instrukcję dotyczącą wywoływania bloków na dodatkowych stronach - Czytaj dalej
    <!-- Blok „Siatka” -->

{$props = [
  'template' => 'one',
  'color_scheme' => 'main',
  'no_margin' => false,
  'title' => [
    'align' => 'left',
    'size' => 'medium, H2',
    'text' => ''
  ],
  'cards' => [
    '1' => [
      'template' => 'card-two',
      'color_scheme' => 'main',
      'lazy' => false,
      'gradient' => true,
      'name' => 'Co to jest Lorem Ipsum?',
      'link' => '#',
      'desc' => 'Istnieje wiele odmian Lorem Ipsum',
      'image' => 'img/600x600.png',
      'badge' => 'Popularny',
      'width' => 700,
      'height' => 700
    ],
    '2' => [
      'template' => 'card-two',
      'color_scheme' => 'main',
      'lazy' => false,
      'gradient' => true,
      'name' => 'Dlaczego jest używany?',
      'link' => '#',
      'desc' => 'Podczas oceny kompozycji czytelny tekst przeszkadza w koncentracji.',
      'image' => 'img/600x600.png',
      'badge' => '',
      'width' => 700,
      'height' => 700
    ],
    '3' => [
      'template' => 'card-two',
      'color_scheme' => 'main',
      'lazy' => false,
      'gradient' => true,
      'name' => 'Skąd się wziął?',
      'link' => '#',
      'desc' => 'Istnieje wiele odmian Lorem Ipsum',
      'image' => 'img/600x600.png',
      'badge' => '',
      'width' => 700,
      'height' => 700
    ],
    '4' => [
      'template' => 'card-two',
      'color_scheme' => 'main',
      'lazy' => false,
      'gradient' => true,
      'name' => 'Gdzie mogę go zdobyć?',
      'link' => '#',
      'desc' => 'Podczas oceny kompozycji czytelny tekst przeszkadza w koncentracji.',
      'image' => 'img/600x600.png',
      'badge' => '',
      'width' => 700,
      'height' => 700
    ],
    '5' => [
      'template' => 'card-two',
      'color_scheme' => 'main',
      'lazy' => false,
      'gradient' => true,
      'name' => 'Co to jest Lorem Ipsum?',
      'link' => '#',
      'desc' => 'Istnieje wiele odmian Lorem Ipsum',
      'image' => 'img/600x600.png',
      'badge' => '',
      'width' => 700,
      'height' => 700
    ]
  ]
]}

{call add_block block="grid" props=$props}


Możliwe wartości konfiguracyjne bloku „Karuzela”:

Właściwość Typ danych Opis
template String Szablon bloku. Dopuszczalne wartości: 'one' lub 'two'
color_scheme String Schemat kolorów bloku. Dopuszczalne wartości: 'main', 'alter' lub 'semitone'
no_margin Boolean Wartość true usuwa górny margines bloku.
title Object Element „Tytuł” Więcej...
cards[1].template String Szablon karty, wartość 'card-two'
cards[1].color_scheme String Schemat kolorów elementu. Dopuszczalne wartości: 'main', 'alter' lub 'semitone'
cards[1].lazy Boolean Wartość true stosuje leniwe ładowanie do obrazów
cards[1].gradient Boolean Wartość true dodaje przyciemnienie tła
cards[1].name String Nazwa karty
cards[1].link String URL linku elementu
cards[1].desc String Tekst karty
cards[1].image String Ścieżka do tła obrazu karty w odniesieniu do folderu z tematem.
cards[1].badge String Odznaka
cards[1].width Integer Podstawowa szerokość elementu
cards[1].height Integer Podstawowa wysokość elementu