- [Case Studies](/kategorie/case-studies)
- [E‑commerce tipy](/kategorie/e-commerce-tipy)
- [E‑shopové riešenia a platformy](/kategorie/e-shopove-riesenia-platformy)
- [Mergado Pack](/kategorie/mergado-pack)
- [Mergado tipy](/kategorie/mergado-tipy)
- [Novinky v Mergade](/kategorie/novinky-v-mergade)
- [Novinky z porovnávačov cien](/kategorie/novinky-z-porovnavacov-cien)
- [Pracujeme s Mergadom](/kategorie/pracujeme-s-mergadom)
- [Rozhovory](/kategorie/rozhovory)
- [Rozšírenia](/kategorie/aplikacie)
- [S Mergadom do zahraničia](/kategorie/s-mergadom-do-zahranicia)
- [Zo života Mergada](/kategorie/zo-zivota-mergada)
1. [ Domov ](/)
2. [ Blog ](/blog)
3. **Rozhýbte obrazovú inzerciu správnym smerom s Feed Image Editor**
# **Rozhýbte obrazovú inzerciu správnym smerom s Feed Image Editor**
[  Petra Marková ](/blog/petra-markova)
18. 10. 2019
3 minúty čítania
Appka [Feed Image Editor](https://www.feed-image-editor.sk/) pridala v nedávnej dobe **ďalšie vylepšenia**. Spravovanie obrazovej inzercie je obohatené o možnosť **koláží z alternatívnych obrázkov** a do obehu prišlo aj nastavenie **aktivity šablóny** v čase. Čo ďalšie prináša tento nástroj pre e‑shop? Poďme sa spolu pozrieť.
function tableOfContents() {
return {
headings_menu: [],
heading_active: '', // Added to track the active section
shouldBeSticky: false,
generateToC() {
const headings = document.querySelectorAll('.js-article-full-headings h2, .js-article-full-headings h3');
let headingMap = {};
headings.forEach((heading) => { // Use an arrow function to maintain `this` context
// Normalize heading text to remove diacritics, then replace non-alphanumeric characters with dashes
var normalizedText = heading.textContent.normalize("NFD").replace(/[\u0300-\u036f]/g, ""); // Remove diacritics
var id = heading.id ? heading.id : normalizedText.trim().toLowerCase()
.split(' ').join('-').replace(/[^a-z0-9\-]/ig, ''); // Updated regex to replace non-alphanumeric characters
headingMap[id] = headingMap[id] !== undefined ? ++headingMap[id] : 0;
// Use the updated `id` with diacritics removed for the heading id and the TOC
const finalId = headingMap[id] ? `${id}-${headingMap[id]}` : id;
this.headings_menu.push({
id: finalId,
title: heading.textContent,
level: heading.tagName.toLowerCase(), // Track heading level
active: false, // Initially set active to false
});
heading.id = finalId;
});
},
checkStickyNeeded() {
const ul = this.$el.querySelector('ul');
if (ul) {
this.shouldBeSticky = ul.scrollHeight < window.innerHeight;
}
},
setActiveHeading() {
// disabled not working with active state on click
// add @scroll.window="setActiveHeading()" to the parent div
// const headings = document.querySelectorAll('.js-article-full-headings h2');
// let activeHeading = '';
// let closestHeadingDistance = Infinity;
// headings.forEach((heading) => {
// const rect = heading.getBoundingClientRect();
// const offset = rect.top - window.innerHeight / 2; // Consider heading in the middle of the screen as active
// if (offset < 0 && Math.abs(offset) < closestHeadingDistance) {
// activeHeading = heading.id;
// closestHeadingDistance = Math.abs(offset);
// }
// });
// // Update the active state in headings_menu
// if (activeHeading !== this.heading_active) {
// this.headings_menu = this.headings_menu.map(item => ({
// ...item,
// active: item.id === activeHeading,
// }));
// this.heading_active = activeHeading;
// }
},
setActiveItem(clickedId) {
this.headings_menu.forEach(item => {
item.active = (item.id === clickedId);
});
this.heading_active = clickedId; // Optionally update the heading_active property if used
},
};
}
1. —
Appka [Feed Image Editor](https://www.feed-image-editor.sk/) pridala v nedávnej dobe **ďalšie vylepšenia**. Spravovanie obrazovej inzercie je obohatené o možnosť **koláží z alternatívnych obrázkov** a do obehu prišlo aj nastavenie **aktivity šablóny** v čase. Čo ďalšie prináša tento nástroj pre e‑shop? Poďme sa spolu pozrieť.
## Bezchybná obrazová inzercia na pár kliknutí
Zabehnutou funkcionalitou, ktorú sme si ešte nestihli oficiálne predstaviť, je **tvorba koláží** z alternatívnych obrázkov. Užitočné vylepšenie predstavuje v prípade produktu s viacerými fotkami možnosť spojenia do prehľadného celku. K hlavnému obrázku tak môže užívateľ pripojiť alternatívu v podobe **iných pohľadov na produkt**, jeho **umiestnenie v priestore** či **reálny príklad používania**.
[Feed Image Editor](https://www.mergado.sk/tema/feed-image-editor) ponúka široký výber **prednastavených koláží**, ktoré nájde užívateľ v samotných šablónach. V časti *Vrstvy* je potrebné pri zdrojovom obrázku zaškrtnúť pole *Koláž z viacerých obrázkov*, kde sú možnosti na **rozloženie fotiek** a mnohé ďalšie voľby.
Takisto má k dispozícii možnosť pridať **vlastný návrh**. Prvým krokom je v nastavení nástroja zvoliť v poli *Koláž* záložku *Pridať vlastné rozloženie*. V ponuke je množstvo funkcií, vďaka ktorým si môžete napasovať obrázky podľa svojich preferencií. V časti *Náhľad* uvidíte celkový dizajn koláže produktu tak, ako bude vyzerať v e‑shope. Hlavnou výhodou koláže je **zefektívnenie procesu nákupu**, kedy sa zobrazia zákazníkovi všetky potrebné informácie naraz.
[  ](https://www.mergado.sk/sites/default/files/perm/paragraph-image/kolazefie.png)
## Novinka, ktorú si rozhodne všimnete
Aktuálnou novinkou z dielne FIE je aj **časovanie šablóny**. Zabudnite na ručnú aktiváciu šablón produktov. [Automatizácia](https://www.mergado.sk/mergadofest2019) prenikla aj do radov obrazovej inzercie. Po novom pridáte v nastavení aktivity **konkrétny dátum** na zapnutie a vypnutie šablóny. Táto funkcia sa vzťahuje na danú šablónu s **konkrétnym výberom produktov**, alebo na **celý sortiment**.
Prehľadnosť aktivity je v zozname šablón rozlíšená aj vizuálne — svetlé polia zvýrazňujú **aktívne** šablóny a šedé **neaktívne**. Časovanie nájdete v nastaveniach šablóny, kde pribudlo dátumové pole. Výsledný efekt prináša najmä **uľahčenie práce s kampaňmi** na vašom e‑shope.
[  ](https://www.mergado.sk/sites/default/files/perm/paragraph-image/aktivitafie.png)
## Dajte kvalite fotiek nový význam
Na [Feed Image Editor](https://www.mergado.sk/mergadofest2019) sa môžete so svojim e‑shopom spoľahnúť najmä v prípade **kvality obrázkov**. Aktuálne je nástroj v beta verzii testovania kvality obrázkov. V sekcii *Produkt* a *Kvalita obrázkov* si dokážete overiť, či vaše obrázky spĺňajú **požadované parametre**.
Pomocou pár jednoduchých krokov viete zistiť **aktuálny stav** obrázkov na daný výber produktov, alebo sortiment e‑shopu. **Kontrola obrázkov** vie poukázať napr. na neostré fotky, ktoré sa zobrazia po vyfiltrovaní v zozname *V poriadku* alebo *Nie je v poriadku*. Zároveň si môžete manuálne nastaviť formu podľa jeho reálnych preferencií v sekcií *Stav nastavený užívateľom.*
Tým FIE kontrolu kvality obrázkov neustále **zdokonaľuje** a spätná väzba užívateľov je dôležitá. **Dajte nám vedieť**, ako sa vám s týmto nástrojom pracuje, aby sa mohol posúvať vyššie.
[  ](https://www.mergado.sk/sites/default/files/perm/paragraph-image/kvalitafie.png)
Aplikácia Feed Image Editor vám pomáha držať produktové **obrázky neustále pod kontrolou**. Ak ju ešte nevyužívate, rozhodne stojí za vyskúšanie. **Na 10 dní zadarmo** a s nabitou ponukou nástrojov v našom [Mergado Store](https://store.mergado.com/).
## Mohlo by vás zaujímať:
[ 
### Feed Image Editor predstavuje novú podstránku Nastavenie a ďalšie letné novinky
](/fie-novinky-jul)
[ 
### Praktické tipy využití Feed Image Editoru
](https://www.mergado.cz/blog/prakticke-tipy-vyuziti-feed-image-editoru)
[ 
### Zahájte festivalovú sezónu nadupanou konferenciou Mergado Fest
](/blog/zahajte-festivalovu-sezonu-na-mergado-feste)
- [ AdForm ](/tema/adform)
[  ](/blog/petra-markova)### [ Petra Marková ](/blog/petra-markova)
Slovenský trh a ľubozvučnú slovenčinu má v Mergade na starosti content špecialistka Petra. Textuje, bloguje, prekladá a s vášňou tvorí obsah na sociálne siete. A keď práve nehľadá tie správne slová, venuje svoj čas bytovej džungli, pečeniu, kaviarňam alebo cestovaniu.
## Mohlo by vás *zaujímať*
[ 
### Zahájte festivalovú sezónu nadupanou konferenciou Mergado Fest
](/blog/zahajte-festivalovu-sezonu-na-mergado-feste)
[ 
### Ako optimalizácia feedu zvýšila výkon Meta Ads bez navýšenia rozpočtu
](/blog/optimalizace-feedu-pro-Meta-Ads)
[ 
### Ako úspešne predávať na idealo
](/blog/uspesny-prodej-na-idealo)
## Nenechajte si nič *ujsť*
Prihláste sa k odberu nášho newslettera
Prihlásením súhlasíte s tým, že vaše údaje budeme spracovávať v súlade s našimi [zásadami ochrany osobných údajov](/vyhlasenie-o-cookies).
Ďakujeme, úspešne ste sa pripojili k nášmu zoznamu odberateľov.
function ml_webform_success_5807248() {
var r = ml_jQuery || jQuery
r('.ml-subscribe-form-5807248 .row-success').show(), r('.ml-subscribe-form-5807248 .row-form').hide()
}