Moje zakázka na “Vylepšení vzhledu eshopu”

Dostal se mi pod ruku eshop od klienta, který ho chtěl oživit a poslal mi základ informace, oživit eshop, udělat hezčí HP, na šabloně mít 3 produkty vedle sebe. Pustil jsem se do práce a v průběhu jsem s klientem ladil co by rád upravil nebo přidal, z pohledu klienta se ledasco může zdát banálním zákrokem, ale mnohdy se musí zasáhnout do struktury CSS, která pak ovlivňuje jiná zobrazení.

Začal jsem tedy studovat eshop a našel jsem několik nedostatků, tady popíši co jsem s nimi dělal.

Na homepage eshopu je slider s bannery, ty jsem musel všechny sjednotit, měly totiž každý jinou výšku a při střídání tak rozhazovaly vzhled, bohužel se ke mě nedostaly zdrojové obrázky, na které byla použita zřejmě špatná komprese a tak jsem se je snažil lehce opravit chytrým doostřením a doplněním výšky retuší. Vždy je totiž potřeba nahrát všechny slidery ve stejném rozměru, šířka je stanovená a to 1200px, na výšce tolik nezáleží, ale když bude mít jeden slider 300px a druhý 500px, bude to nepříjemně přeskakovat.

Celý příspěvek “Moje zakázka na “Vylepšení vzhledu eshopu””

Neviditelné pozadí u fotografií produktu

Poslední roky se u produktové fotografie “tlačí” na produkty v bílém pozadí, co když ale nemáte na eshopu bílé pozadí nebo chcete dokonce použít tmavé? Je jasné, že výsledný efekt změny CSS stylu nemusí být podle Vašich představ a dost pravděpodobně za to budou moci produkty v bílých čtverečkách, následné předělání pozadí u každé fotografie zvlášť by bylo pak časově náročné. Vyhnout se tomu můžete hned na začátku zadávání vyhotovení produktové fotografie. Pokud si necháte nafotografované produkty ořezat v softwaru a poté uložit do formátu .png, tak se tyto fotografie přizpůsobí pozadí prostředí, ve kterém jsou.

Pro tuto ukázku jsem vytvořil eshop a na něm předvedu výsledný efekt. Původní šablona měla světlé pozadí, ale já chtěl tmavé. Posuďte sami:

Celý příspěvek “Neviditelné pozadí u fotografií produktu”

Jak vložit na eshop fans box s odkazem na Vaši Facebookovou stránku

Ukážeme si jak jednoduše vložit do patičky eshopu Page Plugin, který je přímým nástupcem like boxu, hojně používaného na většině webových stránkách. Nejen že tento plugin má modernější vzhled, ale také přibyly nové funkce:

  • zobrazují se události a zprávy
  • možnost zobrazení úvodní fotky
  • Call-to action tlačítko / Dát stránce “To se mi líbí”, nebo sdílet

Vygenerování kódu Page Pluginu

Na adrese facebook for developers si snadno vygenerujeme kód pro vložení na stránky.

V tomto formuláři vyplníte URL facebookové stránky na kterou chcete odkazovat, dáte jí šířku a výšku v px, která se v reálném čase zobrazuje dole v generátoru a Vy tak ihned vidíte jak bude box vypadat. Dále tam jsou 4 zaškrtávací políčka kde nastavujete zda chcete velkou či malou hlavičku, zda chcete schovat úvodní obrázek, zda chcete přizpůsobit šířku přednastaveného modulu na Vašem eshopu (doporučuji nechat zaškrtnuté) a poslední, zda chcete schovat tváře Vašich přátel fb stránky.

Celý příspěvek “Jak vložit na eshop fans box s odkazem na Vaši Facebookovou stránku”

Proč používat doplněk Google Analytics URL Builder – vytvoří vám snadno odkaz s UTM parametry

Sledování odkazu díky UTM je jednou ze základních funkcí, která Vám dopomáhá k vyhodnocování úspěšnosti kampaní a Google Chrome na to má vynikající doplněk.

Předpokládám, že Google Analytics znáte dobře všichni, v tomto článku si ukážeme jak jednoduše a rychle nastavit UTM k odkazu, který chcete měřit.

Nejprve si stáhněte doplněk Google Analytics URL builder: https://chrome.google.com/webstore/detail/google-analytics-url-buil/gaidpiakchgkapdgbnoglpnbccdepnpk

V prohlížeči Google Chrome se objevil tento doplněk ve tvaru nákupního košíku:

Celý příspěvek “Proč používat doplněk Google Analytics URL Builder – vytvoří vám snadno odkaz s UTM parametry”

Nový návod na napojení ExitShopu na AffilBox.cz

Nedávno provedl Affilbox nějaké změny, pokud jej používáte, zde je nový návod.

Napojte si Váš eshop na provizní program Affilbox, je to jednoduché, stačí postupovat podle návodu.

Před nasazením kódů si vytvořte subdoménu pro váš provizní program.
Díky tomu budete mít trackovaci i konverzní kód ve tvaru vaší domény a budete tak mít vyšší úspěšnost dosledování objednávek.

V administraci v levém menu klikněte na položku Obchody

Celý příspěvek “Nový návod na napojení ExitShopu na AffilBox.cz”

Oživení pozadí na eshopu

Dobrý den, snažím se nějakým jednoduchým způsobem oživit eshop aniž bych musel jakkoliv zasahovat do šablony nebo barev prvků. Jelikož jsou Vánoce za dveřmi, napadlo mě vytvořit tématické pozadí právě na ně.

Provozujeme ostrý eshop a já si potřeboval někde to pozadí otestovat, tak jsem ostrou verzi eshopu jednoduše zkopírovat a nazval jí jako testovací verzi, tak si mohu hrát dle libosti, reálně vidím jak bude eshop ve výsledku vypadat a nijak tím neuškodím veřejné verzi kde probíhají denně nákupy.


Sehnal jsem si pozadí, které mi vyhovuje nahrál ho na server v globálním nastavení

a vytvořil jsem jeden řádek kódu, který stačí vložit do vlastního CSS:

body {
    background-image: url("https://www.exitshop.cz/files/1681/media/files/TTTq(2).png")
}  

Tím se obrázek opakuje do nekonečna.


Když už jsem se do toho pustil, napadlo mě vytvořit dalších pár verzí na roční období, kdy jsen v kódu pouze změnil url obrázku v url(“xxx“). Tímto jednoduchým způsobem se dá změnit pozadí podle libosti. Je však důležité mít obrázek upravený tak aby při nekonečném opakování neměl žádné přechodové linky nebo useknuté konce, návaznost nekonečna by pak nefungovala esteticky.

Přikládám PrintScreeny obrazovky jak se mi vedlo. Rád bych se dozvěděl Vaše názory na pozadí v eshopu, zda je také používáte a jestli není lepší používat něco nevýrazného. V této sérii bylo záměrem abych upozornil na aktuální děj, tedy Vánoce a následně roční období. Co si o tom myslíte?