Bannery

Obrázky, na které budete odkazovat, můžete nahrát v sekci Vzhled a obsah > Správce souborů. Obrázek nahrajete kliknutím na ikonku šipky nahoru v levém horném rohu. Jeho adresu poté získáte pravým kliknutím a vybráním Show URL

 

1. Homepage

Nastavení bannerů na Homepage najdete v sekci Vzhled a obsah > Bannery > Doplňkové bannery

 

Bannery pod carouselem:

Nastavení pro tento banner je následující:

• Název: Je pouze interní, nezobrazuje se na e-shopu
• Pozice: Top, je připraveno pro 2 bannery
• Popis obrázku: Nadpis banneru (LEGO Star Wars / Lego Jurský Svět)
• Název banneru: Označení banneru, pro správné formátování je nutné mít v <small> tagu.

  
                  <small>Široká nabídka</small> LEGO® Star Wars™
              

• Text odkazu: Text uvnitř tlačítka
• Cílová URL adresa: Kam má banner směřovat

Nastavení vypadá pak nějak takto:

 

Banner Dárky:

 

Zde naleznete HTML kód pro další doplňkový banner, jehož nastavení bude:

• Název: Je pouze interní, nezobrazuje se na e-shopu
• Pozice: Zápatí, pouze pro tento banner

 

        <div class="darky">
            <h2 class="darky__header">Vyhledejte dokonalý dárek</h2>
            <ul class="darky__list">
                <li class="darky__item">
                    <a href="/pro-holky/" class="darky__link">
                    <img
                        src="https://343520.myshoptet.com/user/documents/templates/thetoystore/assets/darky/darek_1_696_450.jpg"
                        alt="Pro holky"
                        width="464"
                        height="300"
                    />
                    <h3 class="darky__title darky__title--inverse">Pro holky</h3>
                    </a>
                </li>
                <li class="darky__item">
                    <a href="/pro-kluky/" class="darky__link">
                    <img
                        src="https://343520.myshoptet.com/user/documents/templates/thetoystore/assets/darky/darek_2_696_450.jpg"
                        alt="Pro kluky"
                        width="464"
                        height="300"
                    />
                    <h3 class="darky__title">Pro kluky</h3>
                    </a>
                </li>
                <li class="darky__item">
                    <a href="/pro-nejmensi/" class="darky__link">
                    <img
                        src="https://343520.myshoptet.com/user/documents/templates/thetoystore/assets/darky/darek_3_696_450.jpg"
                        alt="Pro nejmenší"
                        width="464"
                        height="300"
                    />
                    <h3 class="darky__title">Pro nejmenší</h3>
                    </a>
                </li>
            </ul>
        </div>
    

V tomto HTML kódu můžete upravit veškeré textace a obrázky:

• Odkazy upravíte v elementu <a> v href atributu, kde vyměníte odkaz.
• Odkazy na obrázky upravíte v elementu <img>, kde vyměníte odkaz v atributu src.
• Další obrázek s textem můžete přidat zkopírováním tohoto kódu a vložením někam za </li>:

  
                  <li class="darky__item">
                      <a href="/pro-kluky/" class="darky__link">
                      <img
                          src="https://343520.myshoptet.com/user/documents/templates/thetoystore/assets/darky/darek_2_696_450.jpg"
                          alt="Pro kluky"
                          width="464"
                          height="300"
                      />
                      <h3 class="darky__title">Pro kluky</h3>
                      </a>
                  </li>
              

2. Bannery v kategorii

Nastavení bannerů v kategorii najdete v sekci Vzhled a obsah > Bannery > Bannery

Vytvoříte banner, který bude mít takové nastavení:

Po vytvoření banneru je nutné jít do Vzhled a obsah > Prvky, kde z Koše přetáhnete banner do Zápatí, viz. obrázek a uložit

3. Banner registrace v kategorii

Zde se bude jednat o další HTML banner, jehož kód je:

        <div class="registration-category">
            <strong>Registrujte se a užívejte si výhod, které vám nabízíme</strong>
            <p>Získejte až 10% slevu na nákup za registraci</p>
            <a href="/registrace/">Registrovat</a>
        </div>
    

Po vytvoření banneru je nutné jít do Vzhled a obsah > Prvky, kde z Koše přetáhnete banner do Zápatí

4. Banner registrace vedle přihlášení

Zde se bude jednat o další HTML banner, jehož kód je:

        <div class="registration-banner-login">
            <h2>Ještě nemáte účet?</h2>
            <p>Zaregistrujte se a získejte spousty výhod!</p>
            <ul>
                <li>Informace o stavu objednávky</li>
                <li>Zapojení se do programu Bonus+</li>
                <li>Historie všech vašich objednávek</li>
                <li>Při objednávce nemusíte vyplňovat znovu vaše údaje</li>
                <li>Přednostní přístup ke slevám</li>
                <li>Body za každý nákup</li>
            </ul>
        </div>    
    

Jeho nastavení bude vypadat tedy takto:

Po vytvoření banneru je nutné jít do Vzhled a obsah > Prvky, kde z Koše přetáhnete banner do Zápatí

5. Banner v menu

Tady se jedná o obrázkový banner, jehož nastavení je:

Nastavení pro tento banner je následující:

• Název: Je pouze interní, nezobrazuje se na e-shopu
• Popis obrázku: Nadpis banneru (LEGO® Star Wars™)
• Název banneru: Označení banneru, pro správné fungování je nutné zachovat kód a změnit pouze textace mimo < a > tagy.

  
                  < class="submenu-banner"><small>Limitovaná nabídka </small> Vybrané produkty ze série LEGO® Star Wars™</div>
              

• Text odkazu: Text uvnitř tlačítka
• Cílová URL adresa: Kam má banner směřovat

Nastavení vypadá pak nějak takto: